From 8e665c66dd3207d72d468fbb909de8cab66346aa Mon Sep 17 00:00:00 2001 From: meowarex Date: Wed, 4 Jun 2025 22:14:03 +1000 Subject: [PATCH] Added Contrast, Brightness & Blur Adjustment Settings --- plugins/radiant-lyrics-luna/src/Settings.tsx | 79 ++++++++++++++++---- plugins/radiant-lyrics-luna/src/index.ts | 7 +- 2 files changed, 68 insertions(+), 18 deletions(-) diff --git a/plugins/radiant-lyrics-luna/src/Settings.tsx b/plugins/radiant-lyrics-luna/src/Settings.tsx index 9efc2fe..f43ce95 100644 --- a/plugins/radiant-lyrics-luna/src/Settings.tsx +++ b/plugins/radiant-lyrics-luna/src/Settings.tsx @@ -1,5 +1,5 @@ import { ReactiveStore } from "@luna/core"; -import { LunaSettings, LunaSwitchSetting } from "@luna/ui"; +import { LunaSettings, LunaSwitchSetting, LunaNumberSetting } from "@luna/ui"; import React from "react"; export const settings = await ReactiveStore.getPluginStorage("RadiantLyrics", { @@ -7,6 +7,9 @@ export const settings = await ReactiveStore.getPluginStorage("RadiantLyrics", { playerBarVisible: true, lyricsGlowEnabled: true, spinningCoverEverywhere: false, + backgroundContrast: 120, + backgroundBlur: 80, + backgroundBrightness: 40, }); export const Settings = () => { @@ -14,6 +17,9 @@ export const Settings = () => { const [playerBarVisible, setPlayerBarVisible] = React.useState(settings.playerBarVisible); const [lyricsGlowEnabled, setLyricsGlowEnabled] = React.useState(settings.lyricsGlowEnabled); const [spinningCoverEverywhere, setSpinningCoverEverywhere] = React.useState(settings.spinningCoverEverywhere); + const [backgroundContrast, setBackgroundContrast] = React.useState(settings.backgroundContrast); + const [backgroundBlur, setBackgroundBlur] = React.useState(settings.backgroundBlur); + const [backgroundBrightness, setBackgroundBrightness] = React.useState(settings.backgroundBrightness); return ( @@ -30,19 +36,6 @@ export const Settings = () => { } }} /> - { - console.log("Spinning Cover Everywhere:", checked ? "enabled" : "disabled"); - setSpinningCoverEverywhere((settings.spinningCoverEverywhere = checked)); - // Update styles immediately when setting changes - if ((window as any).updateRadiantLyricsGlobalBackground) { - (window as any).updateRadiantLyricsGlobalBackground(); - } - }} - /> { } }} /> + { + console.log("Spinning Cover Everywhere:", checked ? "enabled" : "disabled"); + setSpinningCoverEverywhere((settings.spinningCoverEverywhere = checked)); + // Update styles immediately when setting changes + if ((window as any).updateRadiantLyricsGlobalBackground) { + (window as any).updateRadiantLyricsGlobalBackground(); + } + }} + /> + { + console.log("Background Contrast:", value); + setBackgroundContrast((settings.backgroundContrast = value)); + if ((window as any).updateRadiantLyricsGlobalBackground) { + (window as any).updateRadiantLyricsGlobalBackground(); + } + }} + /> + { + console.log("Background Blur:", value); + setBackgroundBlur((settings.backgroundBlur = value)); + if ((window as any).updateRadiantLyricsGlobalBackground) { + (window as any).updateRadiantLyricsGlobalBackground(); + } + }} + /> + { + console.log("Background Brightness:", value); + setBackgroundBrightness((settings.backgroundBrightness = value)); + if ((window as any).updateRadiantLyricsGlobalBackground) { + (window as any).updateRadiantLyricsGlobalBackground(); + } + }} + /> ); }; \ No newline at end of file diff --git a/plugins/radiant-lyrics-luna/src/index.ts b/plugins/radiant-lyrics-luna/src/index.ts index e12ebf1..2fcb690 100644 --- a/plugins/radiant-lyrics-luna/src/index.ts +++ b/plugins/radiant-lyrics-luna/src/index.ts @@ -107,6 +107,7 @@ const applyGlobalSpinningBackground = (albumImageSrc: string): void => { img.src = albumImageSrc; img.className = 'global-spinning-image'; img.style.animationDelay = '0s'; + img.style.filter = `blur(${settings.backgroundBlur}px) brightness(${settings.backgroundBrightness / 100}) contrast(${settings.backgroundContrast}%)`; appContainer.appendChild(img); }; @@ -399,7 +400,6 @@ const onTrackChanged = function (method: number = 0): void { } } else { cleanUpDynamicArt(); - //trace.msg.log("Couldn't get album art"); - Broken as fucky return; } } @@ -407,7 +407,6 @@ const onTrackChanged = function (method: number = 0): void { // Only update if the image source has actually changed if (albumImageSrc && albumImageSrc !== currentTrackSrc) { currentTrackSrc = albumImageSrc; - //trace.msg.log(`Track changed, updating background: ${albumImageSrc}`); - Accidentally left this in Prod... // Apply global spinning background if enabled if (settings.spinningCoverEverywhere && albumImageSrc !== currentGlobalTrackSrc) { @@ -434,7 +433,7 @@ const onTrackChanged = function (method: number = 0): void { centerImg.style.height = '150vh'; centerImg.style.objectFit = 'cover'; centerImg.style.zIndex = '-1'; - centerImg.style.filter = 'blur(100px) brightness(0.4) contrast(1.2) saturate(1)'; + centerImg.style.filter = `blur(${settings.backgroundBlur}px) brightness(${settings.backgroundBrightness / 100}) contrast(${settings.backgroundContrast}%)`; centerImg.style.animation = 'spin 35s linear infinite'; centerImg.style.animationDelay = '5s'; // Add a 5-second delay nowPlayingContainerElement.appendChild(centerImg); @@ -450,7 +449,7 @@ const onTrackChanged = function (method: number = 0): void { centerImg2.style.height = '150vh'; centerImg2.style.objectFit = 'cover'; centerImg2.style.zIndex = '-1'; - centerImg2.style.filter = 'blur(100px) brightness(0.4) contrast(1.2) saturate(1)'; + centerImg2.style.filter = `blur(${settings.backgroundBlur}px) brightness(${settings.backgroundBrightness / 100}) contrast(${settings.backgroundContrast}%)`; centerImg2.style.animation = 'spin 35s linear infinite'; nowPlayingContainerElement.appendChild(centerImg2);