mirror of
https://github.com/MasterAcnolo/Freedom-Loader.git
synced 2026-07-29 18:25:47 +02:00
75 lines
2.6 KiB
JavaScript
75 lines
2.6 KiB
JavaScript
|
||
// Définition des thèmes disponibles
|
||
// Chaque thème a un label (affiché dans le select) et un subtitle (texte sous le titre)
|
||
const themes = {
|
||
default: { label: "Default", subtitle: "Because why not?" },
|
||
dark: { label: "Sombre", subtitle: "Darkness is my ally" },
|
||
light: { label: "Clair", subtitle: "Qui aime ce thème ?" },
|
||
neon: { label: "Néon", subtitle: "How was your day ?"},
|
||
nf: { label: "NF", subtitle: "You call it music, i call it my Therapist" },
|
||
drift: { label: "Drift", subtitle: "Si la route t'appelle, contre appel" },
|
||
fanatic: { label: "Fanatic", subtitle: "Always Fnatic !" },
|
||
cyberpunk: { label: "Cyberpunk", subtitle: "Wake up, choom. We’ve got a city to burn." },
|
||
chirac: { label: "Chirac", subtitle: "J'aime les pommes" },
|
||
spicy: { label: "Spicy", subtitle: "The Spiciest One" },
|
||
vilbrequin: { label: "Vilbrequin", subtitle: "Rend l'argent" }
|
||
};
|
||
|
||
|
||
const themeSelect = document.getElementById("themeSelect");
|
||
|
||
// Remplir le select avec les options à partir du dictionnaire
|
||
function populateThemeSelect() {
|
||
for (const [themeKey, themeInfo] of Object.entries(themes)) {
|
||
const option = document.createElement("option");
|
||
option.value = themeKey;
|
||
option.textContent = themeInfo.label;
|
||
themeSelect.appendChild(option);
|
||
}
|
||
}
|
||
|
||
// Appliquer un thème sur le body et mettre à jour le subtitle
|
||
function applyTheme(themeKey) {
|
||
// Supprimer les classes de tous les thèmes
|
||
document.body.classList.remove(...Object.keys(themes));
|
||
// Ajouter la classe correspondant au thème sélectionné
|
||
document.body.classList.add(themeKey);
|
||
|
||
// Mettre à jour le subtitle
|
||
const subtitleElement = document.getElementById("subtitle");
|
||
if (subtitleElement && themes[themeKey]) {
|
||
subtitleElement.textContent = themes[themeKey].subtitle;
|
||
}
|
||
|
||
}
|
||
|
||
// Sauvegarder le thème choisi dans le navigateur
|
||
function saveTheme(themeKey) {
|
||
localStorage.setItem("selectedTheme", themeKey);
|
||
}
|
||
|
||
// Charger le thème sauvegardé au démarrage
|
||
function loadTheme() {
|
||
const savedTheme = localStorage.getItem("selectedTheme");
|
||
|
||
if (savedTheme && themes[savedTheme]) {
|
||
applyTheme(savedTheme);
|
||
themeSelect.value = savedTheme;
|
||
} else {
|
||
applyTheme("dark"); // thème par défaut
|
||
themeSelect.value = "dark";
|
||
}
|
||
}
|
||
|
||
// Quand l'utilisateur change le thème depuis le select
|
||
themeSelect.addEventListener("change", (event) => {
|
||
const selectedTheme = event.target.value;
|
||
if (themes[selectedTheme]) {
|
||
applyTheme(selectedTheme);
|
||
saveTheme(selectedTheme);
|
||
}
|
||
});
|
||
|
||
// Initialisation
|
||
populateThemeSelect();
|
||
loadTheme(); |