Refactor carnival.js: reorganize confettiColors definition and clean up observer setup

Jellyfin.Plugin.Seasonals/Web/carnival.js

@@ -7,6 +7,12 @@ const enableDifferentDuration = config.EnableDifferentDuration !== undefined ? c
 const enableSway = config.EnableCarnivalSway !== undefined ? config.EnableCarnivalSway : true; // Enable side-to-side sway animation
 const carnivalCount = config.ObjectCount || 120; // Number of confetti pieces to spawn
 
+const confettiColors = [
+    '#fce18a', '#ff726d', '#b48def', '#f4306d', 
+    '#36c5f0', '#2ccc5d', '#e9b31d', '#9b59b6', 
+    '#3498db', '#e74c3c', '#1abc9c', '#f1c40f'
+];
+
 let msgPrinted = false;
 
 // function to check and control the carnival animation
@@ -37,20 +43,12 @@ function toggleCarnival() {
 
 // observe changes in the DOM
 const observer = new MutationObserver(toggleCarnival);
-
-// start observation
 observer.observe(document.body, {
-  childList: true,    // observe adding/removing of child elements
+  childList: true,
-  subtree: true,      // observe all levels of the DOM tree
+  subtree: true,
-  attributes: true    // observe changes to attributes (e.g. class changes)
+  attributes: true
 });
 
-const confettiColors = [
-    '#fce18a', '#ff726d', '#b48def', '#f4306d', 
-    '#36c5f0', '#2ccc5d', '#e9b31d', '#9b59b6', 
-    '#3498db', '#e74c3c', '#1abc9c', '#f1c40f'
-];
-
 function createConfettiPiece(container, isInitial = false) {
     const wrapper = document.createElement('div');
     wrapper.classList.add('carnival-wrapper');
@@ -85,7 +83,6 @@ function createConfettiPiece(container, isInitial = false) {
     // Random position
     wrapper.style.left = `${Math.random() * 100}%`;
 
-    // Random dimensions
     // MARK: CONFETTI SIZE (RECTANGLES)
     if (!confetti.classList.contains('circle') && !confetti.classList.contains('square') && !confetti.classList.contains('triangle')) {
         const width = Math.random() * 3 + 4; // 4-7px
@@ -99,7 +96,6 @@ function createConfettiPiece(container, isInitial = false) {
         confetti.style.height = `${size}px`;
     }
 
-    // Animation settings
     // MARK: CONFETTI FALLING SPEED (in seconds)
     const duration = Math.random() * 5 + 5; 
 
@@ -119,14 +115,12 @@ function createConfettiPiece(container, isInitial = false) {
         swayWrapper.style.animationDuration = `${swayDuration}s`;
         swayWrapper.style.animationDelay = `-${Math.random() * 5}s`;
         
-        // Random sway amplitude (using CSS variable for dynamic keyframe)
         // MARK: SWAY DISTANCE RANGE (in px)
         const swayAmount = Math.random() * 70 + 30; // 30-100px
         const direction = Math.random() > 0.5 ? 1 : -1;
         swayWrapper.style.setProperty('--sway-amount', `${swayAmount * direction}px`);
     }
     
-    // Flutter speed and random 3D rotation axis
     // MARK: CONFETTI FLUTTER ROTATION SPEED
     confetti.style.animationDuration = `${Math.random() * 2 + 1}s`;
     confetti.style.setProperty('--rx', Math.random().toFixed(2));
@@ -184,7 +178,7 @@ function initCarnivalObjects() {
 
 // initialize carnival
 function initializeCarnival() {
-  if (!carnival) return; // exit if carnival is disabled
+  if (!carnival) return;
     initCarnivalObjects();
     toggleCarnival();