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