diff --git a/plugins/oled-theme-luna/src/Settings.tsx b/plugins/oled-theme-luna/src/Settings.tsx new file mode 100644 index 0000000..e0a7bee --- /dev/null +++ b/plugins/oled-theme-luna/src/Settings.tsx @@ -0,0 +1,29 @@ +import { ReactiveStore } from "@luna/core"; +import { LunaSettings, LunaSwitchSetting } from "@luna/ui"; +import React from "react"; + +export const settings = await ReactiveStore.getPluginStorage("OLEDTheme", { + qualityColorMatchedSeekBar: true, +}); + +export const Settings = () => { + const [qualityColorMatchedSeekBar, setQualityColorMatchedSeekBar] = React.useState(settings.qualityColorMatchedSeekBar); + + return ( + + { + console.log("Quality Color Matched Seek Bar:", checked ? "enabled" : "disabled"); + setQualityColorMatchedSeekBar((settings.qualityColorMatchedSeekBar = checked)); + // Update styles immediately when setting changes + if ((window as any).updateOLEDThemeStyles) { + (window as any).updateOLEDThemeStyles(); + } + }} + /> + + ); +}; \ No newline at end of file diff --git a/plugins/oled-theme-luna/src/index.ts b/plugins/oled-theme-luna/src/index.ts index 9c3573b..4dd6738 100644 --- a/plugins/oled-theme-luna/src/index.ts +++ b/plugins/oled-theme-luna/src/index.ts @@ -1,6 +1,8 @@ import { LunaUnload, Tracer, ftch } from "@luna/core"; +import { settings, Settings } from "./Settings"; export const { trace } = Tracer("[OLED Theme]"); +export { Settings }; const themeUrl = "https://raw.githubusercontent.com/ItzzExcel/neptune-projects/refs/heads/main/themes/black-neptune-theme.css"; @@ -8,23 +10,51 @@ const themeUrl = "https://raw.githubusercontent.com/ItzzExcel/neptune-projects/r // clean up resources export const unloads = new Set(); +let originalStyle: string | null = null; +let appliedStyleElement: HTMLStyleElement | null = null; + +// Function to apply theme styles based on current settings +const applyThemeStyles = function(): void { + if (!originalStyle) return; + + // Remove existing style element if it exists + if (appliedStyleElement && appliedStyleElement.parentNode) { + appliedStyleElement.parentNode.removeChild(appliedStyleElement); + } + + let modifiedStyle = originalStyle; + + // Remove SeekBar coloring if Quality Color Matched Seek Bar is enabled + if (settings.qualityColorMatchedSeekBar) { + modifiedStyle = originalStyle.replace(/\[class\^="_progressBarWrapper"\]\s*\{[^}]*\}/g, ''); + trace.msg.log("OLED theme applied with SeekBar coloring removed"); + } else { + trace.msg.log("OLED theme applied with original SeekBar coloring"); + } + + appliedStyleElement = document.createElement("style"); + appliedStyleElement.type = "text/css"; + appliedStyleElement.textContent = modifiedStyle; + document.head.appendChild(appliedStyleElement); +}; + +// Make this function available globally so Settings can call it +(window as any).updateOLEDThemeStyles = applyThemeStyles; + // Added Top-level async since Luna plugins are modules <3 -const style = await ftch.text(themeUrl).catch((error: Error) => { +originalStyle = await ftch.text(themeUrl).catch((error: Error) => { trace.msg.err(`Failed to fetch theme CSS: ${error.message}`); return null; }); // Apply the OLED theme if CSS was fetched successfully -if (style) { - const styleElement = document.createElement("style"); - styleElement.type = "text/css"; - styleElement.textContent = style; - document.head.appendChild(styleElement); +if (originalStyle) { + applyThemeStyles(); // Add cleanup to unloads unloads.add(() => { - if (styleElement.parentNode) { - styleElement.parentNode.removeChild(styleElement); + if (appliedStyleElement && appliedStyleElement.parentNode) { + appliedStyleElement.parentNode.removeChild(appliedStyleElement); } }); } \ No newline at end of file