repod/src/components/Player/ProgressBar.vue

28 lines
519 B
Vue
Raw Normal View History

2023-08-27 20:20:34 +00:00
<template>
2024-01-17 22:16:59 +00:00
<div class="pointer" @click="(event) => $store.dispatch('player/seek', event.x * player.duration / event.target.offsetWidth)">
2024-01-14 20:13:01 +00:00
<NcProgressBar size="medium" :value="player.currentTime * 100 / player.duration" />
2023-08-27 20:20:34 +00:00
</div>
</template>
<script>
import { NcProgressBar } from '@nextcloud/vue'
export default {
name: 'ProgressBar',
components: {
NcProgressBar,
},
computed: {
2023-08-28 22:47:22 +00:00
player() {
return this.$store.state.player
2023-08-27 20:20:34 +00:00
},
},
}
</script>
<style scoped>
2024-01-17 22:16:59 +00:00
.pointer {
2023-08-27 20:20:34 +00:00
cursor: pointer;
}
</style>