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>