From 1e9f51c0bbb98da50d9283362061355a1ce4fd3c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Juraj=20Nyi=CC=81ri?= Date: Sun, 6 Jun 2021 17:27:04 +0200 Subject: [PATCH] Fix: Better fullscreen detection and do not rerender when details shown --- dist/plex-meets-homeassistant.js | 53 ++++++++++++++++--------------- src/modules/utils.ts | 3 +- src/plex-meets-homeassistant.ts | 54 +++++++++++++++++--------------- 3 files changed, 58 insertions(+), 52 deletions(-) diff --git a/dist/plex-meets-homeassistant.js b/dist/plex-meets-homeassistant.js index 74e0113..8586bda 100644 --- a/dist/plex-meets-homeassistant.js +++ b/dist/plex-meets-homeassistant.js @@ -19056,7 +19056,8 @@ const getOffset = (el) => { const isVideoFullScreen = (_this) => { const videoPlayer = _this.getElementsByClassName('videoPlayer')[0]; const video = videoPlayer.children[0]; - return (video.offsetWidth > _this.getElementsByClassName('searchContainer')[0].offsetWidth || + const body = document.getElementsByTagName('body')[0]; + return ((video.offsetWidth === body.offsetHeight && video.offsetHeight === body.offsetHeight) || (_this.videoElem && _this.videoElem.classList.contains('simulatedFullScreen'))); }; const findTrailerURL = (movieData) => { @@ -19841,34 +19842,36 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.previousPositions = []; // todo: find a better way to detect resize... setInterval(() => { - const videoPlayer = this.getElementsByClassName('videoPlayer')[0]; - let isFullScreen = false; - if (videoPlayer.children.length > 0) { - isFullScreen = isVideoFullScreen(this); - } - if (this.movieElems.length > 0 && !isFullScreen) { - let renderNeeded = false; - if (this.previousPositions.length === 0) { + if (!this.detailsShown) { + const videoPlayer = this.getElementsByClassName('videoPlayer')[0]; + let isFullScreen = false; + if (videoPlayer.children.length > 0) { + isFullScreen = isVideoFullScreen(this); + } + if (this.movieElems.length > 0 && !isFullScreen) { + let renderNeeded = false; + if (this.previousPositions.length === 0) { + for (let i = 0; i < this.movieElems.length; i += 1) { + this.previousPositions[i] = {}; + this.previousPositions[i].top = this.movieElems[i].parentElement.offsetTop; + this.previousPositions[i].left = this.movieElems[i].parentElement.offsetLeft; + } + } for (let i = 0; i < this.movieElems.length; i += 1) { - this.previousPositions[i] = {}; - this.previousPositions[i].top = this.movieElems[i].parentElement.offsetTop; - this.previousPositions[i].left = this.movieElems[i].parentElement.offsetLeft; + if (this.previousPositions[i] && + this.movieElems[i].dataset.clicked !== 'true' && + (this.previousPositions[i].top !== this.movieElems[i].parentElement.offsetTop || + this.previousPositions[i].left !== this.movieElems[i].parentElement.offsetLeft)) { + renderNeeded = true; + this.previousPositions = []; + } } - } - for (let i = 0; i < this.movieElems.length; i += 1) { - if (this.previousPositions[i] && - this.movieElems[i].dataset.clicked !== 'true' && - (this.previousPositions[i].top !== this.movieElems[i].parentElement.offsetTop || - this.previousPositions[i].left !== this.movieElems[i].parentElement.offsetLeft)) { - renderNeeded = true; - this.previousPositions = []; + if (renderNeeded) { + this.renderPage(); + const contentbg = this.getElementsByClassName('contentbg'); + this.contentBGHeight = getHeight(contentbg[0]); } } - if (renderNeeded) { - this.renderPage(); - const contentbg = this.getElementsByClassName('contentbg'); - this.contentBGHeight = getHeight(contentbg[0]); - } } }, 250); this.renderPage(); diff --git a/src/modules/utils.ts b/src/modules/utils.ts index 1af997c..2836926 100644 --- a/src/modules/utils.ts +++ b/src/modules/utils.ts @@ -46,8 +46,9 @@ const getOffset = (el: Element): Record => { const isVideoFullScreen = (_this: any): boolean => { const videoPlayer = _this.getElementsByClassName('videoPlayer')[0] as HTMLElement; const video = videoPlayer.children[0] as any; + const body = document.getElementsByTagName('body')[0]; return ( - video.offsetWidth > (_this.getElementsByClassName('searchContainer')[0] as HTMLElement).offsetWidth || + (video.offsetWidth === body.offsetHeight && video.offsetHeight === body.offsetHeight) || (_this.videoElem && _this.videoElem.classList.contains('simulatedFullScreen')) ); }; diff --git a/src/plex-meets-homeassistant.ts b/src/plex-meets-homeassistant.ts index 13aa21b..cd9e2ce 100644 --- a/src/plex-meets-homeassistant.ts +++ b/src/plex-meets-homeassistant.ts @@ -167,37 +167,39 @@ class PlexMeetsHomeAssistant extends HTMLElement { // todo: find a better way to detect resize... setInterval(() => { - const videoPlayer = this.getElementsByClassName('videoPlayer')[0] as HTMLElement; - let isFullScreen = false; - if (videoPlayer.children.length > 0) { - isFullScreen = isVideoFullScreen(this); - } + if (!this.detailsShown) { + const videoPlayer = this.getElementsByClassName('videoPlayer')[0] as HTMLElement; + let isFullScreen = false; + if (videoPlayer.children.length > 0) { + isFullScreen = isVideoFullScreen(this); + } - if (this.movieElems.length > 0 && !isFullScreen) { - let renderNeeded = false; - if (this.previousPositions.length === 0) { + if (this.movieElems.length > 0 && !isFullScreen) { + let renderNeeded = false; + if (this.previousPositions.length === 0) { + for (let i = 0; i < this.movieElems.length; i += 1) { + this.previousPositions[i] = {}; + this.previousPositions[i].top = this.movieElems[i].parentElement.offsetTop; + this.previousPositions[i].left = this.movieElems[i].parentElement.offsetLeft; + } + } for (let i = 0; i < this.movieElems.length; i += 1) { - this.previousPositions[i] = {}; - this.previousPositions[i].top = this.movieElems[i].parentElement.offsetTop; - this.previousPositions[i].left = this.movieElems[i].parentElement.offsetLeft; + if ( + this.previousPositions[i] && + this.movieElems[i].dataset.clicked !== 'true' && + (this.previousPositions[i].top !== this.movieElems[i].parentElement.offsetTop || + this.previousPositions[i].left !== this.movieElems[i].parentElement.offsetLeft) + ) { + renderNeeded = true; + this.previousPositions = []; + } } - } - for (let i = 0; i < this.movieElems.length; i += 1) { - if ( - this.previousPositions[i] && - this.movieElems[i].dataset.clicked !== 'true' && - (this.previousPositions[i].top !== this.movieElems[i].parentElement.offsetTop || - this.previousPositions[i].left !== this.movieElems[i].parentElement.offsetLeft) - ) { - renderNeeded = true; - this.previousPositions = []; + if (renderNeeded) { + this.renderPage(); + const contentbg = this.getElementsByClassName('contentbg'); + this.contentBGHeight = getHeight(contentbg[0] as HTMLElement); } } - if (renderNeeded) { - this.renderPage(); - const contentbg = this.getElementsByClassName('contentbg'); - this.contentBGHeight = getHeight(contentbg[0] as HTMLElement); - } } }, 250);