HomeAssistant
/
PlexMeetsHomeAssistant
mirror of https://github.com/JurajNyiri/PlexMeetsHomeAssistant.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Add: Configuration option to use horizontal scroll

Browse Source
horizontal_scroll 3.0
Juraj Nyíri 3 years ago
parent 6ef18a5f09
commit 9c4e73276d
3 changed files with 88 additions and 43 deletions
Show Stats Download Patch File Download Diff File

65
dist/plex-meets-homeassistant.js vendored
Unescape View File

@ -19962,6 +19962,7 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement {
this.port = document.createElement('paper-input'); this.port = document.createElement('paper-input');
this.maxCount = document.createElement('paper-input'); this.maxCount = document.createElement('paper-input');
this.maxRows = document.createElement('paper-input'); this.maxRows = document.createElement('paper-input');
this.useHorizontalScroll = document.createElement('paper-dropdown-menu');
this.minWidth = document.createElement('paper-input'); this.minWidth = document.createElement('paper-input');
this.minEpisodeWidth = document.createElement('paper-input'); this.minEpisodeWidth = document.createElement('paper-input');
this.minExpandedWidth = document.createElement('paper-input'); this.minExpandedWidth = document.createElement('paper-input');
@ -20042,6 +20043,12 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement {
else { else {
this.config.maxRows = this.maxRows.value; this.config.maxRows = this.maxRows.value;
} }
if (lodash.isEmpty(this.useHorizontalScroll.value)) {
this.config.useHorizontalScroll = '';
}
else {
this.config.useHorizontalScroll = this.useHorizontalScroll.value;
}
if (lodash.isEmpty(this.minWidth.value)) { if (lodash.isEmpty(this.minWidth.value)) {
this.config.minWidth = ''; this.config.minWidth = '';
} }
@ -20360,6 +20367,22 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement {
this.maxCount.type = 'number'; this.maxCount.type = 'number';
this.maxCount.addEventListener('change', this.valueUpdated); this.maxCount.addEventListener('change', this.valueUpdated);
this.plexValidSection.appendChild(this.maxCount); this.plexValidSection.appendChild(this.maxCount);
this.useHorizontalScroll.innerHTML = '';
const useHorizontalScrollItems = document.createElement('paper-listbox');
useHorizontalScrollItems.appendChild(addDropdownItem('Yes'));
useHorizontalScrollItems.appendChild(addDropdownItem('No'));
useHorizontalScrollItems.slot = 'dropdown-content';
this.useHorizontalScroll.label = 'Use horizontal scroll';
this.useHorizontalScroll.appendChild(useHorizontalScrollItems);
this.useHorizontalScroll.style.width = '100%';
this.useHorizontalScroll.addEventListener('value-changed', this.valueUpdated);
if (lodash.isEmpty(this.config.useHorizontalScroll)) {
this.useHorizontalScroll.value = 'No';
}
else {
this.useHorizontalScroll.value = this.config.useHorizontalScroll;
}
this.plexValidSection.appendChild(this.useHorizontalScroll);
this.maxRows.label = 'Maximum number of rows to display (Optional)'; this.maxRows.label = 'Maximum number of rows to display (Optional)';
this.maxRows.value = this.config.maxRows; this.maxRows.value = this.config.maxRows;
this.maxRows.type = 'number'; this.maxRows.type = 'number';
@ -20672,6 +20695,9 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement {
if (lodash.isNumber(this.config.maxRows)) { if (lodash.isNumber(this.config.maxRows)) {
this.config.maxRows = `${this.config.maxRows}`; this.config.maxRows = `${this.config.maxRows}`;
} }
if (lodash.isNumber(this.config.useHorizontalScroll)) {
this.config.useHorizontalScroll = `${this.config.useHorizontalScroll}`;
}
if (lodash.isNumber(this.config.minWidth)) { if (lodash.isNumber(this.config.minWidth)) {
this.config.minWidth = `${this.config.minWidth}`; this.config.minWidth = `${this.config.minWidth}`;
} }
@ -21465,6 +21491,7 @@ class PlexMeetsHomeAssistant extends HTMLElement {
super(...arguments); super(...arguments);
this.searchInputElem = document.createElement('input'); this.searchInputElem = document.createElement('input');
this.plexProtocol = 'http'; this.plexProtocol = 'http';
this.useHorizontalScroll = false;
this.plexPort = false; this.plexPort = false;
this.epgData = {}; this.epgData = {};
this.detailsShown = false; this.detailsShown = false;
@ -21904,13 +21931,15 @@ class PlexMeetsHomeAssistant extends HTMLElement {
count += 1; count += 1;
if (count > this.renderedItems) { if (count > this.renderedItems) {
this.contentContainer.appendChild(movieElem); this.contentContainer.appendChild(movieElem);
if (lodash.isEmpty(this.contentContainer.style.width)) { if (this.useHorizontalScroll) {
this.contentContainer.style.width = `${getWidth(movieElem) + 10}px`; if (lodash.isEmpty(this.contentContainer.style.width)) {
} this.contentContainer.style.width = `${getWidth(movieElem) + 10}px`;
else { }
this.contentContainer.style.width = `${parseFloat(this.contentContainer.style.width) + else {
getWidth(movieElem) + this.contentContainer.style.width = `${parseFloat(this.contentContainer.style.width) +
10}px`; getWidth(movieElem) +
10}px`;
}
} }
this.renderedItems += 1; this.renderedItems += 1;
} }
@ -22005,8 +22034,10 @@ class PlexMeetsHomeAssistant extends HTMLElement {
} }
this.content = document.createElement('div'); this.content = document.createElement('div');
this.content.innerHTML = this.loadCustomStyles(); this.content.innerHTML = this.loadCustomStyles();
this.content.style.overflowX = 'auto'; if (this.useHorizontalScroll) {
this.content.style.whiteSpace = 'nowrap'; this.content.style.overflowX = 'auto';
this.content.style.whiteSpace = 'nowrap';
}
if (this.error !== '') { if (this.error !== '') {
this.content.innerHTML += `Error: ${this.error}`; this.content.innerHTML += `Error: ${this.error}`;
} }
@ -22914,19 +22945,6 @@ class PlexMeetsHomeAssistant extends HTMLElement {
this.minimizeAll(); this.minimizeAll();
this.activeMovieElem = undefined; this.activeMovieElem = undefined;
this.hideDetails(); this.hideDetails();
/*
if (_.isEqual(movieElem.style.width, movieElem.style.height)) {
movieElemLocal.style.width = `${CSS_STYLE.width}px`;
movieElemLocal.style.height = `${CSS_STYLE.width}px`;
} else {
movieElemLocal.style.width = `${CSS_STYLE.width}px`;
movieElemLocal.style.height = `${CSS_STYLE.height}px`;
}
movieElemLocal.style.zIndex = '1';
movieElemLocal.style.position = 'relative';
movieElemLocal.style.top = `0px`;
movieElemLocal.style.left = `0px`;
*/
setTimeout(() => { setTimeout(() => {
movieElemLocal.dataset.clicked = 'false'; movieElemLocal.dataset.clicked = 'false';
}, 500); }, 500);
@ -23146,6 +23164,9 @@ class PlexMeetsHomeAssistant extends HTMLElement {
if (config.protocol) { if (config.protocol) {
this.plexProtocol = config.protocol; this.plexProtocol = config.protocol;
} }
if (config.useHorizontalScroll && lodash.isEqual(config.useHorizontalScroll, 'Yes')) {
this.useHorizontalScroll = true;
}
if (config.port && !lodash.isEqual(config.port, '')) { if (config.port && !lodash.isEqual(config.port, '')) {
this.plexPort = config.port; this.plexPort = config.port;
} }

28
src/editor.ts
Unescape View File

@ -26,6 +26,8 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement {
maxRows: any = document.createElement('paper-input'); maxRows: any = document.createElement('paper-input');
useHorizontalScroll: any = document.createElement('paper-dropdown-menu');
minWidth: any = document.createElement('paper-input'); minWidth: any = document.createElement('paper-input');
minEpisodeWidth: any = document.createElement('paper-input'); minEpisodeWidth: any = document.createElement('paper-input');
@ -145,6 +147,12 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement {
this.config.maxRows = this.maxRows.value; this.config.maxRows = this.maxRows.value;
} }
if (_.isEmpty(this.useHorizontalScroll.value)) {
this.config.useHorizontalScroll = '';
} else {
this.config.useHorizontalScroll = this.useHorizontalScroll.value;
}
if (_.isEmpty(this.minWidth.value)) { if (_.isEmpty(this.minWidth.value)) {
this.config.minWidth = ''; this.config.minWidth = '';
} else { } else {
@ -485,6 +493,22 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement {
this.maxCount.addEventListener('change', this.valueUpdated); this.maxCount.addEventListener('change', this.valueUpdated);
this.plexValidSection.appendChild(this.maxCount); this.plexValidSection.appendChild(this.maxCount);
this.useHorizontalScroll.innerHTML = '';
const useHorizontalScrollItems: any = document.createElement('paper-listbox');
useHorizontalScrollItems.appendChild(addDropdownItem('Yes'));
useHorizontalScrollItems.appendChild(addDropdownItem('No'));
useHorizontalScrollItems.slot = 'dropdown-content';
this.useHorizontalScroll.label = 'Use horizontal scroll';
this.useHorizontalScroll.appendChild(useHorizontalScrollItems);
this.useHorizontalScroll.style.width = '100%';
this.useHorizontalScroll.addEventListener('value-changed', this.valueUpdated);
if (_.isEmpty(this.config.useHorizontalScroll)) {
this.useHorizontalScroll.value = 'No';
} else {
this.useHorizontalScroll.value = this.config.useHorizontalScroll;
}
this.plexValidSection.appendChild(this.useHorizontalScroll);
this.maxRows.label = 'Maximum number of rows to display (Optional)'; this.maxRows.label = 'Maximum number of rows to display (Optional)';
this.maxRows.value = this.config.maxRows; this.maxRows.value = this.config.maxRows;
this.maxRows.type = 'number'; this.maxRows.type = 'number';
@ -817,6 +841,10 @@ class PlexMeetsHomeAssistantEditor extends HTMLElement {
this.config.maxRows = `${this.config.maxRows}`; this.config.maxRows = `${this.config.maxRows}`;
} }
if (_.isNumber(this.config.useHorizontalScroll)) {
this.config.useHorizontalScroll = `${this.config.useHorizontalScroll}`;
}
if (_.isNumber(this.config.minWidth)) { if (_.isNumber(this.config.minWidth)) {
this.config.minWidth = `${this.config.minWidth}`; this.config.minWidth = `${this.config.minWidth}`;
} }

38
src/plex-meets-homeassistant.ts
Unescape View File

@ -34,6 +34,8 @@ class PlexMeetsHomeAssistant extends HTMLElement {
plexProtocol: 'http' | 'https' = 'http'; plexProtocol: 'http' | 'https' = 'http';
useHorizontalScroll = false;
plexPort: number | false = false; plexPort: number | false = false;
epgData: Record<string, any> = {}; epgData: Record<string, any> = {};
@ -595,12 +597,14 @@ class PlexMeetsHomeAssistant extends HTMLElement {
count += 1; count += 1;
if (count > this.renderedItems) { if (count > this.renderedItems) {
this.contentContainer.appendChild(movieElem); this.contentContainer.appendChild(movieElem);
if (_.isEmpty(this.contentContainer.style.width)) { if (this.useHorizontalScroll) {
this.contentContainer.style.width = `${getWidth(movieElem) + 10}px`; if (_.isEmpty(this.contentContainer.style.width)) {
} else { this.contentContainer.style.width = `${getWidth(movieElem) + 10}px`;
this.contentContainer.style.width = `${parseFloat(this.contentContainer.style.width) + } else {
getWidth(movieElem) + this.contentContainer.style.width = `${parseFloat(this.contentContainer.style.width) +
10}px`; getWidth(movieElem) +
10}px`;
}
} }
this.renderedItems += 1; this.renderedItems += 1;
@ -708,8 +712,10 @@ class PlexMeetsHomeAssistant extends HTMLElement {
this.content = document.createElement('div'); this.content = document.createElement('div');
this.content.innerHTML = this.loadCustomStyles(); this.content.innerHTML = this.loadCustomStyles();
this.content.style.overflowX = 'auto'; if (this.useHorizontalScroll) {
this.content.style.whiteSpace = 'nowrap'; this.content.style.overflowX = 'auto';
this.content.style.whiteSpace = 'nowrap';
}
if (this.error !== '') { if (this.error !== '') {
this.content.innerHTML += `Error: ${this.error}`; this.content.innerHTML += `Error: ${this.error}`;
@ -1712,19 +1718,6 @@ class PlexMeetsHomeAssistant extends HTMLElement {
this.minimizeAll(); this.minimizeAll();
this.activeMovieElem = undefined; this.activeMovieElem = undefined;
this.hideDetails(); this.hideDetails();
/*
if (_.isEqual(movieElem.style.width, movieElem.style.height)) {
movieElemLocal.style.width = `${CSS_STYLE.width}px`;
movieElemLocal.style.height = `${CSS_STYLE.width}px`;
} else {
movieElemLocal.style.width = `${CSS_STYLE.width}px`;
movieElemLocal.style.height = `${CSS_STYLE.height}px`;
}
movieElemLocal.style.zIndex = '1';
movieElemLocal.style.position = 'relative';
movieElemLocal.style.top = `0px`;
movieElemLocal.style.left = `0px`;
*/
setTimeout(() => { setTimeout(() => {
movieElemLocal.dataset.clicked = 'false'; movieElemLocal.dataset.clicked = 'false';
@ -1972,6 +1965,9 @@ class PlexMeetsHomeAssistant extends HTMLElement {
if (config.protocol) { if (config.protocol) {
this.plexProtocol = config.protocol; this.plexProtocol = config.protocol;
} }
if (config.useHorizontalScroll && _.isEqual(config.useHorizontalScroll, 'Yes')) {
this.useHorizontalScroll = true;
}
if (config.port && !_.isEqual(config.port, '')) { if (config.port && !_.isEqual(config.port, '')) {
this.plexPort = config.port; this.plexPort = config.port;
} else { } else {

Write Preview
Loading…
Cancel
Save