Tour

Tour

Class representing the site tour

Constructor

new Tour(options) → {Tour}

Parameters:
Name Type Description
options Object

The options for the tour

Properties
Name Type Description
confirmCancel boolean

If true, will issue a window.confirm before cancelling

confirmCancelMessage string

The message to display in the confirm dialog

classPrefix string

The prefix to add to all the shepherd-* class names.

defaultStepOptions Object

Default options for Steps (Step#constructor), created through addStep

exitOnEsc boolean

Exiting the tour with the escape key will be enabled unless this is explicitly set to false.

keyboardNavigation boolean

Navigating the tour via left and right arrow keys will be enabled unless this is explicitly set to false.

modalContainer HTMLElement

An optional container element for the modal. If not set, the modal will be appended to document.body.

steps Array.<object> | Array.<Step>

An array of step options objects or Step instances to initialize the tour with

tourName string

An optional "name" for the tour. This will be appended to the the tour's dynamically generated id property -- which is also set on the body element as the data-shepherd-active-tour attribute whenever the tour becomes active.

useModalOverlay boolean

Whether or not steps should be placed above a darkened modal overlay. If true, the overlay will create an opening around the target element so that it can remain interactive

Source:

Extends

  • Evented

Classes

Tour

Methods

addStep(options, index) → {Step}

Adds a new step to the tour

Parameters:
Name Type Description
options Object | Step

An object containing step options or a Step instance

index number

The optional index to insert the step at. If undefined, the step is added to the end of the array.

Source:

addSteps(steps)

Add multiple steps to the tour

Parameters:
Name Type Description
steps Array.<object> | Array.<Step>

The steps to add to the tour

Source:

back()

Go to the previous step in the tour

Source:

cancel()

Calls _done() triggering the 'cancel' event If confirmCancel is true, will show a window.confirm before cancelling

Source:

complete()

Calls _done() triggering the complete event

Source:

getById(id) → {Step}

Gets the step from a given id

Parameters:
Name Type Description
id Number | String

The id of the step to retrieve

Source:

getCurrentStep() → {Step|null}

Gets the current step

Source:

hide()

Hide the current step

Source:

isActive() → {boolean}

Check if the tour is active

Source:

next()

Go to the next step in the tour If we are at the end, call complete

Source:

removeStep(name)

Removes the step from the tour

Parameters:
Name Type Description
name String

The id for the step to remove

Source:

show(key, forward)

Show a specific step in the tour

Parameters:
Name Type Default Description
key Number | String 0

The key to look up the step by

forward Boolean true

True if we are going forward, false if backward

Source:

start()

Start the tour

Source: