From 13c3b22b02acb4217ec60212a57a9af7abfe2d5c Mon Sep 17 00:00:00 2001
From: JuniorJPDJ <git@juniorjpdj.pl>
Date: Thu, 24 Jun 2021 05:25:39 +0200
Subject: [PATCH] Set global howler volume, use log volume scale internally
fixes:
- next track volume
- saves precise volume slider position
- keyboard shortcut now sets volume in correct scale
---
changes/changelog.d/1542.bugfix | 1 +
changes/changelog.d/1543.bugfix | 1 +
front/src/components/audio/Player.vue | 15 +++++++--------
front/src/components/audio/VolumeControl.vue | 5 ++---
4 files changed, 11 insertions(+), 11 deletions(-)
create mode 100644 changes/changelog.d/1542.bugfix
create mode 100644 changes/changelog.d/1543.bugfix
diff --git a/changes/changelog.d/1542.bugfix b/changes/changelog.d/1542.bugfix
new file mode 100644
index 0000000000..9a11ea736f
--- /dev/null
+++ b/changes/changelog.d/1542.bugfix
@@ -0,0 +1 @@
+Use global Howler volume instead of setting it separatly for each track (fixes #1542)
diff --git a/changes/changelog.d/1543.bugfix b/changes/changelog.d/1543.bugfix
new file mode 100644
index 0000000000..9c19432a4b
--- /dev/null
+++ b/changes/changelog.d/1543.bugfix
@@ -0,0 +1 @@
+Store volume in logarithmic scale and convert when setting it to audio (fixes #1543)
diff --git a/front/src/components/audio/Player.vue b/front/src/components/audio/Player.vue
index eca218ef56..d05571aadf 100644
--- a/front/src/components/audio/Player.vue
+++ b/front/src/components/audio/Player.vue
@@ -226,6 +226,7 @@
<script>
import { mapState, mapGetters, mapActions } from "vuex"
import GlobalEvents from "@/components/utils/global-events"
+import { toLinearVolumeScale } from '@/audio/volume'
import { Howl } from "howler"
import $ from 'jquery'
import _ from '@/lodash'
@@ -265,8 +266,6 @@ export default {
this.$store.commit("player/isLoadingAudio", false)
Howler.unload() // clear existing cache, if any
this.nextTrackPreloaded = false
- // we trigger the watcher explicitely it does not work otherwise
- this.sliderVolume = this.volume
// this is needed to unlock audio playing under some browsers,
// cf https://github.com/goldfire/howler.js#mobilechrome-playback
// but we never actually load those audio files
@@ -364,7 +363,6 @@ export default {
loop: false,
html5: true,
preload: true,
- volume: this.volume,
onend: function () {
self.ended()
},
@@ -757,11 +755,12 @@ export default {
},
immediate: false
},
- volume(newValue) {
- this.sliderVolume = newValue
- if (this.currentSound) {
- this.currentSound.volume(newValue)
- }
+ volume: {
+ immediate: true,
+ handler(newValue) {
+ this.sliderVolume = newValue
+ Howler.volume(toLinearVolumeScale(newValue))
+ },
},
sliderVolume(newValue) {
this.$store.commit("player/volume", newValue)
diff --git a/front/src/components/audio/VolumeControl.vue b/front/src/components/audio/VolumeControl.vue
index 6d765a25fb..7f29976afa 100644
--- a/front/src/components/audio/VolumeControl.vue
+++ b/front/src/components/audio/VolumeControl.vue
@@ -38,7 +38,6 @@
</template>
<script>
import { mapState, mapGetters, mapActions } from "vuex"
-import { toLinearVolumeScale, toLogarithmicVolumeScale } from '@/audio/volume'
export default {
data () {
@@ -50,10 +49,10 @@ export default {
computed: {
sliderVolume: {
get () {
- return toLogarithmicVolumeScale(this.$store.state.player.volume)
+ return this.$store.state.player.volume
},
set (v) {
- this.$store.commit("player/volume", toLinearVolumeScale(v))
+ this.$store.commit("player/volume", v)
}
},
labels () {
--
GitLab