github/mealie
1
0
Fork 0
mirror of https://github.com/hay-kot/mealie.git synced 2025-08-24 23:35:22 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Bind to variable properly

Browse source
This commit is contained in:
Daniel O'Connor 2025-02-01 04:26:18 +00:00
commit 4c34c61ce5
1 changed files with 12 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

19
frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageInstructionPlayer.vue
View file

@ -1,7 +1,8 @@
<template> <template>
<span class="v-btn__content"> <span class="v-btn__content">
<i v-if="!playing.value" aria-hidden="true" class="v-icon notranslate mdi mdi-play theme--dark" @click.stop="play"></i> <i v-if="!playing" aria-hidden="true" class="v-icon notranslate mdi mdi-play theme--dark" @click.stop="play"></i>
<i v-if="playing.value" aria-hidden="true" class="v-icon notranslate mdi mdi-pause theme--dark" @click.stop="pause"></i> <i v-if="playing" aria-hidden="true" class="v-icon notranslate mdi mdi-pause theme--dark" @click.stop="pause"></i>
<i v-if="playing" aria-hidden="true" class="v-icon notranslate mdi mdi-pause theme--dark" @click.stop="resume"></i>
</span> </span>
</template> </template>
@ -26,11 +27,9 @@ export default defineComponent({
return { return {
playing: false, playing: false,
played: false, played: false,
paused: false,
utterance: null, utterance: null,
currentIndex: { currentIndex: 0
type: Number,
default: 0
}
} }
}, },
methods: { methods: {
@ -44,6 +43,7 @@ export default defineComponent({
this.utterance.onstart = (event) => { this.utterance.onstart = (event) => {
self.playing = true; self.playing = true;
self.played = false; self.played = false;
self.paused = false;
// self.$emit("playing", true); // TODO: Consider if this event should bubble or a proxy of it should. // self.$emit("playing", true); // TODO: Consider if this event should bubble or a proxy of it should.
console.debug("Now playing: " + this.step.text); console.debug("Now playing: " + this.step.text);
@ -51,6 +51,7 @@ export default defineComponent({
this.utterance.onend = () => { this.utterance.onend = () => {
self.playing = false; self.playing = false;
self.played = true; self.played = true;
self.paused = false;
// self.$emit("playing", false); // self.$emit("playing", false);
console.debug("Playback complete"); console.debug("Playback complete");
@ -58,10 +59,12 @@ export default defineComponent({
this.utterance.onpause = () => { this.utterance.onpause = () => {
self.playing = false; self.playing = false;
self.paused = true;
}; };
this.utterance.onresume = () => { this.utterance.onresume = () => {
self.playing = true; self.playing = true;
self.paused = false;
}; };
this.utterance.onboundary = (event) => { this.utterance.onboundary = (event) => {
@ -84,8 +87,10 @@ export default defineComponent({
return true; return true;
}, },
pause() { pause() {
console.log("Stop playing");
speechSynthesis.pause(); speechSynthesis.pause();
},
resume() {
speechSynthesis.resume();
} }
} }
}); });