From c88247df2525c520b7f29c9c82ee66dc88fa7326 Mon Sep 17 00:00:00 2001 From: Tamius Han Date: Tue, 11 Feb 2020 19:54:41 +0100 Subject: [PATCH] Fix problem with video sometimes being offset to the side --- src/ext/lib/video-data/PlayerData.js | 39 +++++++++++++++------------- src/ext/lib/video-data/VideoData.js | 12 +++------ 2 files changed, 25 insertions(+), 26 deletions(-) diff --git a/src/ext/lib/video-data/PlayerData.js b/src/ext/lib/video-data/PlayerData.js index ac6da43..1d465f6 100644 --- a/src/ext/lib/video-data/PlayerData.js +++ b/src/ext/lib/video-data/PlayerData.js @@ -136,9 +136,7 @@ class PlayerData { doPeriodicPlayerElementChangeCheck() { if (this.periodicallyRefreshPlayerElement) { - if (this.forceDetectPlayerElementChange()) { - this.videoData.resizer.restore(); - } + this.forceDetectPlayerElementChange(); } } @@ -208,11 +206,22 @@ class PlayerData { updatePlayerDimensions(element) { const isFullScreen = PlayerData.isFullScreen(); - this.dimensions = { - width: element.offsetWidth, - height: element.offsetHeight, - fullscreen: isFullScreen - }; + if (element.offsetWidth !== this.dimensions?.width + || element.offsetHeight !== this.dimensions?.height + || isFullScreen !== this.dimensions?.fullscreen) { + + // update dimensions only if they've changed, _before_ we do a restore (not after) + this.dimensions = { + width: element.offsetWidth, + height: element.offsetHeight, + fullscreen: isFullScreen + }; + + // actually re-calculate zoom when player size changes, but only if videoData.resizer + // is defined. Since resizer needs a PlayerData object to exist, videoData.resizer will + // be undefined the first time this function will run. + this.videoData.resizer?.restore(); + } } getPlayer() { @@ -373,17 +382,11 @@ class PlayerData { } forceDetectPlayerElementChange() { - // save current dimensions before refreshing the player object - const oldDimensions = this.dimensions; + // Player dimension changes get calculated every time updatePlayerDimensions is called (which happens + // every time getPlayer() detects an element). If updatePlayerDimension detects dimensions were changed, + // it will always re-apply current crop, rendering this function little more than a fancy alias for + // getPlayer(). this.getPlayer(); - - // compare new player object dimensions with the old dimensions - // don't fucking trigger changes if nothing changed - if (this.dimensions.width === this.dimensions.width && this.dimensions.height === this.dimensions.height) { - return false; - } else { - return true; - } } forceRefreshPlayerElement() { diff --git a/src/ext/lib/video-data/VideoData.js b/src/ext/lib/video-data/VideoData.js index a85cfee..3fd84d0 100644 --- a/src/ext/lib/video-data/VideoData.js +++ b/src/ext/lib/video-data/VideoData.js @@ -28,13 +28,15 @@ class VideoData { // POZOR: VRSTNI RED JE POMEMBEN (arDetect mora bit zadnji) - // NOTE: ORDERING OF OBJ INITIALIZATIONS IS IMPORTANT (arDetect needs to go last) + // NOTE: ORDERING OF OBJ INITIALIZATIONS IS IMPORTANT (arDetect needs to go last) this.player = new PlayerData(this); if (this.player.invalid) { this.invalid = true; return; } + this.resizer = new Resizer(this); + const ths = this; this.observer = new MutationObserver( (m, o) => this.onVideoDimensionsChanged(m, o, ths)); this.observer.observe(video, observerConf); @@ -44,7 +46,6 @@ class VideoData { height: this.video.offsetHeight, }; - this.resizer = new Resizer(this); this.arDetector = new ArDetector(this); // this starts Ar detection. needs optional parameter that prevets ardetdctor from starting // player dimensions need to be in: @@ -158,12 +159,7 @@ class VideoData { && this.isWithin(vh, (ph - (translateY * 2)), 2) && this.isWithin(vw, (pw - (translateX * 2)), 2)) { } else { - if (this.player.forceDetectPlayerElementChange()) { - this.logger.log('info', 'debug', "Video dimensions changed. Triggering restoreAr()"); - this.restoreAr(); - } else { - this.logger.log('info', 'playerRescan', "Video dimensions didn't change."); - } + this.player.forceDetectPlayerElementChange(); } } catch(e) {