video 暂停播放进度条
const canvas = ref();
const change = () => {
if (canvas.value.painting) {
canvas.value.painting = false;
canvas.value.EraserEnabled = true;
} else {
if (canvas.value.EraserEnabled) {
canvas.value.painting = true;
canvas.value.EraserEnabled = false;
} else {
canvas.value.painting = true;
}
}
}
const canvasW = window.innerWidth;
const canvasH = window.innerHeight - 69;
const video = ref();
const isPlay = ref(false);
const isStop = ref(true);
let timer = null;
const playDuration = ref(0);
const duration = ref(0);
const play = () => {
isPlay.value = true;
video.value.play();
if (isStop.value) {
playDuration.value = 0;
}
timer = setInterval(() => {
playDuration.value++;
}, 1000)
}
const stop = () => {
video.value.pause();
isStop.value = true;
isPlay.value = false;
clearInterval(timer)
}
const onChange = (e) => {
video.value.currentTime = playDuration.value;
console.log(e, playDuration.value)
}
const secondToTime = (second = 0) => {
if (second === 0 || isNaN(second)) return "00:00";
const add0 = (num) => (num < 10 ? "0" + num : "" + num);
const hour = Math.floor(second / 3600);
const min = Math.floor((second - hour * 3600) / 60);
const sec = Math.floor(second - hour * 3600 - min * 60);
return (hour > 0 ? [hour, min, sec] : [min, sec]).map(add0).join(":");
};
onMounted(() => {
video.value.oncanplay = () => {
console.log(video.value.duration)
duration.value = Math.ceil(video.value.duration);
}
video.value.onended = () => {
clearInterval(timer);
isStop.value = true;
isPlay.value = false;
}
})
