Removed Cyberpunk | Spicy | Vilbrequin Theme, Info Fix, Fix Progress Bar. Centralized Ressources

This commit is contained in:
MasterAcnolo
2025-11-14 23:41:03 +01:00
parent c2e4e12512
commit cdca4a82ab
16 changed files with 805 additions and 4256 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 805 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

View File

@@ -1,6 +1,3 @@
// 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" },
@@ -9,16 +6,11 @@ const themes = {
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. Weve 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");
@@ -28,14 +20,10 @@ function populateThemeSelect() {
}
}
// 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;
@@ -43,12 +31,10 @@ function applyTheme(themeKey) {
}
// 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");

View File

@@ -18,7 +18,7 @@ form.addEventListener("submit", async (e) => {
});
if (!res.ok) {
statusDiv.textContent = "❌ Erreur pendant le téléchargement.";
statusDiv.textContent = res;
return;
}

View File

@@ -16,14 +16,27 @@ function resetProgress() {
progressWrapper.style.display = "none";
}
function resetProgressFile() {
progressBar.style.width = "0%";
// progressWrapper reste visible
}
// Connexion SSE, c'est Server-sent events est une technologie grâce à laquelle un navigateur reçoit des mises à jour automatiques à partir d'un serveur via une connexion HTTP.
const evtSource = new EventSource("/download/progress");
evtSource.onmessage = e => {
if (e.data === "reset") {
startProgress();
return;
}
if (e.data === "done") {
resetProgress();
return;
}
const percent = parseFloat(e.data);
if (!isNaN(percent)) {
updateProgress(percent);
if (percent >= 100) {
setTimeout(resetProgress, 500);
}
if (percent >= 100) setTimeout(resetProgressFile, 500);
}
};
};

View File

@@ -1,43 +0,0 @@
body.cyberpunk {
background-image: url('../../assets/images/Cyberpunk.webp');
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
/* Couleurs générales */
--background-color: #0d0d0d;
--default-text-color: #e0e0e0;
--subtitle-color: #ffea00;
--mp3-text-color: #ffea00;
/* Formulaire */
--form-bg-color: #141414;
--form-input-bg-color: #1a1a1a;
--form-input-border-color: #333333;
--form-input-border-focus-color: #ffea00;
--form-input-text-color: #e0e0e0;
--form-input-placeholder-color: #777777;
--form-button-bg-color: #ffea00;
--form-button-text-color: #0d0d0d;
--form-button-bg-hover-color: #d4c000;
/* Checkbox */
--checkbox-bg-default: #333333;
--checkbox-bg-checked: #ffea00;
--checkbox-checkmark-border-color: #0d0d0d;
--checkbox-pulse-color: rgba(255, 234, 0, 0.5);
/* Download status */
--download-status-color: #fffbd1;
/* Video Info Box */
--infos-box-color: #1a1a1a;
--video-info-text-color: #e0e0e0;
--video-info-heading-color: #ffea00;
--video-info-list-color: #cccccc;
--video-info-list-strong-color: #ffffff;
--video-info-link-color: #ffea00;
--video-info-link-hover-color: #d4c000;
}

View File

@@ -1,43 +0,0 @@
body.spicy {
background-image: url('../../assets/images/spicy.webp');
background-size:contain;
background-position: center;
background-attachment: fixed;
background-repeat: no-repeat;
/* Couleurs générales */
--background-color: #121212;
--default-text-color: #581010;
--subtitle-color: #3d0909;
--mp3-text-color: #ffffff;
/* Formulaire */
--form-bg-color: #1a1a1a;
--form-input-bg-color: #2b2b2b;
--form-input-border-color: #444444;
--form-input-border-focus-color: #ff1a1a;
--form-input-text-color: #eeeeee;
--form-input-placeholder-color: #888888;
--form-button-bg-color: #ff1a1a;
--form-button-text-color: #ffffff;
--form-button-bg-hover-color: #cc0000;
/* Checkbox */
--checkbox-bg-default: #555555;
--checkbox-bg-checked: #ff1a1a;
--checkbox-checkmark-border-color: #f5f5f5;
--checkbox-pulse-color: rgba(255, 26, 26, 0.5);
/* Download status */
--download-status-color: #ffffff;
/* Video Info Box */
--infos-box-color: #1a1a1a;
--video-info-text-color: #f5f5f5;
--video-info-heading-color: #ff1a1a;
--video-info-list-color: #cccccc;
--video-info-list-strong-color: #ffffff;
--video-info-link-color: #ff1a1a;
--video-info-link-hover-color: #cc0000;
}

View File

@@ -1,46 +0,0 @@
body.vilbrequin {
background-image: url('../../assets/images/Vilbrequin.webp');
background-size: cover;
background-position: center;
background-attachment: fixed;
/* Couleurs générales */
--background-color: #0a1f3d;
--default-text-color: #535353;
--subtitle-color: #001696;
--mp3-text-color: #ffffff;
/* Formulaire */
--form-bg-color: #12284f;
--form-input-bg-color: #1c3760;
--form-input-border-color: #2a4b80;
--form-input-border-focus-color: #00bfff;
--form-input-text-color: #f0f0f0;
--form-input-placeholder-color: #b0c4de;
--form-button-bg-color: #ffd700;
--form-button-text-color: #0a1f3d;
--form-button-bg-hover-color: #e6c200;
/* Checkbox */
--checkbox-bg-default: #2a4b80;
--checkbox-bg-checked: #00bfff;
--checkbox-checkmark-border-color: #f0f0f0;
--checkbox-pulse-color: rgba(0,191,255,0.5);
/* Download status */
--download-status-color: #ffd700;
/* Video Info Box */
--infos-box-color: #12284f;
--video-info-text-color: #f0f0f0;
--video-info-heading-color: #00bfff;
--video-info-list-color: #dcdcdc;
--video-info-list-strong-color: #ffffff;
--video-info-link-color: #00bfff;
--video-info-link-hover-color: #009acd;
}
body.vilbrequin .download-path{
color: white;
}