From 4a9ae601201e05e9d41802e6cad15dfa1e7eb18a Mon Sep 17 00:00:00 2001
From: Tek <tek@randhome.io>
Date: Thu, 6 Sep 2018 17:38:30 +0000
Subject: [PATCH] Resolve "Toggle mute in volume bar does not restore previous
 volume level"

---
 changes/changelog.d/514.bugfix              |  1 +
 front/src/components/audio/Player.vue       |  8 +++++---
 front/src/store/player.js                   | 14 ++++++++++++++
 front/tests/unit/specs/store/player.spec.js | 19 +++++++++++++++++++
 4 files changed, 39 insertions(+), 3 deletions(-)
 create mode 100644 changes/changelog.d/514.bugfix

diff --git a/changes/changelog.d/514.bugfix b/changes/changelog.d/514.bugfix
new file mode 100644
index 000000000..6579fd59c
--- /dev/null
+++ b/changes/changelog.d/514.bugfix
@@ -0,0 +1 @@
+Fixed toggle mute in volume bar does not restore previous volume level (#514)
diff --git a/front/src/components/audio/Player.vue b/front/src/components/audio/Player.vue
index 8e4185c0c..de1adef50 100644
--- a/front/src/components/audio/Player.vue
+++ b/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'
     }),
diff --git a/front/src/store/player.js b/front/src/store/player.js
index 2149b51ff..dc01f368b 100644
--- a/front/src/store/player.js
+++ b/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)
     }
   }
 }
diff --git a/front/tests/unit/specs/store/player.spec.js b/front/tests/unit/specs/store/player.spec.js
index a110bf4c2..13a3fd763 100644
--- a/front/tests/unit/specs/store/player.spec.js
+++ b/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 },
+        ]
+      })
+    })
   })
 })