From 156552be976c4b471f5047a1e699e9f2c5cde4a0 Mon Sep 17 00:00:00 2001 From: A-Circle Zhang Date: Sat, 29 Sep 2018 10:18:57 +0800 Subject: [PATCH 1/6] Update controller.js --- src/js/controller.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/js/controller.js b/src/js/controller.js index 42968e0..52eecb5 100644 --- a/src/js/controller.js +++ b/src/js/controller.js @@ -85,7 +85,7 @@ class Controller { if (this.player.options.video.thumbnails) { this.thumbnails = new Thumbnails({ container: this.player.template.barPreview, - barWidth: this.player.template.barWrap.offsetWidth, + barWrap: this.player.template.barWrap, url: this.player.options.video.thumbnails, events: this.player.events }); From 892224d6c9e23dcb063b6380ad113104b7a1559f Mon Sep 17 00:00:00 2001 From: A-Circle Zhang Date: Sat, 29 Sep 2018 10:20:26 +0800 Subject: [PATCH 2/6] Update thumbnails.js --- src/js/thumbnails.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/js/thumbnails.js b/src/js/thumbnails.js index b5de89f..204e99c 100644 --- a/src/js/thumbnails.js +++ b/src/js/thumbnails.js @@ -1,7 +1,7 @@ class Thumbnails { constructor (options) { this.container = options.container; - this.barWidth = options.barWidth; + this.barWrap = options.barWrap; this.container.style.backgroundImage = `url('${options.url}')`; this.events = options.events; } @@ -18,8 +18,8 @@ class Thumbnails { } move (position) { - this.container.style.backgroundPosition = `-${(Math.ceil(position / this.barWidth * 100) - 1) * 160}px 0`; - this.container.style.left = `${Math.min(Math.max(position - this.container.offsetWidth / 2, -10), this.barWidth - 150)}px`; + this.container.style.backgroundPosition = `-${(Math.ceil(position / this.barWrap.offsetWidth * 100) - 1) * 160}px 0`; + this.container.style.left = `${Math.min(Math.max(position - this.container.offsetWidth / 2, -10), this.barWrap.offsetWidth - 150)}px`; } hide () { From 7dfd75796ff67d6314adc0792057cb525431c8a9 Mon Sep 17 00:00:00 2001 From: A-Circle Zhang Date: Sat, 29 Sep 2018 12:06:19 +0800 Subject: [PATCH 3/6] Update thumbnails.js --- src/js/thumbnails.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/js/thumbnails.js b/src/js/thumbnails.js index 204e99c..42882ed 100644 --- a/src/js/thumbnails.js +++ b/src/js/thumbnails.js @@ -1,15 +1,16 @@ class Thumbnails { constructor (options) { this.container = options.container; - this.barWrap = options.barWrap; + this.barWidth = options.barWidth; this.container.style.backgroundImage = `url('${options.url}')`; this.events = options.events; } - resize (width, height) { + resize (width, height, barWrapWidth) { this.container.style.width = `${width}px`; this.container.style.height = `${height}px`; this.container.style.top = `${-height + 2}px`; + this.barWidth = barWrapWidth; } show () { @@ -18,8 +19,8 @@ class Thumbnails { } move (position) { - this.container.style.backgroundPosition = `-${(Math.ceil(position / this.barWrap.offsetWidth * 100) - 1) * 160}px 0`; - this.container.style.left = `${Math.min(Math.max(position - this.container.offsetWidth / 2, -10), this.barWrap.offsetWidth - 150)}px`; + this.container.style.backgroundPosition = `-${(Math.ceil(position / this.barWidth * 100) - 1) * 160}px 0`; + this.container.style.left = `${Math.min(Math.max(position - this.container.offsetWidth / 2, -10), this.barWidth - 150)}px`; } hide () { From 59f4ce6bc82e899e53a3d5317cae5ddf4134478f Mon Sep 17 00:00:00 2001 From: A-Circle Zhang Date: Sat, 29 Sep 2018 12:07:59 +0800 Subject: [PATCH 4/6] Update controller.js --- src/js/controller.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/js/controller.js b/src/js/controller.js index 52eecb5..f398891 100644 --- a/src/js/controller.js +++ b/src/js/controller.js @@ -85,13 +85,13 @@ class Controller { if (this.player.options.video.thumbnails) { this.thumbnails = new Thumbnails({ container: this.player.template.barPreview, - barWrap: this.player.template.barWrap, + barWidth: this.player.template.barWrap.offsetWidth, url: this.player.options.video.thumbnails, events: this.player.events }); this.player.on('loadedmetadata', () => { - this.thumbnails.resize(160, this.player.video.videoHeight / this.player.video.videoWidth * 160); + this.thumbnails.resize(160, this.player.video.videoHeight / this.player.video.videoWidth * 160, this.player.template.barWrap.offsetWidth); }); } } From 9c43d49e4b36bbc935946b0cf90fa5a05da43605 Mon Sep 17 00:00:00 2001 From: A-Circle Zhang Date: Sat, 29 Sep 2018 12:09:54 +0800 Subject: [PATCH 5/6] Update player.js --- src/js/player.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/js/player.js b/src/js/player.js index a0d8b54..4383f35 100644 --- a/src/js/player.js +++ b/src/js/player.js @@ -563,6 +563,9 @@ class DPlayer { if (this.danmaku) { this.danmaku.resize(); } + if (this.controller.thumbnails) { + this.controller.thumbnails.resize(160, this.video.videoHeight / this.video.videoWidth * 160, this.template.barWrap.offsetWidth); + } this.events.trigger('resize'); } From 53660400c253f06938454b9495fad69e41d5408e Mon Sep 17 00:00:00 2001 From: chenyuming Date: Tue, 26 Feb 2019 20:06:19 +0800 Subject: [PATCH 6/6] fix safari, edge seek time error --- src/js/utils.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/js/utils.js b/src/js/utils.js index 0dfb8d7..5dc53bd 100644 --- a/src/js/utils.js +++ b/src/js/utils.js @@ -48,7 +48,7 @@ const utils = { * getBoundingClientRect 在 Opera 10.5 及以下返回的值缺失 width、height 值 */ getBoundingClientRectViewLeft (element) { - const scrollTop = document.documentElement.scrollTop; + const scrollTop = window.scrollY || window.pageYOffset || document.body.scrollTop + (document.documentElement && document.documentElement.scrollTop || 0); if (element.getBoundingClientRect) { if (typeof this.getBoundingClientRectViewLeft.offset !== 'number') {