Skip to content
Snippets Groups Projects
Commit 13c3b22b authored by JuniorJPDJ's avatar JuniorJPDJ Committed by Georg Krause
Browse files

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
parent ffc9109a
No related branches found
No related tags found
No related merge requests found
Use global Howler volume instead of setting it separatly for each track (fixes #1542)
Store volume in logarithmic scale and convert when setting it to audio (fixes #1543)
...@@ -226,6 +226,7 @@ ...@@ -226,6 +226,7 @@
<script> <script>
import { mapState, mapGetters, mapActions } from "vuex" import { mapState, mapGetters, mapActions } from "vuex"
import GlobalEvents from "@/components/utils/global-events" import GlobalEvents from "@/components/utils/global-events"
import { toLinearVolumeScale } from '@/audio/volume'
import { Howl } from "howler" import { Howl } from "howler"
import $ from 'jquery' import $ from 'jquery'
import _ from '@/lodash' import _ from '@/lodash'
...@@ -265,8 +266,6 @@ export default { ...@@ -265,8 +266,6 @@ export default {
this.$store.commit("player/isLoadingAudio", false) this.$store.commit("player/isLoadingAudio", false)
Howler.unload() // clear existing cache, if any Howler.unload() // clear existing cache, if any
this.nextTrackPreloaded = false 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, // this is needed to unlock audio playing under some browsers,
// cf https://github.com/goldfire/howler.js#mobilechrome-playback // cf https://github.com/goldfire/howler.js#mobilechrome-playback
// but we never actually load those audio files // but we never actually load those audio files
...@@ -364,7 +363,6 @@ export default { ...@@ -364,7 +363,6 @@ export default {
loop: false, loop: false,
html5: true, html5: true,
preload: true, preload: true,
volume: this.volume,
onend: function () { onend: function () {
self.ended() self.ended()
}, },
...@@ -757,11 +755,12 @@ export default { ...@@ -757,11 +755,12 @@ export default {
}, },
immediate: false immediate: false
}, },
volume(newValue) { volume: {
immediate: true,
handler(newValue) {
this.sliderVolume = newValue this.sliderVolume = newValue
if (this.currentSound) { Howler.volume(toLinearVolumeScale(newValue))
this.currentSound.volume(newValue) },
}
}, },
sliderVolume(newValue) { sliderVolume(newValue) {
this.$store.commit("player/volume", newValue) this.$store.commit("player/volume", newValue)
......
...@@ -38,7 +38,6 @@ ...@@ -38,7 +38,6 @@
</template> </template>
<script> <script>
import { mapState, mapGetters, mapActions } from "vuex" import { mapState, mapGetters, mapActions } from "vuex"
import { toLinearVolumeScale, toLogarithmicVolumeScale } from '@/audio/volume'
export default { export default {
data () { data () {
...@@ -50,10 +49,10 @@ export default { ...@@ -50,10 +49,10 @@ export default {
computed: { computed: {
sliderVolume: { sliderVolume: {
get () { get () {
return toLogarithmicVolumeScale(this.$store.state.player.volume) return this.$store.state.player.volume
}, },
set (v) { set (v) {
this.$store.commit("player/volume", toLinearVolumeScale(v)) this.$store.commit("player/volume", v)
} }
}, },
labels () { labels () {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment