diff --git a/src/App.vue b/src/App.vue index cc8e63e..fa4fa43 100644 --- a/src/App.vue +++ b/src/App.vue @@ -6,7 +6,7 @@ {{mensa.name}} - Wann? + Wann? {{dayOfWeek[day]}} @@ -28,9 +28,9 @@ import Mensen from '@/lib/Mensen.js' export default { name: 'app', - data () { + data() { return { - menu: {}, + selWhen: {}, mensen: Mensen, days: [1, 2, 3, 4, 5, 6], dayOfWeek: { @@ -44,24 +44,24 @@ export default { } }, methods: { - previousDay () { - this.when === 1 ? this.when = 6 : this.when-- + previousDay() { + this.when === 1 ? (this.when = 6) : this.when-- }, - nextDay () { - this.when === 6 ? this.when = 1 : this.when++ + nextDay() { + this.when === 6 ? (this.when = 1) : this.when++ } }, filters: { - noBreak (value) { + noBreak(value) { return value.replace(/\s/g, '\u00a0') } }, computed: { where: { - get () { + get() { return this.$store.state.where }, - set (value) { + set(value) { this.$store.dispatch('loadMeals', { when: this.when, where: value @@ -69,10 +69,10 @@ export default { } }, when: { - get () { + get() { return this.$store.state.when }, - set (value) { + set(value) { this.$store.dispatch('loadMeals', { when: value, where: this.where @@ -80,32 +80,44 @@ export default { } } }, - created () { + created() { this.$store.dispatch('loadMeals', { when: this.when, where: this.where }) let vm = this - document.onkeydown = (evt) => { + document.onkeydown = evt => { evt = evt || window.event switch (evt.keyCode) { case 37: - vm.previousDay() + if (vm.selWhen !== document.activeElement) { + // increment only if selection is not focused, avoid double execution + vm.previousDay() + } break case 39: - vm.nextDay() - break + if (vm.selWhen !== document.activeElement) { + // increment only if selection is not focused, avoid double execution + vm.nextDay() + break + } } } + }, + mounted() { + this.selWhen = document.getElementById('selWhen') } } - - + +