fix: viewer PDF (TOC, largeur) et plein ecran assistant (BUG-061 a BUG-063)

frontend/js/viewer.js

@@ -518,6 +518,25 @@ function applyPrettyHighlight(codeEl, lang, text) {
   }
 }
 
+/**
+ * Jump the inline PDF viewer to a specific page.
+ *
+ * The browser's built-in PDF viewer lives in an ``about:blank`` content window,
+ * so assigning ``contentWindow.location.hash`` never reaches the document (the
+ * TOC links used to do exactly that and did nothing). Reloading the iframe with
+ * the ``#page=N`` fragment is the supported way to target a page.
+ *
+ * @param {HTMLElement} area - Content area containing the ``.pdf-iframe``.
+ * @param {string|number} page - 1-based page number from the PDF outline.
+ */
+export function navigatePdfToPage(area, page) {
+  const iframe = area && area.querySelector('.pdf-iframe');
+  if (!iframe || page === null || page === undefined || page === '') return;
+  const base = iframe.getAttribute('data-pdf-url') || iframe.src.split('#')[0];
+  iframe.setAttribute('data-pdf-url', base);
+  iframe.src = `${base}#page=${page}`;
+}
+
 export function renderFile(data) {
   // #93 — An inline edition session (#editor-container mounted in the content
   // area) is destroyed by this very re-render: release it first so the editor
@@ -537,7 +556,7 @@ export function renderFile(data) {
       tocHtml = '<div class="pdf-toc"><h3>Table des matières</h3><ul>';
       for (const item of toc) {
         const indent = (item.level - 1) * 16;
-        tocHtml += `<li style="padding-left:${indent}px"><a href="#" onclick="document.querySelector('.pdf-iframe').contentWindow.location.hash='page=${item.page}';return false">${escapeHtml(item.title)}</a> <span class="toc-page">p.${item.page}</span></li>`;
+        tocHtml += `<li style="padding-left:${indent}px"><a href="#" data-page="${item.page}">${escapeHtml(item.title)}</a> <span class="toc-page">p.${item.page}</span></li>`;
       }
       tocHtml += '</ul></div>';
     }
@@ -555,9 +574,15 @@ export function renderFile(data) {
         </div>
         <div class="pdf-body">
           ${tocHtml}
-          <iframe src="${pdfUrl}" class="pdf-iframe" title="${escapeHtml(data.title)}"></iframe>
+          <iframe src="${pdfUrl}" data-pdf-url="${pdfUrl}" class="pdf-iframe" title="${escapeHtml(data.title)}"></iframe>
         </div>
       </div>`;
+    area.querySelectorAll('.pdf-toc a[data-page]').forEach((link) => {
+      link.addEventListener('click', (e) => {
+        e.preventDefault();
+        navigatePdfToPage(area, link.getAttribute('data-page'));
+      });
+    });
     lucide.createIcons();
     return;
   }