debounce for preview

This commit is contained in:
DIYgod 2017-08-29 11:49:50 +08:00
parent 47cb3f6615
commit 6c50dc2dad
No known key found for this signature in database
GPG Key ID: EC0B76A252D3EF67
3 changed files with 14 additions and 9 deletions

2
dist/DPlayer.min.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1104,7 +1104,6 @@ class DPlayer {
const px = cumulativeOffset(pbar).left;
const tx = clientX - px;
const time = this.video.duration * (tx / pbar.offsetWidth);
timeTips.innerText = utils.secondToTime(time);
timeTips.style.left = `${(tx - 20)}px`;
this.previewWrapper.style.left = `${(tx - this.previewWrapper.offsetWidth / 2)}px`;
@ -1113,10 +1112,16 @@ class DPlayer {
case 'mouseover':
case 'mousemove':
this.isMouseHoverPbar = true;
this.setPreviewSourceAndFrame({
url: this.video.src,
time
});
if (this.previewTime !== parseInt(time)) {
timeTips.innerText = utils.secondToTime(time);
this.previewTime = parseInt(time);
this.setPreview && clearTimeout(this.setPreview);
this.setPreview = setTimeout(() => {
this.setPreviewSourceAndFrame({
time: parseInt(time)
});
}, 500);
}
this.timeTipsDisplay(true, timeTips);
break;
case 'mouseleave':
@ -1146,11 +1151,11 @@ class DPlayer {
}
initVideoPreview () {
this.previewVideo = document.createElement("video");
this.previewVideo = document.createElement('video');
this.previewWrapper = this.element.getElementsByClassName('dplayer-bar-preview')[0];
this.previewCanvas = this.element.getElementsByClassName('dplayer-bar-preview-canvas')[0];
this.previewVideo.preload = 'auto';
this.previewVideo.preload = 'metadata';
const resize = () => {
const w = this.element.offsetWidth / 4;
const h = this.element.offsetHeight / 4;