From 59050c1018ecf9827d0bbb98058a7da4740813b9 Mon Sep 17 00:00:00 2001
From: Alain Nussbaumer <alain.nussbaumer@alleluia.ch>
Date: Sat, 24 May 2025 09:21:36 +0200
Subject: [PATCH] [web] Add helper methods in stores

---
 web-src/src/components/ControlMainVolume.vue  | 19 +++++++++++--------
 web-src/src/components/ControlPlayerBack.vue  |  6 +-----
 .../src/components/ControlPlayerForward.vue   |  6 +-----
 web-src/src/components/ControlPlayerNext.vue  |  2 +-
 web-src/src/components/ControlPlayerPlay.vue  |  2 +-
 .../src/components/ControlPlayerPrevious.vue  |  2 +-
 6 files changed, 16 insertions(+), 21 deletions(-)

diff --git a/web-src/src/components/ControlMainVolume.vue b/web-src/src/components/ControlMainVolume.vue
index f4ab4094..5e68ee81 100644
--- a/web-src/src/components/ControlMainVolume.vue
+++ b/web-src/src/components/ControlMainVolume.vue
@@ -8,7 +8,7 @@
     <div class="media-content">
       <div class="is-size-7 is-uppercase" v-text="$t('navigation.volume')" />
       <control-slider
-        v-model:value="player.volume"
+        v-model:value="playerStore.volume"
         :max="100"
         @change="changeVolume"
       />
@@ -26,7 +26,7 @@ export default {
   components: { ControlSlider },
   setup() {
     return {
-      player: usePlayerStore()
+      playerStore: usePlayerStore()
     }
   },
   data() {
@@ -36,22 +36,25 @@ export default {
   },
   computed: {
     icon() {
-      return this.player.volume > 0 ? 'volume-high' : 'volume-off'
+      if (this.playerStore.isMuted) {
+        return 'volume-off'
+      }
+      return 'volume-high'
     }
   },
   watch: {
-    'player.volume'() {
-      if (this.player.volume > 0) {
-        this.volume = this.player.volume
+    'playerStore.volume'() {
+      if (!this.playerStore.isMuted) {
+        this.volume = this.playerStore.volume
       }
     }
   },
   methods: {
     changeVolume() {
-      player.setVolume(this.player.volume)
+      player.setVolume(this.playerStore.volume)
     },
     toggle() {
-      this.player.volume = this.player.volume > 0 ? 0 : this.volume
+      this.playerStore.volume = this.playerStore.isMuted ? this.volume : 0
       this.changeVolume()
     }
   }
diff --git a/web-src/src/components/ControlPlayerBack.vue b/web-src/src/components/ControlPlayerBack.vue
index 2fbe274e..46b8124e 100644
--- a/web-src/src/components/ControlPlayerBack.vue
+++ b/web-src/src/components/ControlPlayerBack.vue
@@ -26,11 +26,7 @@ export default {
   },
   computed: {
     disabled() {
-      return (
-        this.queueStore?.count <= 0 ||
-        this.playerStore.isStopped ||
-        this.queueStore.current.data_kind === 'pipe'
-      )
+      return this.queueStore.isEmpty || this.playerStore.isStopped
     },
     visible() {
       return ['podcast', 'audiobook'].includes(
diff --git a/web-src/src/components/ControlPlayerForward.vue b/web-src/src/components/ControlPlayerForward.vue
index 06ce2f34..d9ea658c 100644
--- a/web-src/src/components/ControlPlayerForward.vue
+++ b/web-src/src/components/ControlPlayerForward.vue
@@ -26,11 +26,7 @@ export default {
   },
   computed: {
     disabled() {
-      return (
-        this.queueStore?.count <= 0 ||
-        this.playerStore.isStopped ||
-        this.queueStore.current.data_kind === 'pipe'
-      )
+      return this.queueStore.isEmpty || this.playerStore.isStopped
     },
     visible() {
       return ['podcast', 'audiobook'].includes(
diff --git a/web-src/src/components/ControlPlayerNext.vue b/web-src/src/components/ControlPlayerNext.vue
index ff1f0c1a..be72b735 100644
--- a/web-src/src/components/ControlPlayerNext.vue
+++ b/web-src/src/components/ControlPlayerNext.vue
@@ -19,7 +19,7 @@ export default {
   },
   computed: {
     disabled() {
-      return this.queueStore.count <= 0
+      return this.queueStore.isEmpty
     }
   },
   methods: {
diff --git a/web-src/src/components/ControlPlayerPlay.vue b/web-src/src/components/ControlPlayerPlay.vue
index 91b98e91..6e277af7 100644
--- a/web-src/src/components/ControlPlayerPlay.vue
+++ b/web-src/src/components/ControlPlayerPlay.vue
@@ -19,7 +19,7 @@ export default {
   },
   computed: {
     disabled() {
-      return this.queueStore?.count <= 0
+      return this.queueStore.isEmpty
     },
     icon() {
       if (!this.playerStore.isPlaying) {
diff --git a/web-src/src/components/ControlPlayerPrevious.vue b/web-src/src/components/ControlPlayerPrevious.vue
index d7b83888..f783903e 100644
--- a/web-src/src/components/ControlPlayerPrevious.vue
+++ b/web-src/src/components/ControlPlayerPrevious.vue
@@ -19,7 +19,7 @@ export default {
   },
   computed: {
     disabled() {
-      return this.queueStore.count <= 0
+      return this.queueStore.isEmpty
     }
   },
   methods: {