From 3594e78d4ad782f9dcbff2ab3851e1c491025429 Mon Sep 17 00:00:00 2001
From: karim <karim@gabrielevarano.ch>
Date: Sun, 31 May 2026 14:25:55 +0200
Subject: [PATCH] =?UTF-8?q?dialog:=20Wortmeldungs-Z=C3=A4hler=20am=20?=
 =?UTF-8?q?=E2=80=9E=E2=86=92=20Dialog"-Link=20+=20Live=20via=20Polling=20?=
 =?UTF-8?q?(10s)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Artikel-Link zeigt „→ Dialog · N" wenn Wortmeldungen existieren
- Widget lädt alle 10s nach, rendert nur bei Änderung neu (kein Flackern),
  pausiert im Hintergrund-Tab. Echtes Supabase-Realtime bleibt optional.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 layouts/_default/single.html | 11 ++++++++++-
 static/dialog.js             |  9 +++++++--
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 58a200f..0744229 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -64,7 +64,16 @@
     {{- end }}
 
     {{/* Dialog liegt auf eigener Seite — der Beitrag bleibt sauber */}}
-    <a class="dialog-link" href="/dialog/?thread={{ .RelPermalink }}">→ Dialog</a>
+    <a class="dialog-link" id="dialog-link" data-thread="{{ .RelPermalink }}" href="/dialog/?thread={{ .RelPermalink }}">→ Dialog</a>
+    <script>
+      (function () {
+        var l = document.getElementById('dialog-link'); if (!l) return;
+        fetch('/api/comments?thread=' + encodeURIComponent(l.dataset.thread))
+          .then(function (r) { return r.ok ? r.json() : []; })
+          .then(function (d) { var n = d.filter(function (c) { return !c.deleted; }).length; if (n) l.textContent = '→ Dialog · ' + n; })
+          .catch(function () {});
+      })();
+    </script>
   </article>
 
 {{ end }}
diff --git a/static/dialog.js b/static/dialog.js
index 495862b..b67b4ba 100644
--- a/static/dialog.js
+++ b/static/dialog.js
@@ -49,13 +49,16 @@
     return d.toLocaleDateString('de-CH');
   }
 
+  let lastSig = '';
   async function load() {
     let data = [];
     try {
       const res = await fetch('/api/comments?thread=' + encodeURIComponent(thread));
       if (res.ok) data = await res.json();
-    } catch { /* offline */ }
-    render(data);
+    } catch { return; /* offline: alte Ansicht behalten */ }
+    // Nur neu rendern, wenn sich wirklich etwas geändert hat (kein Flackern).
+    const sig = (token ? 'in:' : 'out:') + data.map((c) => c.id + (c.deleted ? 'd' : '')).join(',');
+    if (sig !== lastSig) { lastSig = sig; render(data); }
   }
 
   function render(data) {
@@ -161,4 +164,6 @@
 
   renderComposer();
   load();
+  // Live genug: alle 10 s nachladen (pausiert, wenn der Tab im Hintergrund ist).
+  setInterval(() => { if (!document.hidden) load(); }, 10000);
 })();