Resolve "Toggle mute in volume bar does not restore previous volume level"

changes/changelog.d/514.bugfix

+Fixed toggle mute in volume bar does not restore previous volume level (#514)

front/src/components/audio/Player.vue

@@ -86,13 +86,13 @@
           v-bind:class="{ active : showVolume }">
           <i
             :title="labels.unmute"
-            @click="$store.commit('player/volume', 1)" v-if="volume === 0" class="volume off secondary icon"></i>
+            @click="unmute" v-if="volume === 0" class="volume off secondary icon"></i>
           <i
             :title="labels.mute"
-            @click="$store.commit('player/volume', 0)" v-else-if="volume < 0.5" class="volume down secondary icon"></i>
+            @click="mute" v-else-if="volume < 0.5" class="volume down secondary icon"></i>
           <i
             :title="labels.mute"
-            @click="$store.commit('player/volume', 0)" v-else class="volume up secondary icon"></i>
+            @click="mute" v-else class="volume up secondary icon"></i>
           <input
             type="range"
             step="0.05"
@@ -202,6 +202,8 @@ export default {
   methods: {
     ...mapActions({
       togglePlay: 'player/togglePlay',
+      mute: 'player/mute',
+      unmute: 'player/unmute',
       clean: 'queue/clean',
       updateProgress: 'player/updateProgress'
     }),

front/src/store/player.js

@@ -9,6 +9,7 @@ export default {
     errorCount: 0,
     playing: false,
     volume: 0.5,
+    tempVolume: 0.5,
     duration: 0,
     currentTime: 0,
     errored: false,
@@ -25,6 +26,12 @@ export default {
       value = Math.max(value, 0)
       state.volume = value
     },
+    tempVolume (state, value) {
+      value = parseFloat(value)
+      value = Math.min(value, 1)
+      value = Math.max(value, 0)
+      state.tempVolume = value
+    },
     incrementVolume (state, value) {
       value = parseFloat(state.volume + value)
       value = Math.min(value, 1)
@@ -110,6 +117,13 @@ export default {
     },
     updateProgress ({commit}, t) {
       commit('currentTime', t)
+    },
+    mute({commit, state}) {
+      commit('tempVolume', state.volume)
+      commit('volume', 0)
+    },
+    unmute({commit, state}) {
+      commit('volume', state.tempVolume)
     }
   }
 }

front/tests/unit/specs/store/player.spec.js

@@ -176,5 +176,24 @@ describe('store/player', () => {
         ]
       })
     })
+    it('mute', () => {
+      testAction({
+        action: store.actions.mute,
+        params: {state: { volume: 0.7, tempVolume: 0}},
+        expectedMutations: [
+          { type: 'tempVolume', payload: 0.7 },
+          { type: 'volume', payload: 0 },
+        ]
+      })
+    })
+    it('unmute', () => {
+      testAction({
+        action: store.actions.unmute,
+        params: {state: { volume: 0, tempVolume: 0.8}},
+        expectedMutations: [
+          { type: 'volume', payload: 0.8 },
+        ]
+      })
+    })
   })
 })