From 5341e2ec7747dbda00a1a9d594b5c8a373973c89 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Juraj=20Nyi=CC=81ri?= Date: Fri, 1 Oct 2021 16:03:36 +0200 Subject: [PATCH] Update: Horizontal scroll opening kinda works --- dist/plex-meets-homeassistant.js | 21 +++++++++++---------- src/plex-meets-homeassistant.ts | 21 +++++++++++---------- 2 files changed, 22 insertions(+), 20 deletions(-) diff --git a/dist/plex-meets-homeassistant.js b/dist/plex-meets-homeassistant.js index 02c0cd0..354663b 100644 --- a/dist/plex-meets-homeassistant.js +++ b/dist/plex-meets-homeassistant.js @@ -21905,16 +21905,13 @@ class PlexMeetsHomeAssistant extends HTMLElement { if (count > this.renderedItems) { this.contentContainer.appendChild(movieElem); if (lodash.isEmpty(this.contentContainer.style.width)) { - console.log('1'); this.contentContainer.style.width = `${getWidth(movieElem) + 10}px`; } else { - console.log('2'); this.contentContainer.style.width = `${parseFloat(this.contentContainer.style.width) + getWidth(movieElem) + 10}px`; } - console.log(getWidth(movieElem)); this.renderedItems += 1; } } @@ -22214,11 +22211,13 @@ class PlexMeetsHomeAssistant extends HTMLElement { else { clearInterval(setLeftOffsetsInterval); } + /* this.movieElems[i].style.left = `${this.movieElems[i].offsetLeft}px`; this.movieElems[i].dataset.left = this.movieElems[i].offsetLeft; this.movieElems[i].style.top = `${this.movieElems[i].offsetTop}px`; this.movieElems[i].dataset.top = this.movieElems[i].offsetTop; this.movieElems[i].style.position = 'absolute'; + */ } }, 100); }; @@ -22297,9 +22296,9 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.movieElems[i].style.height = `${CSS_STYLE.height}px`; } this.movieElems[i].style['z-index'] = 1; - this.movieElems[i].style.position = 'absolute'; - this.movieElems[i].style.left = `${this.movieElems[i].dataset.left}px`; - this.movieElems[i].style.top = `${this.movieElems[i].dataset.top}px`; + this.movieElems[i].style.position = 'relative'; + this.movieElems[i].style.left = `0px`; + this.movieElems[i].style.top = `0px`; this.movieElems[i].dataset.clicked = false; } } @@ -22916,8 +22915,9 @@ class PlexMeetsHomeAssistant extends HTMLElement { movieElemLocal.style.height = `${CSS_STYLE.height}px`; } movieElemLocal.style.zIndex = '1'; - movieElemLocal.style.top = `${movieElem.dataset.top}px`; - movieElemLocal.style.left = `${movieElem.dataset.left}px`; + movieElemLocal.style.position = 'relative'; + movieElemLocal.style.top = `0px`; + movieElemLocal.style.left = `0px`; setTimeout(() => { movieElemLocal.dataset.clicked = 'false'; }, 500); @@ -22935,6 +22935,7 @@ class PlexMeetsHomeAssistant extends HTMLElement { movieElemLocal.style.width = `${this.minExpandedWidth}px`; movieElemLocal.style.height = `${this.minExpandedHeight}px`; } + movieElemLocal.style.position = 'absolute'; movieElemLocal.style.zIndex = '3'; movieElemLocal.style.left = '16px'; movieElemLocal.style.top = `${top + 16}px`; @@ -23052,10 +23053,10 @@ class PlexMeetsHomeAssistant extends HTMLElement { const margin2 = this.fontSize2 / 4; titleElem.className = 'titleElem'; if (!lodash.isNil(data.channelCallSign)) { - titleElem.style.marginTop = `${CSS_STYLE.width}px`; + titleElem.style.marginTop = `0px`; } else { - titleElem.style.marginTop = `${CSS_STYLE.height + margin1}px`; + titleElem.style.marginTop = `${margin1}px`; } titleElem.style.fontSize = `${this.fontSize1}px`; titleElem.style.marginBottom = `${margin1}px`; diff --git a/src/plex-meets-homeassistant.ts b/src/plex-meets-homeassistant.ts index e304008..23fee2f 100644 --- a/src/plex-meets-homeassistant.ts +++ b/src/plex-meets-homeassistant.ts @@ -596,16 +596,13 @@ class PlexMeetsHomeAssistant extends HTMLElement { if (count > this.renderedItems) { this.contentContainer.appendChild(movieElem); if (_.isEmpty(this.contentContainer.style.width)) { - console.log('1'); this.contentContainer.style.width = `${getWidth(movieElem) + 10}px`; } else { - console.log('2'); this.contentContainer.style.width = `${parseFloat(this.contentContainer.style.width) + getWidth(movieElem) + 10}px`; } - console.log(getWidth(movieElem)); this.renderedItems += 1; } } @@ -938,11 +935,13 @@ class PlexMeetsHomeAssistant extends HTMLElement { } else { clearInterval(setLeftOffsetsInterval); } + /* this.movieElems[i].style.left = `${this.movieElems[i].offsetLeft}px`; this.movieElems[i].dataset.left = this.movieElems[i].offsetLeft; this.movieElems[i].style.top = `${this.movieElems[i].offsetTop}px`; this.movieElems[i].dataset.top = this.movieElems[i].offsetTop; this.movieElems[i].style.position = 'absolute'; + */ } }, 100); }; @@ -1030,9 +1029,9 @@ class PlexMeetsHomeAssistant extends HTMLElement { } this.movieElems[i].style['z-index'] = 1; - this.movieElems[i].style.position = 'absolute'; - this.movieElems[i].style.left = `${this.movieElems[i].dataset.left}px`; - this.movieElems[i].style.top = `${this.movieElems[i].dataset.top}px`; + this.movieElems[i].style.position = 'relative'; + this.movieElems[i].style.left = `0px`; + this.movieElems[i].style.top = `0px`; this.movieElems[i].dataset.clicked = false; } } @@ -1713,8 +1712,9 @@ class PlexMeetsHomeAssistant extends HTMLElement { movieElemLocal.style.height = `${CSS_STYLE.height}px`; } movieElemLocal.style.zIndex = '1'; - movieElemLocal.style.top = `${movieElem.dataset.top}px`; - movieElemLocal.style.left = `${movieElem.dataset.left}px`; + movieElemLocal.style.position = 'relative'; + movieElemLocal.style.top = `0px`; + movieElemLocal.style.left = `0px`; setTimeout(() => { movieElemLocal.dataset.clicked = 'false'; @@ -1732,6 +1732,7 @@ class PlexMeetsHomeAssistant extends HTMLElement { movieElemLocal.style.width = `${this.minExpandedWidth}px`; movieElemLocal.style.height = `${this.minExpandedHeight}px`; } + movieElemLocal.style.position = 'absolute'; movieElemLocal.style.zIndex = '3'; movieElemLocal.style.left = '16px'; movieElemLocal.style.top = `${top + 16}px`; @@ -1871,9 +1872,9 @@ class PlexMeetsHomeAssistant extends HTMLElement { const margin2 = this.fontSize2 / 4; titleElem.className = 'titleElem'; if (!_.isNil(data.channelCallSign)) { - titleElem.style.marginTop = `${CSS_STYLE.width}px`; + titleElem.style.marginTop = `0px`; } else { - titleElem.style.marginTop = `${CSS_STYLE.height + margin1}px`; + titleElem.style.marginTop = `${margin1}px`; } titleElem.style.fontSize = `${this.fontSize1}px`; titleElem.style.marginBottom = `${margin1}px`;