From 35bb2785cd9e44005299beef23ade5aa301a93c1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Juraj=20Nyi=CC=81ri?= Date: Tue, 31 Aug 2021 20:29:31 +0200 Subject: [PATCH] Add: Ability to specify maximum number of rows to display --- dist/plex-meets-homeassistant.js | 45 ++++++++++++++++++++++++++------ src/editor.ts | 18 +++++++++++++ src/plex-meets-homeassistant.ts | 30 ++++++++++++++++----- 3 files changed, 78 insertions(+), 15 deletions(-) diff --git a/dist/plex-meets-homeassistant.js b/dist/plex-meets-homeassistant.js index 7ef181f..e6e8923 100644 --- a/dist/plex-meets-homeassistant.js +++ b/dist/plex-meets-homeassistant.js @@ -19588,6 +19588,7 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement { this.token = document.createElement('paper-input'); this.port = document.createElement('paper-input'); this.maxCount = document.createElement('paper-input'); + this.maxRows = document.createElement('paper-input'); this.cardTitle = document.createElement('paper-input'); this.libraryName = document.createElement('paper-dropdown-menu'); this.protocol = document.createElement('paper-dropdown-menu'); @@ -19653,6 +19654,12 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement { else { this.config.maxCount = this.maxCount.value; } + if (lodash.isEmpty(this.maxRows.value)) { + this.config.maxRows = ''; + } + else { + this.config.maxRows = this.maxRows.value; + } if (lodash.isEmpty(this.cardTitle.value)) { this.config.title = ''; } @@ -19913,6 +19920,11 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement { this.maxCount.type = 'number'; this.maxCount.addEventListener('change', this.valueUpdated); this.plexValidSection.appendChild(this.maxCount); + this.maxRows.label = 'Maximum number of rows to display (Optional)'; + this.maxRows.value = this.config.maxRows; + this.maxRows.type = 'number'; + this.maxRows.addEventListener('change', this.valueUpdated); + this.plexValidSection.appendChild(this.maxRows); this.sort.innerHTML = ''; const sortItems = document.createElement('paper-listbox'); sortItems.slot = 'dropdown-content'; @@ -20161,6 +20173,9 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement { if (lodash.isNumber(this.config.maxCount)) { this.config.maxCount = `${this.config.maxCount}`; } + if (lodash.isNumber(this.config.maxRows)) { + this.config.maxRows = `${this.config.maxRows}`; + } this.render(); }; this.configChanged = (newConfig) => { @@ -20906,6 +20921,7 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.previousPageWidth = 0; this.runAfter = ''; this.columnsCount = 0; + this.renderedRows = 0; this.renderedItems = 0; this.maxRenderCount = false; this.seasonContainerClickEnabled = true; @@ -20921,6 +20937,7 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.config = {}; this.loading = false; this.maxCount = false; + this.maxRows = false; this.error = ''; this.contentBGHeight = 0; this.initialDataLoaded = false; @@ -20929,9 +20946,11 @@ class PlexMeetsHomeAssistant extends HTMLElement { const height = getHeight(this.content); if (!this.detailsShown && window.innerHeight + window.scrollY > height + getOffset(this.content).top - 300 && - this.renderedItems > 0) { + this.renderedItems > 0 && + this.renderedItems < this.data[this.config.libraryName].length && + (!this.maxRows || this.renderedRows < this.config.maxRows)) { this.maxRenderCount = this.renderedItems + this.columnsCount * (loadAdditionalRowsCount * 2); - this.renderMovieElems(); + this.renderPage(); this.calculatePositions(); } }; @@ -21248,7 +21267,6 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.searchValue = this.searchInputElem.value; this.renderPage(); this.focus(); - this.renderNewElementsIfNeeded(); } }); searchContainer.appendChild(this.searchInputElem); @@ -21262,11 +21280,13 @@ class PlexMeetsHomeAssistant extends HTMLElement { // eslint-disable-next-line consistent-return let lastRowTop = 0; const loadAdditionalRowsCount = 2; // todo: make this configurable + this.renderedRows = 0; + this.columnsCount = 0; const hasEpisodesResult = hasEpisodes(this.data[this.config.libraryName]); - // eslint-disable-next-line consistent-return lodash.forEach(this.data[this.config.libraryName], (movieData) => { if ((!this.maxCount || this.renderedItems < this.maxCount) && - (!this.maxRenderCount || this.renderedItems < this.maxRenderCount)) { + (!this.maxRenderCount || this.renderedItems < this.maxRenderCount) && + (!this.maxRows || this.renderedRows <= this.maxRows)) { const movieElem = this.getMovieElement(movieData, hasEpisodesResult); let shouldRender = false; if (this.looseSearch) { @@ -21296,7 +21316,8 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.renderedItems += 1; } } - if (lastRowTop !== movieElem.getBoundingClientRect().top) { + if (shouldRender && lastRowTop !== movieElem.getBoundingClientRect().top) { + this.renderedRows += 1; if (lastRowTop !== 0 && this.columnsCount === 0) { this.columnsCount = this.renderedItems - 1; } @@ -21305,10 +21326,12 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.maxRenderCount = this.renderedItems - 1 + this.columnsCount * loadAdditionalRowsCount; } } - } - else { + if (this.maxRows && this.renderedRows > this.maxRows) { + movieElem.remove(); + } return true; } + return false; }); } const contentbg = this.getElementsByClassName('contentbg')[0]; @@ -22331,6 +22354,12 @@ class PlexMeetsHomeAssistant extends HTMLElement { if (config.maxCount && config.maxCount !== '') { this.maxCount = config.maxCount; } + if (config.maxRows && config.maxRows !== '' && config.maxRows !== '0' && config.maxRows !== 0) { + this.maxRows = config.maxRows; + } + else { + this.maxRows = false; + } if (config.runBefore && !lodash.isEqual(config.runBefore, '')) { this.runBefore = config.runBefore; } diff --git a/src/editor.ts b/src/editor.ts index 15ebc24..b25f844 100644 --- a/src/editor.ts +++ b/src/editor.ts @@ -24,6 +24,8 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement { maxCount: any = document.createElement('paper-input'); + maxRows: any = document.createElement('paper-input'); + cardTitle: any = document.createElement('paper-input'); libraryName: any = document.createElement('paper-dropdown-menu'); @@ -119,6 +121,12 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement { this.config.maxCount = this.maxCount.value; } + if (_.isEmpty(this.maxRows.value)) { + this.config.maxRows = ''; + } else { + this.config.maxRows = this.maxRows.value; + } + if (_.isEmpty(this.cardTitle.value)) { this.config.title = ''; } else { @@ -393,6 +401,12 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement { this.maxCount.addEventListener('change', this.valueUpdated); this.plexValidSection.appendChild(this.maxCount); + this.maxRows.label = 'Maximum number of rows to display (Optional)'; + this.maxRows.value = this.config.maxRows; + this.maxRows.type = 'number'; + this.maxRows.addEventListener('change', this.valueUpdated); + this.plexValidSection.appendChild(this.maxRows); + this.sort.innerHTML = ''; const sortItems: any = document.createElement('paper-listbox'); @@ -650,6 +664,10 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement { this.config.maxCount = `${this.config.maxCount}`; } + if (_.isNumber(this.config.maxRows)) { + this.config.maxRows = `${this.config.maxRows}`; + } + this.render(); }; diff --git a/src/plex-meets-homeassistant.ts b/src/plex-meets-homeassistant.ts index 0cd8700..296ed20 100644 --- a/src/plex-meets-homeassistant.ts +++ b/src/plex-meets-homeassistant.ts @@ -57,6 +57,8 @@ class PlexMeetsHomeAssistant extends HTMLElement { columnsCount = 0; + renderedRows = 0; + renderedItems = 0; plex: Plex | undefined; @@ -121,6 +123,8 @@ class PlexMeetsHomeAssistant extends HTMLElement { maxCount: false | number = false; + maxRows: false | number = false; + error = ''; content: any; @@ -151,10 +155,12 @@ class PlexMeetsHomeAssistant extends HTMLElement { if ( !this.detailsShown && window.innerHeight + window.scrollY > height + getOffset(this.content).top - 300 && - this.renderedItems > 0 + this.renderedItems > 0 && + this.renderedItems < this.data[this.config.libraryName].length && + (!this.maxRows || this.renderedRows < this.config.maxRows) ) { this.maxRenderCount = this.renderedItems + this.columnsCount * (loadAdditionalRowsCount * 2); - this.renderMovieElems(); + this.renderPage(); this.calculatePositions(); } }; @@ -483,7 +489,6 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.searchValue = this.searchInputElem.value; this.renderPage(); this.focus(); - this.renderNewElementsIfNeeded(); } }); @@ -500,12 +505,14 @@ class PlexMeetsHomeAssistant extends HTMLElement { let lastRowTop = 0; const loadAdditionalRowsCount = 2; // todo: make this configurable + this.renderedRows = 0; + this.columnsCount = 0; const hasEpisodesResult = hasEpisodes(this.data[this.config.libraryName]); - // eslint-disable-next-line consistent-return _.forEach(this.data[this.config.libraryName], (movieData: Record) => { if ( (!this.maxCount || this.renderedItems < this.maxCount) && - (!this.maxRenderCount || this.renderedItems < this.maxRenderCount) + (!this.maxRenderCount || this.renderedItems < this.maxRenderCount) && + (!this.maxRows || this.renderedRows <= this.maxRows) ) { const movieElem = this.getMovieElement(movieData, hasEpisodesResult); let shouldRender = false; @@ -539,7 +546,8 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.renderedItems += 1; } } - if (lastRowTop !== movieElem.getBoundingClientRect().top) { + if (shouldRender && lastRowTop !== movieElem.getBoundingClientRect().top) { + this.renderedRows += 1; if (lastRowTop !== 0 && this.columnsCount === 0) { this.columnsCount = this.renderedItems - 1; } @@ -548,9 +556,12 @@ class PlexMeetsHomeAssistant extends HTMLElement { this.maxRenderCount = this.renderedItems - 1 + this.columnsCount * loadAdditionalRowsCount; } } - } else { + if (this.maxRows && this.renderedRows > this.maxRows) { + movieElem.remove(); + } return true; } + return false; }); } @@ -1678,6 +1689,11 @@ class PlexMeetsHomeAssistant extends HTMLElement { if (config.maxCount && config.maxCount !== '') { this.maxCount = config.maxCount; } + if (config.maxRows && config.maxRows !== '' && config.maxRows !== '0' && config.maxRows !== 0) { + this.maxRows = config.maxRows; + } else { + this.maxRows = false; + } if (config.runBefore && !_.isEqual(config.runBefore, '')) { this.runBefore = config.runBefore; }