mirror of
https://github.com/meowarex/TidaLuna-Plugins.git
synced 2026-06-18 03:43:10 +10:00
Flow Refactor
This commit is contained in:
@@ -65,7 +65,7 @@ export const Settings = () => {
|
||||
title="Lyrics Glow Effect"
|
||||
desc="Enable glowing effect for lyrics & Font Stytling Changes"
|
||||
checked={lyricsGlowEnabled}
|
||||
onChange={(_event: unknown, checked: boolean) => {
|
||||
onChange={(_: void, checked: boolean) => {
|
||||
setLyricsGlowEnabled((settings.lyricsGlowEnabled = checked));
|
||||
// Update styles immediately when setting changes
|
||||
if ((window as any).updateRadiantLyricsStyles) {
|
||||
@@ -77,7 +77,7 @@ export const Settings = () => {
|
||||
title="Track Title Glow"
|
||||
desc="Apply glow to the track title"
|
||||
checked={trackTitleGlow}
|
||||
onChange={(_event: unknown, checked: boolean) => {
|
||||
onChange={(_: void, checked: boolean) => {
|
||||
setTrackTitleGlow((settings.trackTitleGlow = checked));
|
||||
if ((window as any).updateRadiantLyricsStyles) {
|
||||
(window as any).updateRadiantLyricsStyles();
|
||||
@@ -88,7 +88,7 @@ export const Settings = () => {
|
||||
title="Hide UI Feature"
|
||||
desc="Enable hide/unhide UI functionality with toggle buttons"
|
||||
checked={hideUIEnabled}
|
||||
onChange={(_event: unknown, checked: boolean) => {
|
||||
onChange={(_: void, checked: boolean) => {
|
||||
setHideUIEnabled((settings.hideUIEnabled = checked));
|
||||
}}
|
||||
/>
|
||||
@@ -96,7 +96,7 @@ export const Settings = () => {
|
||||
title="Player Bar Visibility in Hide UI Mode"
|
||||
desc="Keep player bar visible when UI is hidden"
|
||||
checked={playerBarVisible}
|
||||
onChange={(_event: unknown, checked: boolean) => {
|
||||
onChange={(_: void, checked: boolean) => {
|
||||
console.log("Player Bar Visibility:", checked ? "visible" : "hidden");
|
||||
setPlayerBarVisible((settings.playerBarVisible = checked));
|
||||
// Update styles immediately when setting changes
|
||||
@@ -109,7 +109,7 @@ export const Settings = () => {
|
||||
title="Cover Everywhere"
|
||||
desc="Apply the spinning Cover Art background to the entire app, not just the Now Playing view, Heavily Inspired by Cover-Theme by @Inrixia"
|
||||
checked={spinningCoverEverywhere}
|
||||
onChange={(_event: unknown, checked: boolean) => {
|
||||
onChange={(_: void, checked: boolean) => {
|
||||
console.log(
|
||||
"Spinning Cover Everywhere:",
|
||||
checked ? "enabled" : "disabled",
|
||||
@@ -127,7 +127,7 @@ export const Settings = () => {
|
||||
title="Performance Mode | Experimental"
|
||||
desc="Performance mode: Reduces blur effects & uses smaller image sizes, to optimize GPU usage"
|
||||
checked={performanceMode}
|
||||
onChange={(_event: unknown, checked: boolean) => {
|
||||
onChange={(_: void, checked: boolean) => {
|
||||
console.log("Performance Mode:", checked ? "enabled" : "disabled");
|
||||
setPerformanceMode((settings.performanceMode = checked));
|
||||
// Update background animations immediately when setting changes
|
||||
@@ -143,7 +143,7 @@ export const Settings = () => {
|
||||
title="Background Cover Spin" // Cheers @Max/n0201 for the idea <3
|
||||
desc="Enable the spinning cover art background animation"
|
||||
checked={spinningArtEnabled}
|
||||
onChange={(_event: unknown, checked: boolean) => {
|
||||
onChange={(_: void, checked: boolean) => {
|
||||
console.log(
|
||||
"Background Cover Spin:",
|
||||
checked ? "enabled" : "disabled",
|
||||
@@ -262,7 +262,7 @@ export const Settings = () => {
|
||||
title="Settings Affect Now Playing"
|
||||
desc="Apply background settings to Now Playing view"
|
||||
checked={settingsAffectNowPlaying}
|
||||
onChange={(_event: unknown, checked: boolean) => {
|
||||
onChange={(_: void, checked: boolean) => {
|
||||
console.log(
|
||||
"Settings Affect Now Playing:",
|
||||
checked ? "enabled" : "disabled",
|
||||
|
||||
@@ -38,30 +38,30 @@ const updateRadiantLyricsTextGlow = function (): void {
|
||||
// Function to update styles when settings change
|
||||
const updateRadiantLyricsStyles = function (): void {
|
||||
if (isHidden) {
|
||||
// Apply only base styles (button hiding), NOT separated lyrics styles
|
||||
// to avoid affecting lyrics scrolling behavior
|
||||
// Apply only base styles (button hiding) and optional player bar hiding
|
||||
baseStyleTag.css = baseStyles;
|
||||
|
||||
// Apply player bar styles based on setting
|
||||
if (!settings.playerBarVisible) {
|
||||
playerBarStyleTag.css = playerBarHidden;
|
||||
} else {
|
||||
playerBarStyleTag.remove();
|
||||
}
|
||||
// Ensure lyrics glow styles are not applied when hidden
|
||||
lyricsGlowStyleTag.remove();
|
||||
return;
|
||||
}
|
||||
|
||||
// Update lyrics glow based on setting (only if UI is not hidden to avoid interference)
|
||||
// Update lyrics glow based on setting (only when UI is visible)
|
||||
const lyricsContainer = document.querySelector('[class^="_lyricsContainer"]');
|
||||
if (lyricsContainer && !isHidden) {
|
||||
if (lyricsContainer) {
|
||||
if (settings.lyricsGlowEnabled) {
|
||||
lyricsContainer.classList.remove("lyrics-glow-disabled");
|
||||
(lyricsContainer as HTMLElement).classList.remove("lyrics-glow-disabled");
|
||||
lyricsGlowStyleTag.css = lyricsGlow;
|
||||
updateRadiantLyricsTextGlow();
|
||||
} else {
|
||||
lyricsContainer.classList.add("lyrics-glow-disabled");
|
||||
(lyricsContainer as HTMLElement).classList.add("lyrics-glow-disabled");
|
||||
lyricsGlowStyleTag.remove();
|
||||
}
|
||||
} else if (!isHidden) {
|
||||
} else {
|
||||
observePromise<HTMLElement>(unloads, '[class^="_lyricsContainer"]')
|
||||
.then((el) => {
|
||||
if (!el) return;
|
||||
@@ -95,6 +95,16 @@ const updateRadiantLyricsStyles = function (): void {
|
||||
var isHidden = false;
|
||||
let unhideButtonAutoFadeTimeout: number | null = null;
|
||||
|
||||
// Helper to safely create a one-off timeout that clears previous if any
|
||||
const safelySetAutoFadeTimeout = (
|
||||
existingId: number | null,
|
||||
fn: () => void,
|
||||
delay: number,
|
||||
): number => {
|
||||
if (existingId != null) window.clearTimeout(existingId);
|
||||
return window.setTimeout(fn, delay);
|
||||
};
|
||||
|
||||
const updateButtonStates = function (): void {
|
||||
const hideButton = document.querySelector(".hide-ui-button") as HTMLElement;
|
||||
const unhideButton = document.querySelector(
|
||||
@@ -120,7 +130,7 @@ const updateButtonStates = function (): void {
|
||||
}
|
||||
if (unhideButton) {
|
||||
// Clear any existing auto-fade timeout
|
||||
if (unhideButtonAutoFadeTimeout) {
|
||||
if (unhideButtonAutoFadeTimeout != null) {
|
||||
window.clearTimeout(unhideButtonAutoFadeTimeout);
|
||||
unhideButtonAutoFadeTimeout = null;
|
||||
}
|
||||
@@ -137,11 +147,15 @@ const updateButtonStates = function (): void {
|
||||
unhideButton.style.pointerEvents = "auto";
|
||||
|
||||
// Set up auto-fade after 2 seconds
|
||||
unhideButtonAutoFadeTimeout = window.setTimeout(() => {
|
||||
if (isHidden && unhideButton && !unhideButton.matches(":hover")) {
|
||||
unhideButton.classList.add("auto-faded");
|
||||
}
|
||||
}, 2000);
|
||||
unhideButtonAutoFadeTimeout = safelySetAutoFadeTimeout(
|
||||
unhideButtonAutoFadeTimeout,
|
||||
() => {
|
||||
if (isHidden && unhideButton && !unhideButton.matches(":hover")) {
|
||||
unhideButton.classList.add("auto-faded");
|
||||
}
|
||||
},
|
||||
2000,
|
||||
);
|
||||
}, 50);
|
||||
} else {
|
||||
// Smooth fade out for Unhide UI button
|
||||
@@ -771,7 +785,7 @@ unloads.add(() => {
|
||||
cleanUpDynamicArt();
|
||||
|
||||
// Clean up auto-fade timeout
|
||||
if (unhideButtonAutoFadeTimeout) {
|
||||
if (unhideButtonAutoFadeTimeout != null) {
|
||||
window.clearTimeout(unhideButtonAutoFadeTimeout);
|
||||
unhideButtonAutoFadeTimeout = null;
|
||||
}
|
||||
|
||||
@@ -9,22 +9,19 @@
|
||||
@font-face {
|
||||
font-family: "AbyssFont";
|
||||
font-weight: 500;
|
||||
src: url("https://excel.lexploits.top/extra/tidal/LyricsMedium.woff2")
|
||||
format("woff2");
|
||||
src: url("https://excel.lexploits.top/extra/tidal/LyricsMedium.woff2") format("woff2");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "AbyssFont";
|
||||
font-weight: 600;
|
||||
src: url("https://excel.lexploits.top/extra/tidal/LyricsSemibold.woff2")
|
||||
format("woff2");
|
||||
src: url("https://excel.lexploits.top/extra/tidal/LyricsSemibold.woff2") format("woff2");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "AbyssFont";
|
||||
font-weight: 700;
|
||||
src: url("https://excel.lexploits.top/extra/tidal/LyricsBold.woff2")
|
||||
format("woff2");
|
||||
src: url("https://excel.lexploits.top/extra/tidal/LyricsBold.woff2") format("woff2");
|
||||
}
|
||||
|
||||
/* Enhanced lyrics styling with glow effects */
|
||||
|
||||
Reference in New Issue
Block a user