Skip to content

Commit

Permalink
feat: add options to change navigation buttons text
Browse files Browse the repository at this point in the history
allow to change the navigation buttons text without modifying the whole slot
usefull for translation
fix some lint error
  • Loading branch information
Lionel Bijaoui committed Aug 23, 2018
1 parent 64eb8d1 commit f1a4302
Show file tree
Hide file tree
Showing 3 changed files with 32 additions and 11 deletions.
31 changes: 21 additions & 10 deletions src/components/VStep.vue
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,10 @@

<slot name="actions">
<div class="v-step__buttons">
<button @click.prevent="stop" v-if="!isLast" class="v-step__button">Skip tour</button>
<button @click.prevent="previousStep" v-if="!isFirst" class="v-step__button">Previous</button>
<button @click.prevent="nextStep" v-if="!isLast" class="v-step__button">Next</button>
<button @click.prevent="stop" v-if="isLast" class="v-step__button">Finish</button>
<button @click.prevent="stop" v-if="!isLast" class="v-step__button" v-text="textSkip"></button>
<button @click.prevent="previousStep" v-if="!isFirst" class="v-step__button" v-text="textPrevious"></button>
<button @click.prevent="nextStep" v-if="!isLast" class="v-step__button" v-text="textNext"></button>
<button @click.prevent="stop" v-if="isLast" class="v-step__button" v-text="textEnd"></button>
</div>
</slot>

Expand All @@ -27,10 +27,10 @@
</template>

<script>
import Popper from "popper.js";
import jump from "jump.js";
import sum from "hash-sum";
import { DEFAULT_STEP_OPTIONS } from "../shared/constants";
import Popper from 'popper.js'
import jump from 'jump.js'
import sum from 'hash-sum'
import { DEFAULT_STEP_OPTIONS } from '../shared/constants'
export default {
name: 'v-step',
Expand All @@ -52,6 +52,18 @@ export default {
},
isLast: {
type: Boolean
},
textSkip: {
type: String
},
textPrevious: {
type: String
},
textNext: {
type: String
},
textEnd: {
type: String
}
},
data () {
Expand Down Expand Up @@ -82,7 +94,7 @@ export default {
offset: this.step.offset || 0,
callback: undefined,
a11y: false
};
}
jump(targetElement, jumpOptions);
// targetElement.scrollIntoView({ behavior: "smooth" });
Expand All @@ -97,7 +109,6 @@ export default {
console.error('[Vue Tour] The target element ' + this.step.target + ' of .v-step[id="' + this.hash + '"] does not exist!')
this.$emit('targetNotFound', this.step)
}
' of .v-step[id="' +
},
mounted () {
this.createStep()
Expand Down
4 changes: 4 additions & 0 deletions src/components/VTour.vue
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,10 @@
:stop="stop"
:isFirst="isFirst"
:isLast="isLast"
:text-skip="customOptions.text.skip"
:text-previous="customOptions.text.previous"
:text-next="customOptions.text.next"
:text-end="customOptions.text.end"
>
<!--<div v-if="index === 2" slot="actions">
<a @click="nextStep">Next step</a>
Expand Down
8 changes: 7 additions & 1 deletion src/shared/constants.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,13 @@ export const DEFAULT_CALLBACKS = {

export const DEFAULT_OPTIONS = {
useKeyboardNavigation: true,
startTimeout: 0
startTimeout: 0,
text: {
skip: 'Skip tour',
previous: 'Previous',
next: 'Next',
end: 'Finish'
}
}

export const DEFAULT_STEP_OPTIONS = {
Expand Down

0 comments on commit f1a4302

Please sign in to comment.