Merge pull request #24 from meowarex/dev

Added Spin Speed Setting

plugins/radiant-lyrics-luna/src/Settings.tsx

@@ -11,6 +11,8 @@ export const settings = await ReactiveStore.getPluginStorage("RadiantLyrics", {
 	backgroundContrast: 120,
 	backgroundBlur: 80,
 	backgroundBrightness: 40,
+	spinSpeed: 45,
+	settingsAffectNowPlaying: true,
 });
 
 export const Settings = () => {
@@ -22,6 +24,8 @@ export const Settings = () => {
 	const [backgroundContrast, setBackgroundContrast] = React.useState(settings.backgroundContrast);
 	const [backgroundBlur, setBackgroundBlur] = React.useState(settings.backgroundBlur);
 	const [backgroundBrightness, setBackgroundBrightness] = React.useState(settings.backgroundBrightness);
+	const [spinSpeed, setSpinSpeed] = React.useState(settings.spinSpeed);
+	const [settingsAffectNowPlaying, setSettingsAffectNowPlaying] = React.useState(settings.settingsAffectNowPlaying);
 	
 	return (
 		<LunaSettings>
@@ -102,6 +106,9 @@ export const Settings = () => {
 					if ((window as any).updateRadiantLyricsGlobalBackground) {
 						(window as any).updateRadiantLyricsGlobalBackground();
 					}
+					if (settings.settingsAffectNowPlaying && (window as any).updateRadiantLyricsNowPlayingBackground) {
+						(window as any).updateRadiantLyricsNowPlayingBackground();
+					}
 				}}
 			/>
 			<LunaNumberSetting
@@ -117,6 +124,9 @@ export const Settings = () => {
 					if ((window as any).updateRadiantLyricsGlobalBackground) {
 						(window as any).updateRadiantLyricsGlobalBackground();
 					}
+					if (settings.settingsAffectNowPlaying && (window as any).updateRadiantLyricsNowPlayingBackground) {
+						(window as any).updateRadiantLyricsNowPlayingBackground();
+					}
 				}}
 			/>
 			<LunaNumberSetting
@@ -132,6 +142,40 @@ export const Settings = () => {
 					if ((window as any).updateRadiantLyricsGlobalBackground) {
 						(window as any).updateRadiantLyricsGlobalBackground();
 					}
+					if (settings.settingsAffectNowPlaying && (window as any).updateRadiantLyricsNowPlayingBackground) {
+						(window as any).updateRadiantLyricsNowPlayingBackground();
+					}
+				}}
+			/>
+			<LunaNumberSetting
+				title="Spin Speed"
+				desc="Adjust the rotation speed in seconds (10-120, default: 45) - Lower values = Faster rotation"
+				min={10}
+				max={120}
+				step={1}
+				value={spinSpeed}
+				onNumber={(value: number) => {
+					console.log("Spin Speed:", value);
+					setSpinSpeed((settings.spinSpeed = value));
+					if ((window as any).updateRadiantLyricsGlobalBackground) {
+						(window as any).updateRadiantLyricsGlobalBackground();
+					}
+					if (settings.settingsAffectNowPlaying && (window as any).updateRadiantLyricsNowPlayingBackground) {
+						(window as any).updateRadiantLyricsNowPlayingBackground();
+					}
+				}}
+			/>
+			<LunaSwitchSetting
+				title="Settings Affect Now Playing"
+				desc="Apply background settings to Now Playing view"
+				checked={settingsAffectNowPlaying}
+				onChange={(_, checked: boolean) => {
+					console.log("Settings Affect Now Playing:", checked ? "enabled" : "disabled");
+					setSettingsAffectNowPlaying((settings.settingsAffectNowPlaying = checked));
+					// Update Now Playing background immediately when setting changes
+					if ((window as any).updateRadiantLyricsNowPlayingBackground) {
+						(window as any).updateRadiantLyricsNowPlayingBackground();
+					}
 				}}
 			/>
 		</LunaSettings>

plugins/radiant-lyrics-luna/src/index.ts

