repod/src/components/Player/ProgressBar.vue

38 lines
606 B
Vue
Raw Normal View History

2023-08-27 20:20:34 +00:00
<template>
2023-08-28 16:18:25 +00:00
<div @click="(event) => audio.currentTime = event.x * duration / event.target.offsetWidth">
2023-08-27 20:20:34 +00:00
<NcProgressBar size="medium" :value="currentTime * 100 / duration" />
</div>
</template>
<script>
import { NcProgressBar } from '@nextcloud/vue'
export default {
name: 'ProgressBar',
components: {
NcProgressBar,
},
props: {
currentTime: {
type: Number,
required: true,
},
duration: {
type: Number,
required: true,
},
},
computed: {
audio() {
return document.getElementById('audio-player')
},
},
}
</script>
<style scoped>
div {
cursor: pointer;
}
</style>