feat: guide d'utilisation - couverture complete, telechargement MD/PDF, section Architecture Mermaid, guide desktop elargi (#105, BUG-067)

frontend/js/config.js

@@ -353,6 +353,7 @@ function initHelpModal() {
       initHelpNavigation();
       helpNavInitialized = true;
     }
+    renderGuideMermaid();
   });
 
   closeBtn.addEventListener("click", closeHelpModal);
@@ -367,6 +368,64 @@ function initHelpModal() {
       closeHelpModal();
     }
   });
+
+  // Guide downloads (#105) — markdown / pdf, current language.
+  const dlMd = document.getElementById("help-download-md");
+  const dlPdf = document.getElementById("help-download-pdf");
+  [dlMd, dlPdf].forEach((btn) => {
+    if (!btn) return;
+    btn.addEventListener("click", () => {
+      downloadGuide(btn.id === "help-download-md" ? "md" : "pdf");
+    });
+  });
+}
+
+// Render any Mermaid blocks inside the guide modal (the architecture diagram,
+// #105). The viewer's own pipeline only touches document views, so the help
+// modal is enriched here — once per modal open, cheap on repeats.
+function renderGuideMermaid() {
+  const modal = document.getElementById("help-modal");
+  if (!modal || modal.dataset.mermaidRendered === "1") return;
+  import("./mermaid-viewer.js")
+    .then((m) => m.renderMermaidBlocks(modal))
+    .then(() => {
+      // Only mark done when the source block actually became a rendered
+      // diagram — if the Mermaid CDN wasn't ready yet, retry on next open.
+      if (!modal.querySelector("code.language-mermaid")) {
+        modal.dataset.mermaidRendered = "1";
+      }
+    })
+    .catch(() => { /* CDN offline: keep the code block readable */ });
+}
+
+// Fetch the generated guide (auth headers + cookie) and trigger the browser
+// download, mirroring viewer.downloadExport().
+async function downloadGuide(format) {
+  showToast(t("viewer.export_start"), "info");
+  try {
+    const headers = AuthManager.getAuthHeaders ? AuthManager.getAuthHeaders() || {} : {};
+    const res = await fetch(
+      `/api/guide/download?format=${format}&lang=${encodeURIComponent(getLocale() || "fr")}`,
+      { credentials: "include", headers },
+    );
+    if (!res.ok) {
+      let detail = "";
+      try { detail = (await res.json()).detail || ""; } catch (_) { /* ignore */ }
+      throw new Error(detail || "HTTP " + res.status);
+    }
+    const blob = await res.blob();
+    const a = document.createElement("a");
+    a.href = URL.createObjectURL(blob);
+    a.download = `ObsiGate-Guide-${getLocale() || "fr"}.${format}`;
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+    setTimeout(() => URL.revokeObjectURL(a.href), 1000);
+    showToast(t("viewer.export_done"), "success");
+  } catch (err) {
+    console.error("Guide export error:", err);
+    showToast(t("viewer.export_error") + " " + err.message, "error");
+  }
 }
 
 function initEditorPocBtn() {

frontend/js/desktop.js

@@ -231,6 +231,9 @@ export async function initDesktopIntegration() {
   defineBackendCrashBanner();
   if (!isTauriEnv()) return false;
 
+  // Desktop marker for CSS (wider reading layouts, e.g. the user guide #105).
+  try { document.body.classList.add('desktop-mode'); } catch (e) { /* ignore */ }
+
   // Follow the OS theme on first run, before the theme engine renders.
   await syncSystemTheme();