-
-
Enable Seasonal Animations
-
Enable falling snow/leaves animations for seasonal themes
- ${buildJellyfinCheckbox('homeScreen_seasonal_enableSeasonalAnimations', seasonal.enableSeasonalAnimations !== false, 'Enabled')}
+
+
+
Enable Seasonal Animations
+
Enable falling snow/leaves animations for seasonal themes
+ ${buildJellyfinCheckbox('homeScreen_seasonal_enableSeasonalAnimations', seasonal.enableSeasonalAnimations !== false, 'Enabled')}
+
+
+
+
+
Enable Christmas Background
+
Enable the festive background image for the Christmas theme
+ ${buildJellyfinCheckbox('homeScreen_seasonal_enableSeasonalBackground', seasonal.enableSeasonalBackground !== false, 'Enabled')}
+
-
${seasonalSectionsHtml}
@@ -5080,6 +5087,7 @@ window.KefinTweaksConfig = ${JSON.stringify(config, null, 2)};`;
seasonal: {
enabled: document.getElementById('homeScreen_seasonal_enabled')?.checked !== false,
enableSeasonalAnimations: document.getElementById('homeScreen_seasonal_enableSeasonalAnimations')?.checked !== false,
+ enableSeasonalBackground: document.getElementById('homeScreen_seasonal_enableSeasonalBackground')?.checked !== false,
defaultItemLimit: 16,
defaultSortOrder: 'Random',
defaultCardFormat: 'Poster',
diff --git a/scripts/homeScreen.css b/scripts/homeScreen.css
index abdd5a1..1b36dcf 100644
--- a/scripts/homeScreen.css
+++ b/scripts/homeScreen.css
@@ -58,7 +58,7 @@
}
/* Halloween theme */
-.home-screen.halloween-theme #reactRoot:has(.libraryPage:not(.hide) .pageTabContent.is-active[data-index="0"])>.backgroundContainer::after {
+.home-screen.halloween-theme.with-background #reactRoot:has(.libraryPage:not(.hide) .pageTabContent.is-active[data-index="0"])>.backgroundContainer::after {
content: '';
position: absolute;
top: 0;
@@ -71,7 +71,7 @@
}
/* Christmas theme */
-.home-screen.christmas-theme #reactRoot:has(.libraryPage:not(.hide) .pageTabContent.is-active[data-index="0"])>.backgroundContainer::after {
+.home-screen.christmas-theme.with-background #reactRoot:has(.libraryPage:not(.hide) .pageTabContent.is-active[data-index="0"])>.backgroundContainer::after {
content: '';
position: absolute;
top: 0;
diff --git a/scripts/homeScreen.js b/scripts/homeScreen.js
index 52497d9..8d0bd19 100644
--- a/scripts/homeScreen.js
+++ b/scripts/homeScreen.js
@@ -142,6 +142,7 @@
const homeScreenConfig = window.KefinTweaksConfig?.homeScreen || {};
const seasonalConfig = homeScreenConfig.seasonal || {};
const enableSeasonalAnimations = seasonalConfig.enableSeasonalAnimations !== false;
+ const enableSeasonalBackground = seasonalConfig.enableSeasonalBackground !== false;
// Manage home-screen class
if (isHomePage && body) {
@@ -153,7 +154,7 @@
// Manage theme classes (only on home page)
if (isHomePage) {
// Remove all existing theme classes
- const themeClasses = ['halloween-theme', 'christmas-theme', 'valentines-theme', 'newyear-theme'];
+ const themeClasses = ['halloween-theme', 'christmas-theme', 'valentines-theme', 'newyear-theme', 'with-background'];
themeClasses.forEach(themeClass => body.classList.remove(themeClass));
// Add appropriate theme class based on current date
@@ -162,6 +163,10 @@
} else if (isChristmasPeriod()) {
body.classList.add('christmas-theme');
+ if (enableSeasonalBackground) {
+ body.classList.add('with-background');
+ }
+
if (enableSeasonalAnimations) {
// Import the Flurry module and leverage it from jQuery. /scripts/third party/flurry.js by appending it to the head
const flurryScriptSrc = (window.KefinTweaksConfig.kefinTweaksRoot || '') + 'scripts/third party/jquery.flurry.min.js';
@@ -192,7 +197,7 @@
}
} else {
// Remove all theme classes when not on home page
- const themeClasses = ['halloween-theme', 'christmas-theme', 'valentines-theme', 'newyear-theme'];
+ const themeClasses = ['halloween-theme', 'christmas-theme', 'valentines-theme', 'newyear-theme', 'with-background'];
themeClasses.forEach(themeClass => body.classList.remove(themeClass));
}
}