FoundKeyGang/FoundKey
FoundKeyGang/FoundKey
7
19
Fork 22
Code Issues 37 Pull requests 4 Releases Activity

pause music while seeking

Browse source
This commit is contained in:
Puniko 2023-02-19 15:22:53 +01:00
parent add309f189
commit b85e60df0f
1 changed files with 16 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
packages/client/src/components/wavesurfer.vue
View file

@ -9,11 +9,11 @@
<button class="stop" @click="stop()">
<i class="fas fa-stop"></i>
</button>
<input class="progress" type="range" min="0" :max="duration" step="0.1" v-model="position" @change="player.seekTo(position / duration)" @mousedown="isSeeking = true" @mouseup="isSeeking = false" />
<input class="progress" type="range" min="0" :max="duration" step="0.1" v-model="position" @input="player.seekTo(position / duration)" @mousedown="initSeek()" @mouseup="endSeek()" />
<span>
{{ formatTime(duration) }}
</span>
<input class="volume" type="range" min="0" max="1" step="0.1" v-model="volume" @change="player.setVolume(volume)" />
<input class="volume" type="range" min="0" max="1" step="0.1" v-model="volume" @input="player.setVolume(volume)" />
<a class="download" :href="src" target="_blank">
<i class="fas fa-download"></i>
</a>
@ -101,6 +101,20 @@ function stop() {
playing.value = player.value.isPlaying();
}
function initSeek() {
isSeeking.value = true;
if (playing.value) {
player.value.playPause();
}
}
function endSeek() {
isSeeking.value = false;
if (playing.value) {
player.value.playPause();
}
}
</script>
<style lang="scss" scoped>