From e5b5ba12e0139eeb84cb8886d26b9b10ffb0c1bd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=C3=A1=C5=A1=20Ml=C3=A1dek?= <tmladek@protonmail.ch>
Date: Sun, 12 Jan 2020 21:10:14 +0100
Subject: [PATCH] fix volume actually not getting animated

---
 src/components/Channel.vue      | 2 +-
 src/components/VolumeSlider.vue | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/Channel.vue b/src/components/Channel.vue
index b99d481..3fba123 100644
--- a/src/components/Channel.vue
+++ b/src/components/Channel.vue
@@ -2,7 +2,7 @@
     <div :class="['channel', `channel-${loadingState}`]">
         <div class="name">{{name}}</div>
         <VolumeSlider :value="volume" :disabled="loadingState === 'unloaded'"
-                      @maxValueChange="(actualValue) => {actualVolume = actualValue}"/>
+                      @valueChange="(actualValue) => {actualVolume = actualValue}"/>
         <div class="title">{{loadingState === "loading" ? "Loading..." : title}}</div>
         <div class="youtube-player" ref="ytpl"/>
     </div>
diff --git a/src/components/VolumeSlider.vue b/src/components/VolumeSlider.vue
index 1b97ad1..57308fa 100644
--- a/src/components/VolumeSlider.vue
+++ b/src/components/VolumeSlider.vue
@@ -22,9 +22,10 @@ export default class Channel extends Vue {
     this.onMaxValueChange();
   }
 
+  @Watch("value")
   @Watch("maxValue")
   private onMaxValueChange() {
-    this.$emit("maxValueChange", this.value * (this.maxValue / 100), this.maxValue);
+    this.$emit("valueChange", this.value * (this.maxValue / 100), this.maxValue);
   }
 };
 </script>