1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

Move backdrop transparency method to component

This commit is contained in:
Bill Thornton 2022-04-12 16:22:00 -04:00
parent 3d11cbcd8f
commit 125d5cb015
6 changed files with 54 additions and 30 deletions

View file

@ -1,6 +1,6 @@
import { appHost } from './apphost';
import appSettings from '../scripts/settings/appSettings';
import backdrop from './backdrop/backdrop';
import backdrop, { setBackdropTransparency } from './backdrop/backdrop';
import browser from '../scripts/browser';
import { Events } from 'jellyfin-apiclient';
import globalize from '../scripts/globalize';
@ -252,30 +252,14 @@ class AppRouter {
}
}
/**
* Sets the backdrop, background, and document transparency
* @deprecated use Dashboard.setBackdropTransparency
*/
setTransparency(level) {
if (!this.backdropContainer) {
this.backdropContainer = document.querySelector('.backdropContainer');
}
if (!this.backgroundContainer) {
this.backgroundContainer = document.querySelector('.backgroundContainer');
}
if (level === 'full' || level === 2) {
backdrop.clearBackdrop(true);
document.documentElement.classList.add('transparentDocument');
this.backgroundContainer.classList.add('backgroundContainer-transparent');
this.backdropContainer.classList.add('hide');
} else if (level === 'backdrop' || level === 1) {
backdrop.externalBackdrop(true);
document.documentElement.classList.add('transparentDocument');
this.backgroundContainer.classList.add('backgroundContainer-transparent');
this.backdropContainer.classList.add('hide');
} else {
backdrop.externalBackdrop(false);
document.documentElement.classList.remove('transparentDocument');
this.backgroundContainer.classList.remove('backgroundContainer-transparent');
this.backdropContainer.classList.remove('hide');
}
// TODO: Remove this after JMP is updated to not use this function
console.warn('Deprecated! Use Dashboard.setBackdropTransparency');
setBackdropTransparency(level);
}
getRoutes() {

View file

@ -315,6 +315,41 @@ import ServerConnections from '../ServerConnections';
/* eslint-enable indent */
/**
* @enum TransparencyLevel
*/
export const TRANSPARENCY_LEVEL = {
Full: 'full',
Backdrop: 'backdrop',
None: 'none'
};
/**
* Sets the backdrop, background, and document transparency
* @param {TransparencyLevel} level The level of transparency
*/
export function setBackdropTransparency(level) {
const backdropElem = getBackdropContainer();
const backgroundElem = getBackgroundContainer();
if (level === TRANSPARENCY_LEVEL.Full || level === 2) {
clearBackdrop(true);
document.documentElement.classList.add('transparentDocument');
backgroundElem.classList.add('backgroundContainer-transparent');
backdropElem.classList.add('hide');
} else if (level === TRANSPARENCY_LEVEL.Backdrop || level === 1) {
externalBackdrop(true);
document.documentElement.classList.add('transparentDocument');
backgroundElem.classList.add('backgroundContainer-transparent');
backdropElem.classList.add('hide');
} else {
externalBackdrop(false);
document.documentElement.classList.remove('transparentDocument');
backgroundElem.classList.remove('backgroundContainer-transparent');
backdropElem.classList.remove('hide');
}
}
export default {
setBackdrops: setBackdrops,
setBackdrop: setBackdrop,