diff --git a/src/components/VStep.vue b/src/components/VStep.vue index 3800522..8aff587 100644 --- a/src/components/VStep.vue +++ b/src/components/VStep.vue @@ -77,6 +77,12 @@ export default { stopOnFail: { type: Boolean }, + continueWhenFail: { + type: Boolean + }, + forward: { + type: Boolean + }, debug: { type: Boolean } @@ -128,6 +134,12 @@ export default { this.$emit('targetNotFound', this.step) if (this.stopOnFail) { this.stop() + } else if (this.continueWhenFail) { + if (this.forward) { + this.nextStep() + } else { + this.previousStep() + } } } } @@ -176,15 +188,17 @@ export default { }, removeHighlight () { if (this.isHighlightEnabled()) { - const target = this.targetElement - const currentTransition = this.targetElement.style.transition - this.targetElement.classList.remove(HIGHLIGHT.classes.targetHighlighted) - this.targetElement.classList.remove(HIGHLIGHT.classes.targetRelative) - // Remove our transition when step is finished. - if (currentTransition.includes(HIGHLIGHT.transition)) { - setTimeout(() => { - target.style.transition = currentTransition.replace(`, ${HIGHLIGHT.transition}`, '') - }, 0) + if (this.targetElement) { + const target = this.targetElement + const currentTransition = this.targetElement.style.transition + this.targetElement.classList.remove(HIGHLIGHT.classes.targetHighlighted) + this.targetElement.classList.remove(HIGHLIGHT.classes.targetRelative) + // Remove our transition when step is finished. + if (currentTransition.includes(HIGHLIGHT.transition)) { + setTimeout(() => { + target.style.transition = currentTransition.replace(`, ${HIGHLIGHT.transition}`, '') + }, 0) + } } } }, diff --git a/src/components/VTour.vue b/src/components/VTour.vue index 20a16dc..cba7238 100644 --- a/src/components/VTour.vue +++ b/src/components/VTour.vue @@ -27,10 +27,12 @@ :finish="finish" :is-first="isFirst" :is-last="isLast" + :forward="forward" :labels="customOptions.labels" :enabled-buttons="customOptions.enabledButtons" :highlight="customOptions.highlight" :stop-on-fail="customOptions.stopOnTargetNotFound" + :continue-when-fail="customOptions.continueWhenTargetNotFound" :debug="customOptions.debug" @targetNotFound="$emit('targetNotFound', $event)" > @@ -66,7 +68,8 @@ export default { }, data () { return { - currentStep: -1 + currentStep: -1, + forward: true } }, mounted () { @@ -144,6 +147,7 @@ export default { let futureStep = this.currentStep - 1 let process = () => new Promise((resolve, reject) => { + this.forward = false this.customCallbacks.onPreviousStep(this.currentStep) this.currentStep = futureStep resolve() @@ -167,6 +171,7 @@ export default { let futureStep = this.currentStep + 1 let process = () => new Promise((resolve, reject) => { + this.forward = true this.customCallbacks.onNextStep(this.currentStep) this.currentStep = futureStep resolve() diff --git a/src/shared/constants.js b/src/shared/constants.js index 3e7c2c4..afebd29 100644 --- a/src/shared/constants.js +++ b/src/shared/constants.js @@ -23,6 +23,7 @@ export const DEFAULT_OPTIONS = { }, startTimeout: 0, stopOnTargetNotFound: true, + continueWhenTargetNotFound: false, useKeyboardNavigation: true, enabledNavigationKeys: { escape: true,