Added Quality Matched Seeker Color

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

@@ -22,7 +22,6 @@ export { Settings };
 // clean up resources
 export const unloads = new Set<LunaUnload>();
 
-// Marker: Styles and Settings Integration
 // StyleTag instances for different CSS modules
 const lyricsStyleTag = new StyleTag("RadiantLyrics-lyrics", unloads);
 const baseStyleTag = new StyleTag("RadiantLyrics-base", unloads);
@@ -100,7 +99,52 @@ observe<HTMLElement>(unloads, '[data-test="footer-player"]', () => {
 	applyPlayerBarTintToElement();
 });
 
-// Apply base styles always (contains global fixes and conditional UI hiding styles)
+// MARKER: Quality-Based Seeker Color
+// Colors for the quality tier (Max, High, Low)
+const qualityColors: Record<string, string> = {
+	Max: "#ffd432",
+	High: "#3fe",
+	Low: "#FFFFFF",
+};
+
+const applyQualityProgressColor = (): void => {
+	const progressIndicator = document.querySelector(
+		'[data-test="progress-indicator"]',
+	) as HTMLElement | null;
+	if (!progressIndicator) return;
+
+	// Reset to white (for when the setting gets disabled)
+	if (!settings.qualityProgressColor) {
+		progressIndicator.style.setProperty("background-color", "#FFFFFF", "important");
+		return;
+	}
+
+	// get the media-state tag (Max, High, Low)
+	const qualityButton = document.querySelector(
+		'[data-test="media-state-max"], [data-test="media-state-high"], [data-test="media-state-low"]',
+	) as HTMLElement | null;
+	if (!qualityButton) return;
+
+	const qualityText = qualityButton.textContent?.trim() ?? "";
+	const color = qualityColors[qualityText];
+	if (!color) return;
+
+	progressIndicator.style.setProperty("background-color", color, "important");
+};
+
+// Called Settings
+const updateQualityProgressColor = (): void => {
+	applyQualityProgressColor();
+};
+
+function setupQualityProgressObserver(): void {
+	// Apply on load (uses observeTrackChanges instead of polling yay me <3)
+	if (settings.qualityProgressColor) {
+		applyQualityProgressColor();
+	}
+}
+
+// Apply base styles always (I kinda dont really remember what this does but it's important i guess)
 baseStyleTag.css = baseStyles;
 
 // Update CSS variables for lyrics text glow based on settings
@@ -861,6 +905,7 @@ const updateRadiantLyricsNowPlayingBackground = function (): void {
 	updateRadiantLyricsNowPlayingBackground;
 (window as any).updateRadiantLyricsTextGlow = updateRadiantLyricsTextGlow;
 (window as any).updateRadiantLyricsPlayerBarTint = updateRadiantLyricsPlayerBarTint;
+(window as any).updateQualityProgressColor = updateQualityProgressColor;
 
 const cleanUpDynamicArt = function (): void {
 	// Clean up cached Now Playing elements
@@ -1224,6 +1269,7 @@ const observeTrackChanges = (): void => {
 		if (currentTrackId && currentTrackId !== lastTrackId) {
 			lastTrackId = currentTrackId;
 			updateCoverArtBackground();
+			if (settings.qualityProgressColor) applyQualityProgressColor();
 			checkCount = 0;
 			currentInterval = 250;
 		}
@@ -1237,6 +1283,7 @@ const observeTrackChanges = (): void => {
 	if (currentTrackId) {
 		lastTrackId = currentTrackId;
 		setTimeout(() => updateCoverArtBackground(), 100);
+		if (settings.qualityProgressColor) setTimeout(() => applyQualityProgressColor(), 100);
 	}
 };
 
@@ -1289,3 +1336,4 @@ setupNowPlayingObserver();
 setupTrackTitleObserver();
 observeTrackChanges();
 setupStickyLyricsObserver();
+setupQualityProgressObserver();