living-documentation 7.5.0 → 7.7.0

package/dist/src/frontend/accuracy-gauge.js

@@ -0,0 +1,47 @@
+// ── Accuracy gauge ──────────────────────────────────────────────────────────
+// Shown in the sticky document header (right-aligned, own row) when the
+// current document has at least one metadata entry.
+
+function accuracyColor(ratio) {
+  const pct = Math.max(0, Math.min(1, ratio)) * 100;
+  if (pct > 80) return "#16a34a"; // green-600
+  if (pct >= 60) return "#eab308"; // yellow-500
+  if (pct >= 40) return "#f97316"; // orange-500
+  return "#dc2626"; // red-600
+}
+
+function renderAccuracyGauge(report) {
+  const wrap = document.getElementById("accuracy-gauge");
+  if (!wrap) return;
+  if (!report || report.total === 0) {
+    wrap.classList.add("hidden");
+    return;
+  }
+  wrap.classList.remove("hidden");
+
+  const pct = Math.round(report.accuracy * 100);
+  const color = accuracyColor(report.accuracy);
+
+  const label = document.getElementById("accuracy-gauge-label");
+  const bar = document.getElementById("accuracy-gauge-bar");
+  const value = document.getElementById("accuracy-gauge-value");
+
+  if (label) label.textContent = window.t("accuracy.label");
+  if (bar) {
+    bar.style.width = pct + "%";
+    bar.style.backgroundColor = color;
+  }
+  if (value) {
+    value.textContent = pct + "%";
+    value.style.color = color;
+  }
+
+  wrap.title = window
+    .t("accuracy.tooltip")
+    .replace("{unchanged}", String(report.unchanged))
+    .replace("{modified}", String(report.modified))
+    .replace("{missing}", String(report.missing))
+    .replace("{total}", String(report.total));
+}
+
+window.renderAccuracyGauge = renderAccuracyGauge;

package/dist/src/frontend/annotations.js

@@ -10,21 +10,25 @@ let stabiloDeleteTargetId = null;
 let stabiloReadPopupAnnotationId = null;
 let stabiloReadHideTimer = null;
 