@@ -114,6 +114,7 @@ const applyGlobalSpinningBackground = (coverArtImageSrc: string): void => {
         img.style.animation = 'none';
         img.classList.add('performance-mode-static');
     } else {
+        img.style.animation = `spinGlobal ${settings.spinSpeed}s linear infinite`;
         img.classList.remove('performance-mode-static');
     }
     
@@ -148,31 +149,38 @@ const updateRadiantLyricsGlobalBackground = function(): void {
     }
 };
 
-// Function to update performance mode for existing backgrounds
+// Function to update Now Playing background when settings change
-const updateRadiantLyricsPerformanceMode = function(): void {
+const updateRadiantLyricsNowPlayingBackground = function(): void {
-    // Update global spinning background images
-    const globalImages = document.querySelectorAll('.global-spinning-image');
-    globalImages.forEach((img: Element) => {
-        const imgElement = img as HTMLElement;
-        if (settings.performanceMode) {
-            imgElement.style.animation = 'none';
-            imgElement.classList.add('performance-mode-static');
-        } else {
-            imgElement.style.animation = '';
-            imgElement.classList.remove('performance-mode-static');
-        }
-    });
-    
-    // Update Now Playing background images
     const nowPlayingBackgroundImages = document.querySelectorAll('.now-playing-background-image');
     nowPlayingBackgroundImages.forEach((img: Element) => {
         const imgElement = img as HTMLElement;
-        if (settings.performanceMode) {
+        
-            imgElement.style.animation = 'none';
+        // Default values when settings don't affect Now Playing
-            imgElement.classList.add('performance-mode-static');
+        const defaultBlur = 80;
+        const defaultBrightness = 40;
+        const defaultContrast = 120;
+        const defaultSpinSpeed = 45;
+        
+        if (settings.settingsAffectNowPlaying) {
+            // Use settings values
+            if (settings.performanceMode) {
+                imgElement.style.animation = 'none';
+                imgElement.classList.add('performance-mode-static');
+            } else {
+                imgElement.style.animation = `spin ${settings.spinSpeed}s linear infinite`;
+                imgElement.classList.remove('performance-mode-static');
+            }
+            imgElement.style.filter = `blur(${settings.backgroundBlur}px) brightness(${settings.backgroundBrightness / 100}) contrast(${settings.backgroundContrast}%)`;
         } else {
-            imgElement.style.animation = 'spin 35s linear infinite';
+            // Reset to default values
-            imgElement.classList.remove('performance-mode-static');
+            if (settings.performanceMode) {
+                imgElement.style.animation = 'none';
+                imgElement.classList.add('performance-mode-static');
+            } else {
+                imgElement.style.animation = `spin ${defaultSpinSpeed}s linear infinite`;
+                imgElement.classList.remove('performance-mode-static');
+            }
+            imgElement.style.filter = `blur(${defaultBlur}px) brightness(${defaultBrightness / 100}) contrast(${defaultContrast}%)`;
         }
     });
 };
@@ -180,7 +188,7 @@ const updateRadiantLyricsPerformanceMode = function(): void {
 // Make these functions available globally so Settings can call them
 (window as any).updateRadiantLyricsStyles = updateRadiantLyricsStyles;
 (window as any).updateRadiantLyricsGlobalBackground = updateRadiantLyricsGlobalBackground;
-(window as any).updateRadiantLyricsPerformanceMode = updateRadiantLyricsPerformanceMode;
+(window as any).updateRadiantLyricsNowPlayingBackground = updateRadiantLyricsNowPlayingBackground;
 
 const toggleRadiantLyrics = function(): void {
     // Toggle the state first
@@ -494,7 +502,7 @@ const updateCoverArtBackground = function (method: number = 0): void {
                 backgroundImage.style.animation = 'none';
                 backgroundImage.classList.add('performance-mode-static');
             } else {
-                backgroundImage.style.animation = 'spin 45s linear infinite';
+                backgroundImage.style.animation = `spin ${settings.spinSpeed}s linear infinite`;
                 backgroundImage.classList.remove('performance-mode-static');
             }
             nowPlayingContainerElement.appendChild(backgroundImage);