-
-
Notifications
You must be signed in to change notification settings - Fork 324
Open
Labels
bugSomething isn't workingSomething isn't working
Description
对播放器双击展开全屏的时候,播放器会触发click事件,并暂停(播放)正在播放(暂停)的视频。
看了一下源码发现:
let clickTimes = [];
events.proxy($video, 'click', (event) => {
const now = Date.now();
clickTimes.push(now);
const { MOBILE_CLICK_PLAY, DBCLICK_TIME, MOBILE_DBCLICK_PLAY, DBCLICK_FULLSCREEN } = constructor;
const clicks = clickTimes.filter((t) => now - t <= DBCLICK_TIME);
switch (clicks.length) {
case 1:
art.emit('click', event);
if (isMobile) {
if (!art.isLock && MOBILE_CLICK_PLAY) {
art.toggle();
}
} else {
art.toggle();
}
clickTimes = clicks;
break;
case 2:
art.emit('dblclick', event);
if (isMobile) {
if (!art.isLock && MOBILE_DBCLICK_PLAY) {
art.toggle();
}
} else {
if (DBCLICK_FULLSCREEN) {
art.fullscreen = !art.fullscreen;
}
}
clickTimes = [];
break;
default:
clickTimes = [];
}
});
case 1
的部分没有做类似防抖的功能,是不是可以改成类似这样:
let clickTimes = [];
let timeoutId = undefined;
events.proxy($video, 'click', (event) => {
const now = Date.now();
clickTimes.push(now);
const { MOBILE_CLICK_PLAY, DBCLICK_TIME, MOBILE_DBCLICK_PLAY, DBCLICK_FULLSCREEN } = constructor;
const clicks = clickTimes.filter((t) => now - t <= DBCLICK_TIME);
switch (clicks.length) {
case 1:
timeoutId = setTimeout(()=>{
timeoutId = undefined;
art.emit('click', event);
if (isMobile) {
if (!art.isLock && MOBILE_CLICK_PLAY) {
art.toggle();
}
} else {
art.toggle();
}
}, DBCLICK_TIME);
clickTimes = clicks;
break;
case 2:
if (timeoutId !== undefined) {
clearTimeout(timeoutId);
timeoutId = undefined;
}
art.emit('dblclick', event);
if (isMobile) {
if (!art.isLock && MOBILE_DBCLICK_PLAY) {
art.toggle();
}
} else {
if (DBCLICK_FULLSCREEN) {
art.fullscreen = !art.fullscreen;
}
}
clickTimes = [];
break;
default:
clickTimes = [];
}
});
在触发dblclick事件时,把还没触发的click事件给取消掉,防止两个事件冲突。
Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't working