-// Cycles: normal → active → hidden → normal
-function toggleMarker() {
+function applyMarkerVisualState() {
   const btn = document.getElementById("stabilo-btn");
+  if (!btn) return;
   const fills = btn.querySelectorAll("rect, polygon");
   const crossEl = document.getElementById("stabilo-cross");
 
-  if (!stabiloActive && !stabiloHidden) {
-    // normal → active
-    stabiloActive = true;
-    btn.classList.remove(
-      "border-gray-200",
-      "dark:border-gray-700",
-      "text-gray-600",
-      "dark:text-gray-400",
-    );
+  btn.classList.remove(
+    "border-gray-200",
+    "dark:border-gray-700",
+    "text-gray-600",
+    "dark:text-gray-400",
+    "border-yellow-400",
+    "bg-yellow-100",
+    "dark:bg-yellow-900/40",
+    "text-yellow-700",
+    "dark:text-yellow-300",
+  );
+
+  if (stabiloActive) {
     btn.classList.add(
       "border-yellow-400",
       "bg-yellow-100",
@@ -39,17 +43,7 @@ function toggleMarker() {
       ),
     );
     crossEl.style.display = "none";
-  } else if (stabiloActive) {
-    // active → hidden
-    stabiloActive = false;
-    stabiloHidden = true;
-    btn.classList.remove(
-      "border-yellow-400",
-      "bg-yellow-100",
-      "dark:bg-yellow-900/40",
-      "text-yellow-700",
-      "dark:text-yellow-300",
-    );
+  } else {
     btn.classList.add(
       "border-gray-200",
       "dark:border-gray-700",
@@ -66,14 +60,55 @@ function toggleMarker() {
             : "#bfdbfe",
       ),
     );
-    crossEl.style.display = "block";
-    closeMarkerPopup();
-    setHighlightsVisible(false);
+    crossEl.style.display = stabiloHidden ? "block" : "none";
+  }
+}
+
+function persistMarkerState() {
+  const state = stabiloActive ? "active" : stabiloHidden ? "hidden" : "normal";
+  try {
+    localStorage.setItem("ld-marker-state", state);
+  } catch {
+    /* ignore */
+  }
+}
+
+function initMarkerState() {
+  let saved = "normal";
+  try {
+    saved = localStorage.getItem("ld-marker-state") || "normal";
+  } catch {
+    /* ignore */
+  }
+  stabiloActive = saved === "active";
+  stabiloHidden = saved === "hidden";
+  applyMarkerVisualState();
+  if (stabiloHidden) setHighlightsVisible(false);
+}
+
+// Cycles: normal → active → hidden → normal
+function toggleMarker() {
+  const wasHidden = stabiloHidden;
+
+  if (!stabiloActive && !stabiloHidden) {
+    stabiloActive = true;
+  } else if (stabiloActive) {
+    stabiloActive = false;
+    stabiloHidden = true;
   } else {
-    // hidden → normal
     stabiloHidden = false;
-    crossEl.style.display = "none";
+  }
+
+  applyMarkerVisualState();
+  persistMarkerState();
+
+  if (!wasHidden && stabiloHidden) {
+    closeMarkerPopup();
+    setHighlightsVisible(false);
+    refreshSidebar();
+  } else if (wasHidden && !stabiloHidden) {
     setHighlightsVisible(true);
+    refreshSidebar();
   }
 }
 
@@ -129,6 +164,8 @@ function applyAnnotationHighlights() {
     .forEach((mark) => {
       if (!mark.textContent.trim()) mark.remove();
     });
+
+  if (stabiloHidden) setHighlightsVisible(false);
 }
 
 function highlightAnnotation(contentEl, ann) {
@@ -543,4 +580,6 @@ function renderElevator() {
 
     elevator.appendChild(pill);
   }
+
+  if (stabiloHidden) elevator.style.visibility = "hidden";
 }

package/dist/src/frontend/boot.js

@@ -13,8 +13,11 @@ document.addEventListener("DOMContentLoaded", async () => {
   wcRestorePrefs();
   if (typeof initFileAttach === "function") initFileAttach();
   await loadConfig();
+  if (typeof initMarkerState === "function") initMarkerState();
+  if (typeof initFullWidthState === "function") initFullWidthState();
   await loadDocuments();
   applyHideCategoriesButtonState();
+  applyHideAttachmentsButtonState();
 
   // Deep-link via ?doc=id, otherwise open first General doc
   const params = new URLSearchParams(location.search);

package/dist/src/frontend/documents.js

@@ -20,7 +20,10 @@ async function loadDocuments() {
     } catch {
       allFolderPaths = [];
     }
-    await refreshAnnotationCounts();
+    await Promise.all([
+      refreshAnnotationCounts(),
+      refreshFileAttachmentCounts(),
+    ]);
     renderSidebar(allDocs);
   } catch {
     document.getElementById("category-tree").innerHTML =
@@ -43,6 +46,18 @@ async function refreshAnnotationCounts() {
   }
 }
 
+async function refreshFileAttachmentCounts() {
+  try {
+    const raw = await fetch("/api/documents/file-counts").then((r) => r.json());
+    fileAttachmentCounts = {};
+    for (const [docId, n] of Object.entries(raw || {})) {
+      fileAttachmentCounts[docId] = n;
+    }
+  } catch {
+    fileAttachmentCounts = {};
+  }
+}
+
 async function openDocument(id, skipHistory = false, fromLink = false, anchor = null) {
   // Track navigation history for breadcrumb trail
   // fromLink===true  : forward navigation via in-doc link → push current to stack
@@ -149,6 +164,11 @@ async function openDocument(id, skipHistory = false, fromLink = false, anchor =
     // Load annotations for this document
     loadAnnotations(id);
 
+    // Load source-file metadata report (drives the accuracy gauge)
+    if (typeof loadMetadataReport === "function") {
+      loadMetadataReport(id);
+    }
+
     // Add IDs to headings for anchor navigation
     contentEl.querySelectorAll("h1, h2, h3, h4, h5, h6").forEach((h) => {
       if (!h.id) {
@@ -289,6 +309,7 @@ async function confirmDeleteDocument() {
   try {
     delete annotationCounts[decodeURIComponent(deletedId)];
   } catch {}
+  delete fileAttachmentCounts[deletedId];
   currentDocId = null;
 
   // Return to welcome screen
@@ -369,6 +390,12 @@ async function saveDocument() {
     applyAnnotationHighlights();
     renderElevator();
 
+    const fileLinkMatches = content.match(/\]\(\s*\.?\/files\/[^)\s]+/g);
+    const fileLinkCount = fileLinkMatches ? fileLinkMatches.length : 0;
+    if (fileLinkCount > 0) fileAttachmentCounts[currentDocId] = fileLinkCount;
+    else delete fileAttachmentCounts[currentDocId];
+    refreshSidebar();
+
     exitEditMode();
   } catch (err) {
     msgEl.textContent = window.t('error.save') + err.message;

package/dist/src/frontend/i18n/en.json

@@ -21,6 +21,7 @@
   "nav.toggle_dark": "Toggle dark mode",
   "nav.export": "Export",
   "nav.toggle_categories": "Show/hide category grouping",
+  "nav.toggle_attachments": "Show/hide attachments",
   "nav.export_html": "Export folders as HTML ZIP",
   "nav.export_all_pdf": "Export all documents as PDF",
   "nav.new_folder": "New folder",
@@ -37,6 +38,8 @@
   "sidebar.no_docs": "No documents found.",
   "sidebar.annotation_badge": "annotation",
   "sidebar.annotated_docs_badge": "document with annotations",
+  "sidebar.file_attachment_badge": "attachment",
+  "sidebar.file_attached_docs_badge": "document with attachments",
 
   "doc.marker_mode": "Marker mode — highlight to annotate",
   "doc.marker_btn": "Marker",
@@ -66,6 +69,20 @@
   "doc.failed_to_load": "Failed to load document: ",
   "doc.copied": "✓ Copied!",
 
+  "metadata.button": "Metadata",
+  "metadata.button_title": "Manage source-file metadata",
+  "metadata.title": "Source metadata",
+  "metadata.subtitle": "Attach source files to track whether this document is still accurate.",
+  "metadata.add": "Add source file",
+  "metadata.refresh": "Refresh hashes",
+  "metadata.remove": "Remove",
+  "metadata.empty": "No metadata yet — add a source file to start tracking accuracy.",
+  "metadata.status.unchanged": "Unchanged",
+  "metadata.status.modified": "Modified",
+  "metadata.status.missing": "Missing",
+  "accuracy.label": "Accuracy",
+  "accuracy.tooltip": "Unchanged: {unchanged} · Modified: {modified} · Missing: {missing} · Total: {total}",
+
   "modal.new_folder.title": "New folder",
   "modal.new_folder.name_label": "Folder name",
   "modal.new_folder.name_placeholder": "my-folder",
@@ -78,6 +95,7 @@
   "modal.new_folder.creating_btn": "Creating…",
   "modal.new_folder.error_empty": "Please enter a folder name.",
   "modal.new_folder.error_invalid_chars": "Invalid characters in folder name.",
+  "modal.new_folder.error_reserved": "\"files\" and \"images\" are reserved folder names at the docs root.",
   "modal.new_folder.no_subfolders": "No subfolders",
   "modal.new_folder.error_loading": "Error loading",
 

package/dist/src/frontend/i18n/fr.json

@@ -21,6 +21,7 @@
   "nav.toggle_dark": "Basculer le mode sombre",
   "nav.export": "Exporter",
   "nav.toggle_categories": "Afficher/masquer le regroupement par catégorie",
+  "nav.toggle_attachments": "Afficher/masquer les pièces jointes",
   "nav.export_html": "Exporter les dossiers en HTML (ZIP)",
   "nav.export_all_pdf": "Exporter tous les documents en PDF",
   "nav.new_folder": "Nouveau dossier",
@@ -37,6 +38,8 @@
   "sidebar.no_docs": "Aucun document trouvé.",
   "sidebar.annotation_badge": "annotation",
   "sidebar.annotated_docs_badge": "document contenant des annotations",
+  "sidebar.file_attachment_badge": "pièce jointe",
+  "sidebar.file_attached_docs_badge": "document contenant des pièces jointes",
 
   "doc.marker_mode": "Mode Marqueur — surligner pour annoter",
   "doc.marker_btn": "Marqueur",
@@ -66,6 +69,20 @@
   "doc.failed_to_load": "Impossible de charger le document : ",
   "doc.copied": "✓ Copié !",
 
+  "metadata.button": "Métadonnées",
+  "metadata.button_title": "Gérer les métadonnées des fichiers source",
+  "metadata.title": "Métadonnées des sources",
+  "metadata.subtitle": "Rattachez des fichiers source pour suivre si ce document reste à jour.",
+  "metadata.add": "Ajouter un fichier source",
+  "metadata.refresh": "Rafraîchir les hashs",
+  "metadata.remove": "Retirer",
+  "metadata.empty": "Aucune métadonnée — ajoutez un fichier source pour commencer à suivre la justesse.",
+  "metadata.status.unchanged": "Inchangé",
+  "metadata.status.modified": "Modifié",
+  "metadata.status.missing": "Manquant",
+  "accuracy.label": "Justesse",
+  "accuracy.tooltip": "Inchangés : {unchanged} · Modifiés : {modified} · Manquants : {missing} · Total : {total}",
+
   "modal.new_folder.title": "Nouveau dossier",
   "modal.new_folder.name_label": "Nom du dossier",
   "modal.new_folder.name_placeholder": "mon-dossier",
@@ -78,6 +95,7 @@
   "modal.new_folder.creating_btn": "Création…",
   "modal.new_folder.error_empty": "Veuillez saisir un nom de dossier.",
   "modal.new_folder.error_invalid_chars": "Caractères non autorisés dans le nom du dossier.",
+  "modal.new_folder.error_reserved": "\"files\" et \"images\" sont des noms de dossiers réservés à la racine des documents.",
   "modal.new_folder.no_subfolders": "Aucun sous-dossier",
   "modal.new_folder.error_loading": "Erreur de chargement",
 

package/dist/src/frontend/index.html

@@ -47,6 +47,8 @@
     <script defer src="/misc.js"></script>
     <script defer src="/snippets.js"></script>
     <script defer src="/annotations.js"></script>
+    <script defer src="/metadata.js"></script>
+    <script defer src="/accuracy-gauge.js"></script>
     <script defer src="/export.js"></script>
     <script defer src="/diagram-link-modal.js"></script>
     <script defer src="/new-folder-modal.js"></script>
@@ -347,6 +349,15 @@
                 class="text-xs text-gray-400 dark:text-gray-500"
               ></p>
               <div class="flex items-center gap-2">
+                <button
+                  id="toggle-attachments-btn"
+                  onclick="toggleHideAttachments()"
+                  data-i18n-title="nav.toggle_attachments"
+                  title="Toggle attachments"
+                  class="text-gray-400 hover:text-blue-500 dark:text-gray-500 dark:hover:text-blue-400 transition-colors leading-none"
+                >
+                  <i class="fa-solid fa-paperclip"></i>
+                </button>
                 <button
                   id="toggle-categories-btn"
                   onclick="toggleHideCategories()"
@@ -564,6 +575,15 @@
                     >
                       <i class="fa-solid fa-link"></i> <span data-i18n="doc.copy_link_btn">Copy link</span>
                     </button>
+                    <button
+                      onclick="openMetadataModal()"
+                      id="metadata-btn"
+                      data-i18n-title="metadata.button_title"
+                      title="Manage source-file metadata"
+                      class="no-print text-sm px-3 py-1.5 rounded-lg border border-gray-200 dark:border-gray-700 text-gray-600 dark:text-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"
+                    >
+                      <i class="fa-solid fa-code-compare"></i> <span data-i18n="metadata.button">Metadata</span>
+                    </button>
                     <button
                       onclick="enterEditMode()"
                       data-i18n-title="doc.edit"
@@ -611,6 +631,33 @@
                   </div>
                 </div>
               </div>
+              <!-- Accuracy gauge (shown when the current doc has metadata entries) -->
+              <div
+                id="accuracy-gauge"
+                onclick="openMetadataModal()"
+                class="hidden no-print mt-3 flex items-center gap-3 ml-auto w-full sm:w-80 cursor-pointer select-none"
+              >
+                <span
+                  id="accuracy-gauge-label"
+                  data-i18n="accuracy.label"
+                  class="text-xs text-gray-500 dark:text-gray-400 shrink-0"
+                >Accuracy</span>
+                <div
+                  class="flex-1 h-2 rounded-full bg-gray-200 dark:bg-gray-700 overflow-hidden"
+                >
+                  <div
+                    id="accuracy-gauge-bar"
+                    class="h-full transition-all"
+                    style="width: 0%; background-color: #9ca3af"
+                  ></div>
+                </div>
+                <span
+                  id="accuracy-gauge-value"
+                  class="text-xs font-semibold shrink-0 tabular-nums"
+                  style="color: #9ca3af"
+                >0%</span>
+              </div>
+
               <!-- Navigation history back-links -->
               <div
                 id="doc-back"
@@ -651,6 +698,116 @@
     </div>
     <!-- end root -->
 
+    <!-- ── Metadata modal ── -->
+    <div
+      id="metadata-modal"
+      class="hidden fixed inset-0 z-50 flex items-center justify-center bg-black/50"
+    >
+      <div
+        class="bg-white dark:bg-gray-900 rounded-xl shadow-xl w-full max-w-2xl mx-4 p-6 space-y-4"
+      >
+        <div class="flex items-start justify-between gap-4">
+          <div>
+            <h3 class="text-base font-semibold text-gray-900 dark:text-gray-50">
+              <i class="fa-solid fa-code-compare mr-1"></i>
+              <span data-i18n="metadata.title">Source metadata</span>
+            </h3>
+            <p
+              data-i18n="metadata.subtitle"
+              class="text-xs text-gray-500 dark:text-gray-400 mt-1"
+            >
+              Attach source files to track whether this document is still accurate.
+            </p>
+          </div>
+          <button
+            onclick="closeMetadataModal()"
+            data-i18n-title="common.close"
+            title="Close"
+            class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-200 transition-colors"
+          >
+            <i class="fa-solid fa-xmark text-lg"></i>
+          </button>
+        </div>
+
+        <!-- Summary -->
+        <div
+          id="metadata-summary"
+          class="text-xs text-gray-600 dark:text-gray-300 bg-gray-50 dark:bg-gray-800 rounded-lg px-3 py-2"
+        ></div>
+
+        <!-- List -->
+        <div class="border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden">
+          <div
+            id="metadata-list"
+            class="max-h-64 overflow-y-auto"
+          ></div>
+          <div
+            id="metadata-empty"
+            data-i18n="metadata.empty"
+            class="hidden px-3 py-4 text-center text-xs text-gray-400"
+          >
+            No metadata yet — add a source file to start tracking accuracy.
+          </div>
+        </div>
+
+        <!-- Actions -->
+        <div class="flex items-center gap-2 flex-wrap">
+          <button
+            onclick="metadataToggleBrowser()"
+            class="text-sm px-3 py-1.5 rounded-lg border border-blue-200 dark:border-blue-700 text-blue-600 dark:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/30 transition-colors"
+          >
+            <i class="fa-solid fa-plus"></i> <span data-i18n="metadata.add">Add source file</span>
+          </button>
+          <button
+            onclick="metadataRefresh()"
+            id="metadata-refresh-btn"
+            class="text-sm px-3 py-1.5 rounded-lg border border-gray-200 dark:border-gray-700 text-gray-600 dark:text-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"
+          >
+            <i class="fa-solid fa-arrows-rotate"></i> <span data-i18n="metadata.refresh">Refresh hashes</span>
+          </button>
+        </div>
+
+        <!-- Source browser -->
+        <div
+          id="metadata-browser"
+          class="hidden border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden text-sm"
+        >
+          <div
+            class="flex items-center gap-2 px-3 py-2 bg-gray-50 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700"
+          >
+            <button
+              id="metadata-browse-up"
+              onclick="metadataBrowseUp()"
+              data-i18n="common.up"
+              class="text-xs text-blue-600 dark:text-blue-400 hover:underline disabled:opacity-30 disabled:pointer-events-none shrink-0"
+            >
+              ↑ Up
+            </button>
+            <span
+              id="metadata-browse-path"
+              class="text-xs text-gray-500 dark:text-gray-400 font-mono truncate flex-1"
+            ></span>
+          </div>
+          <div
+            id="metadata-browse-list"
+            class="max-h-56 overflow-y-auto divide-y divide-gray-100 dark:divide-gray-800"
+          ></div>
+        </div>
+
+        <p id="metadata-error" class="hidden text-xs text-red-500"></p>
+
+        <div class="flex justify-end">
+          <button
+            onclick="closeMetadataModal()"
+            data-i18n="common.close"
+            class="text-sm px-4 py-2 rounded-lg border border-gray-200 dark:border-gray-700 text-gray-600 dark:text-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"
+          >
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+
     <!-- ── New Folder modal ── -->
     <div
       id="new-folder-modal"