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
environments/review-front-fix-fhp6gl/deployments/7748
JuniorJPDJ 2021-06-24 05:25:39 +02:00 zatwierdzone przez Georg Krause
rodzic ffc9109a45
commit 13c3b22b02
4 zmienionych plików z 11 dodań i 11 usunięć

Wyświetl plik

@ -0,0 +1 @@
Use global Howler volume instead of setting it separatly for each track (fixes #1542)

Wyświetl plik

@ -0,0 +1 @@
Store volume in logarithmic scale and convert when setting it to audio (fixes #1543)

Wyświetl plik

@ -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)

Wyświetl plik

@ -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 () {