x15904151985/ArtPlayer
1
0 Fork 0
mirror of https://github.com/zhw2590582/ArtPlayer.git synced 2026-10-22 21:31:20 -08:00
Code Issues Packages Projects Releases Wiki Activity

Fix mobile progress

Browse Source
This commit is contained in:
Harvey committed 2022-09-28 11:40:19 +08:00
1 parent 783b973fb2
commit 37bfafb174
6 files changed
+50 -36
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer/src/control/progress.js
+20 -16
View File
@@ -3,7 +3,7 @@ import { query, clamp, append, setStyle, setStyles, secondToTime, includeFromEve
export function getPosFromEvent(art, event) {
const { $progress } = art.template;
const { left } = $progress.getBoundingClientRect();
const eventLeft = event.pageX;
const eventLeft = isMobile ? event.touches[0].clientX : event.pageX;
const width = clamp(eventLeft - left, 0, $progress.clientWidth);
const second = (width / $progress.clientWidth) * art.duration;
const time = secondToTime(second);
@@ -11,6 +11,19 @@ export function getPosFromEvent(art, event) {
return { second, time, width, percentage };
}
export function setCurrentTime(art, event) {
if (art.isRotate) {
const percentage = event.touches[0].clientY / art.height;
const second = percentage * art.duration;
art.emit('setBar', 'played', percentage);
art.seek = second;
} else {
const { second, percentage } = getPosFromEvent(art, event);
art.emit('setBar', 'played', percentage);
art.seek = second;
}
}
export default function progress(options) {
return (art) => {
const { icons, option, proxy } = art;
@@ -127,22 +140,13 @@ export default function progress(options) {
setBar('played', 1);
});
proxy($control, 'click', (event) => {
if (event.target !== $indicator) {
if (art.isRotate) {
const percentage = event.pageY / art.height;
const second = percentage * art.duration;
setBar('played', percentage);
art.seek = second;
} else {
const { second, percentage } = getPosFromEvent(art, event);
setBar('played', percentage);
art.seek = second;
}
}
});
if (!isMobile) {
proxy($control, 'click', (event) => {
if (event.target !== $indicator) {
setCurrentTime(art, event);
}
});
proxy($control, 'mousemove', (event) => {
setStyle($tip, 'display', 'block');
if (includeFromEvent(event, $highlight)) {