feat(dl): gestion des versions (latest + archive) sur la page downloads

p/assets/js/downloads.js

@@ -1,5 +1,88 @@
 document.addEventListener("DOMContentLoaded", () => {
   const cards = Array.from(document.querySelectorAll(".download-card"));
+  const currentVersionLabel = document.querySelector("[data-current-version]");
+  const archiveToggle = document.querySelector("[data-action-toggle-archive]");
+  const versionsArchive = document.querySelector("[data-versions-archive]");
+  const versionsListNode = document.querySelector("[data-versions-list]");
+  const actionAdd = document.querySelector("[data-action-add]");
+  const actionEdit = document.querySelector("[data-action-edit]");
+
+  const VERSIONS_KEY = "fws:versions";
+
+  const defaultVersions = [
+    { label: "1.0.2", url: "https://download.example.org/fws-1.0.2.iso", date: "2026-05-10" },
+    { label: "1.0.1", url: "https://download.example.org/fws-1.0.1.iso", date: "2026-03-22" },
+    { label: "0.9.8", url: "https://download.example.org/fws-0.9.8.iso", date: "2025-12-05" },
+  ];
+
+  function loadVersions() {
+    try {
+      const raw = localStorage.getItem(VERSIONS_KEY);
+      if (!raw) return defaultVersions.slice();
+      const parsed = JSON.parse(raw);
+      if (!Array.isArray(parsed) || !parsed.length) return defaultVersions.slice();
+      return parsed;
+    } catch (e) {
+      return defaultVersions.slice();
+    }
+  }
+
+  function saveVersions(list) {
+    localStorage.setItem(VERSIONS_KEY, JSON.stringify(list));
+  }
+
+  let versions = loadVersions();
+  let currentVersion = versions[0];
+
+  function renderVersionsBar() {
+    if (currentVersionLabel) {
+      currentVersionLabel.textContent = `${currentVersion.label} ${currentVersion.date ? '— ' + currentVersion.date : ''}`.trim();
+    }
+  }
+
+  function renderArchive() {
+    if (!versionsListNode) return;
+    versionsListNode.innerHTML = "";
+    versions.forEach((v, idx) => {
+      const li = document.createElement("li");
+      li.className = "version-item";
+      li.innerHTML = `
+        <strong>${v.label}</strong> <span class="version-meta">${v.date || ''}</span>
+        <div class="version-actions">
+          <a class="button" href="${v.url}" target="_blank">Télécharger</a>
+          <button class="button button-secondary copy-version" data-idx="${idx}">Copier</button>
+          <button class="button button-secondary make-latest" data-idx="${idx}">Faire dernière</button>
+          <button class="button button-secondary edit-version" data-idx="${idx}">Modifier</button>
+        </div>
+      `;
+      versionsListNode.appendChild(li);
+    });
+  }
+
+  function setCurrentToIndex(idx) {
+    const v = versions[idx];
+    if (!v) return;
+    versions.splice(idx, 1);
+    versions.unshift(v);
+    currentVersion = versions[0];
+    saveVersions(versions);
+    renderVersionsBar();
+    renderArchive();
+    applyLinksToCards();
+  }
+
+  function applyLinksToCards() {
+    cards.forEach((card) => {
+      const key = `fws:download:${card.dataset.key}`;
+      const btn = card.querySelector(".download-btn");
+      const copyBtn = card.querySelector(".copy-btn");
+      const stored = localStorage.getItem(key);
+      const finalUrl = stored || (currentVersion && currentVersion.url) || "#";
+      if (btn) btn.href = finalUrl;
+      if (btn) btn.dataset.link = finalUrl;
+      if (copyBtn) copyBtn.dataset.link = finalUrl;
+    });
+  }
 
   function toast(message) {
     const t = document.createElement("div");
@@ -37,10 +120,15 @@ document.addEventListener("DOMContentLoaded", () => {
     const stored = localStorage.getItem(key);
     if (stored) {
       setLink(stored);
+    } else {
+      // apply global current version by default
+      if (currentVersion && currentVersion.url) {
+        setLink(currentVersion.url);
+      }
     }
 
     editBtn.addEventListener("click", () => {
-      const current = localStorage.getItem(key) || "";
+      const current = localStorage.getItem(key) || (currentVersion && currentVersion.url) || "";
       const value = window.prompt("Collez l'URL de téléchargement pour ce fichier:", current);
       if (value === null) return;
       const trimmed = value.trim();
@@ -70,4 +158,87 @@ document.addEventListener("DOMContentLoaded", () => {
       }
     });
   });
+
+  // render versions UI
+  function toggleArchive() {
+    const expanded = archiveToggle.getAttribute("aria-expanded") === "true";
+    archiveToggle.setAttribute("aria-expanded", String(!expanded));
+    if (versionsArchive) versionsArchive.hidden = expanded;
+  }
+
+  if (archiveToggle) {
+    archiveToggle.addEventListener("click", () => {
+      toggleArchive();
+    });
+  }
+
+  if (actionAdd) {
+    actionAdd.addEventListener("click", () => {
+      const label = window.prompt("Nom de la version (ex: 1.0.3):", "");
+      if (!label) return;
+      const url = window.prompt("URL de téléchargement pour cette version:", "");
+      if (!url) return;
+      const date = new Date().toISOString().slice(0, 10);
+      versions.unshift({ label: label.trim(), url: url.trim(), date });
+      saveVersions(versions);
+      currentVersion = versions[0];
+      renderVersionsBar();
+      renderArchive();
+      applyLinksToCards();
+      toast("Version ajoutée");
+    });
+  }
+
+  if (actionEdit) {
+    actionEdit.addEventListener("click", () => {
+      const url = window.prompt("Nouvelle URL pour la version actuelle:", currentVersion.url || "");
+      if (url === null) return;
+      currentVersion.url = url.trim();
+      versions[0] = currentVersion;
+      saveVersions(versions);
+      renderVersionsBar();
+      applyLinksToCards();
+      toast("Version mise à jour");
+    });
+  }
+
+  // delegated events for archive list
+  if (versionsListNode) {
+    versionsListNode.addEventListener("click", (ev) => {
+      const copyBtn = ev.target.closest(".copy-version");
+      const makeBtn = ev.target.closest(".make-latest");
+      const editBtn = ev.target.closest(".edit-version");
+      if (copyBtn) {
+        const idx = Number(copyBtn.dataset.idx);
+        const v = versions[idx];
+        if (v && v.url) {
+          navigator.clipboard.writeText(v.url).then(() => toast("Lien copié"), () => window.prompt("Copiez le lien:", v.url));
+        }
+        return;
+      }
+      if (makeBtn) {
+        const idx = Number(makeBtn.dataset.idx);
+        setCurrentToIndex(idx);
+        toast("Version définie comme dernière");
+        return;
+      }
+      if (editBtn) {
+        const idx = Number(editBtn.dataset.idx);
+        const v = versions[idx];
+        if (!v) return;
+        const newUrl = window.prompt(`Nouvelle URL pour ${v.label}:`, v.url || "");
+        if (newUrl === null) return;
+        v.url = newUrl.trim();
+        versions[idx] = v;
+        saveVersions(versions);
+        renderArchive();
+        applyLinksToCards();
+        toast("Version modifiée");
+      }
+    });
+  }
+
+  renderVersionsBar();
+  renderArchive();
+  applyLinksToCards();
 });

p/assets/styles/main.css

@@ -295,6 +295,35 @@ main[data-page-content] {
   .download-media { width: 140px; flex-basis: 140px; }
 }
 
+/* Versions toolbar */
+.version-toolbar {
+  display: flex;
+  gap: 1rem;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 0.8rem;
+}
+
+.version-current { color: var(--muted); }
+
+.versions-archive {
+  margin-top: 0.8rem;
+  padding: 0.8rem;
+  border-radius: 0.6rem;
+  background: rgba(255,255,255,0.01);
+  border: 1px solid rgba(148,163,184,0.06);
+}
+
+.versions-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
+.version-item { display: flex; justify-content: space-between; align-items: center; padding: 0.4rem 0.6rem; border-radius: 0.45rem; }
+.version-meta { color: var(--muted); margin-left: 0.6rem; font-size: 0.92rem; }
+.version-actions { display: flex; gap: 0.4rem; }
+
+@media (max-width: 640px) {
+  .version-toolbar { flex-direction: column; align-items: flex-start; }
+  .version-actions { width: 100%; display: flex; gap: 0.5rem; }
+}
+
 
 .features .card {
   flex: 1 1 0;

p/dl/index.html

@@ -85,30 +85,4 @@
 
     <script src="../assets/js/downloads.js"></script>
   </body>
-</html>
-<!doctype html>
-<html lang="fr">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>DL</title>
-  </head>
-  <body>
-    <main data-page-content>
-      <section class="hero">
-        <p class="eyebrow">Route DL</p>
-        <h1>Le contenu de la section DL charge ici.</h1>
-        <p class="lead">
-          Cette page vit dans <span>p/dl/index.html</span> et son contenu est injecté dans le
-          <span>main</span> quand l'URL pointe vers <span>/?p/dl/</span>.
-        </p>
-        <div class="hero-actions">
-          <a class="button button-primary" href="/" data-route="home">Retour à l'accueil</a>
-          <a class="button button-secondary" href="/?p/dl/" data-route="dl">Recharger DL</a>
-        </div>
-      </section>
-
-
-    </main>
-  </body>
 </html>