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

Add: WIP poster as background

Browse Source
pull/16/head
Juraj Nyíri 4 years ago
parent c8ad09ab6d
commit d1aabc18ec
4 changed files with 64 additions and 2 deletions
Show Stats Download Patch File Download Diff File

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

@ -19681,6 +19681,16 @@ style.textContent = css `
transition: 0.5s;
left: 0;
top: 0;
background-size: cover;
}
.contentArt {
position: absolute;
background-color: rgba(0, 0, 0, 0);
z-index: 2;
left: 0;
top: 0;
background-size: cover;
display: none;
}
.yearElem {
color: hsla(0, 0%, 100%, 0.45);
@ -20194,6 +20204,9 @@ class PlexMeetsHomeAssistant extends HTMLElement {
const contentbg = document.createElement('div');
contentbg.className = 'contentbg';
this.content.appendChild(contentbg);
const contentArt = document.createElement('div');
contentArt.className = 'contentArt';
this.content.appendChild(contentArt);
this.detailElem = document.createElement('div');
this.detailElem.className = 'detail';
this.detailElem.innerHTML = `<h1 class='detailsTitle'></h1>
@ -20320,6 +20333,10 @@ class PlexMeetsHomeAssistant extends HTMLElement {
this.hideBackground();
this.minimizeAll();
});
contentArt.addEventListener('click', () => {
this.hideBackground();
this.minimizeAll();
});
}, 1);
const endElem = document.createElement('div');
endElem.className = 'clear';
@ -20582,6 +20599,7 @@ class PlexMeetsHomeAssistant extends HTMLElement {
}
const dataDetails = await this.plex.getDetails(data.key.split('/')[3]);
if (this.videoElem) {
const art = this.plex.authorizeURL(this.plex.getBasicURL() + data.art);
const trailerURL = findTrailerURL(dataDetails);
if (trailerURL !== '' && !lodash.isEqual(this.playTrailer, false)) {
const videoPlayer = this.getElementsByClassName('videoPlayer')[0];
@ -20648,6 +20666,14 @@ class PlexMeetsHomeAssistant extends HTMLElement {
}
});
}
else {
const contentArt = this.getElementsByClassName('contentArt')[0];
contentArt.style.width = `${window.innerWidth}px`;
contentArt.style.height = `${window.innerHeight}px`;
contentArt.style.display = 'block';
contentArt.style.backgroundImage = `url('${art}')`;
contentArt.style.top = `${top - 8}px`;
}
}
if (!lodash.isEmpty(seasonsData)) {
this.seasonElemFreshlyLoaded = true;
@ -20871,6 +20897,8 @@ class PlexMeetsHomeAssistant extends HTMLElement {
contentbg.classList.remove('no-transparency');
contentbg.style.zIndex = '1';
contentbg.style.backgroundColor = 'rgba(0,0,0,0)';
const contentArt = this.getElementsByClassName('contentArt')[0];
contentArt.style.display = 'none';
};
this.activateMovieElem = (movieElem) => {
const movieElemLocal = movieElem;

10
src/modules/style.ts
Unescape View File

@ -180,6 +180,16 @@ style.textContent = css`
transition: 0.5s;
left: 0;
top: 0;
background-size: cover;
}
.contentArt {
position: absolute;
background-color: rgba(0, 0, 0, 0);
z-index: 2;
left: 0;
top: 0;
background-size: cover;
display: none;
}
.yearElem {
color: hsla(0, 0%, 100%, 0.45);

7
src/modules/utils.ts
Unescape View File

@ -22,6 +22,10 @@ const getHeight = (el: HTMLElement): number => {
const height = Math.max(el.scrollHeight, el.offsetHeight, el.clientHeight, el.scrollHeight, el.offsetHeight);
return height;
};
const getWidth = (el: HTMLElement): number => {
const width = Math.max(el.scrollWidth, el.offsetWidth, el.clientWidth, el.scrollWidth, el.offsetWidth);
return width;
};
const getOffset = (el: Element): Record<string, any> => {
let x = 0;
@ -185,5 +189,6 @@ export {
findTrailerURL,
isVideoFullScreen,
hasEpisodes,
getOldPlexServerErrorMessage
getOldPlexServerErrorMessage,
getWidth
};

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

@ -14,7 +14,8 @@ import {
findTrailerURL,
isVideoFullScreen,
hasEpisodes,
getOldPlexServerErrorMessage
getOldPlexServerErrorMessage,
getWidth
} from './modules/utils';
import style from './modules/style';
@ -410,6 +411,10 @@ class PlexMeetsHomeAssistant extends HTMLElement {
contentbg.className = 'contentbg';
this.content.appendChild(contentbg);
const contentArt = document.createElement('div');
contentArt.className = 'contentArt';
this.content.appendChild(contentArt);
this.detailElem = document.createElement('div');
this.detailElem.className = 'detail';
this.detailElem.innerHTML = `<h1 class='detailsTitle'></h1>
@ -545,6 +550,10 @@ class PlexMeetsHomeAssistant extends HTMLElement {
this.hideBackground();
this.minimizeAll();
});
contentArt.addEventListener('click', () => {
this.hideBackground();
this.minimizeAll();
});
}, 1);
const endElem = document.createElement('div');
@ -824,6 +833,7 @@ class PlexMeetsHomeAssistant extends HTMLElement {
}
const dataDetails = await this.plex.getDetails(data.key.split('/')[3]);
if (this.videoElem) {
const art = this.plex.authorizeURL(this.plex.getBasicURL() + data.art);
const trailerURL = findTrailerURL(dataDetails);
if (trailerURL !== '' && !_.isEqual(this.playTrailer, false)) {
const videoPlayer = this.getElementsByClassName('videoPlayer')[0] as HTMLElement;
@ -897,6 +907,13 @@ class PlexMeetsHomeAssistant extends HTMLElement {
this.videoElem.style.top = `${top}px`;
}
});
} else {
const contentArt = this.getElementsByClassName('contentArt')[0] as HTMLElement;
contentArt.style.width = `${window.innerWidth}px`;
contentArt.style.height = `${window.innerHeight}px`;
contentArt.style.display = 'block';
contentArt.style.backgroundImage = `url('${art}')`;
contentArt.style.top = `${top - 8}px`;
}
}
if (!_.isEmpty(seasonsData)) {
@ -1166,6 +1183,8 @@ class PlexMeetsHomeAssistant extends HTMLElement {
contentbg.classList.remove('no-transparency');
contentbg.style.zIndex = '1';
contentbg.style.backgroundColor = 'rgba(0,0,0,0)';
const contentArt = this.getElementsByClassName('contentArt')[0] as HTMLElement;
contentArt.style.display = 'none';
};
activateMovieElem = (movieElem: HTMLElement): void => {

Write Preview
Loading…
Cancel
Save