From 5e62e09d6fe2a03c7fdcda63c879d8fdd1dfb7b1 Mon Sep 17 00:00:00 2001
From: tv <tv@krebsco.de>
Date: Tue, 3 Nov 2026 00:07:58 +0100
Subject: dashboard: add console clear button

---
 docs/dashboard.md                |  2 +-
 src/api/dashboard/dashboard.html | 14 +++++++++++++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/docs/dashboard.md b/docs/dashboard.md
index 9b1c9d7..d641603 100644
--- a/docs/dashboard.md
+++ b/docs/dashboard.md
@@ -241,7 +241,7 @@ clock, to the millisecond), which way (`→` sent, `←` received, `↛` refused
 transport wouldn't send it), with whom, the type (`HELLO`, `SYNC`, `STATUS_REPLY`,
 `LINKS`, …, in its kind's colour, as on the map) and the size. The latest 500, the
 newest at the bottom; scrolled along while at the bottom, which `following…` beside the
-title says. They arrive with every update
+title says. `clear` empties it; what comes from then on fills it again. They arrive with every update
 (every 2 s). The PINGs the paths layer sends on its own, and the PONGs it answers
 PINGs with, are listed too: under the node at the address they went to, where it is
 known, else under the address. Not listed: WHO and ME, which stay in the layers
diff --git a/src/api/dashboard/dashboard.html b/src/api/dashboard/dashboard.html
index 8b62181..9b23d46 100644
--- a/src/api/dashboard/dashboard.html
+++ b/src/api/dashboard/dashboard.html
@@ -94,6 +94,8 @@
   section h2 .following { font-size: 12px; text-transform: none; letter-spacing: 0;
     margin-left: 1em; font-style: italic; }
   section.collapsed h2 .following { display: none; }
+  /* A button within a title's line, where it comes (not at its end, as toggles are). */
+  section h2 button.inline { float: none; margin-left: 1em; line-height: 1em; }
   /* The right column dragged off to the side: the map takes the width. */
   @media (min-width: 901px) {
     main.right-hidden > section:not(#map) { display: none; }
@@ -277,7 +279,7 @@
   <div id="column-hint" class="note">Drag the space left of these boxes to the right to
     hide the column.</div>
   <section id="console-box">
-    <h2>Console <label class="choice" title="Only the messages with the node or over the link in focus (clicked on the map or in the peers); all while nothing is"><input type="checkbox" id="console-filter">filter selected</label><span id="console-following" class="following" title="Scrolled to the bottom: new messages are scrolled to as they come; scroll up to stop">following…</span><span id="console-rates" class="rates" title="Messages and bytes per second sent and received, as load averages are: over the last 1, 5 and 15 minutes (exponentially weighted), since the page was opened; with the filter, those with the node or over the link in focus"></span></h2>
+    <h2>Console <label class="choice" title="Only the messages with the node or over the link in focus (clicked on the map or in the peers); all while nothing is"><input type="checkbox" id="console-filter">filter selected</label><span id="console-following" class="following" title="Scrolled to the bottom: new messages are scrolled to as they come; scroll up to stop">following…</span><button id="console-clear" class="toggle inline" title="Empty this page's console: what comes from now on fills it again">clear</button><span id="console-rates" class="rates" title="Messages and bytes per second sent and received, as load averages are: over the last 1, 5 and 15 minutes (exponentially weighted), since the page was opened; with the filter, those with the node or over the link in focus"></span></h2>
     <div class="scroll" id="console-scroll"><div id="console" class="console"></div>
       <div id="console-none" class="note" hidden>No information available</div></div>
   </section>
@@ -2168,6 +2170,16 @@ function showFollowing() {
     scroll.scrollTop + scroll.clientHeight < scroll.scrollHeight - 4;
 }
 consoleScroll.addEventListener("scroll", showFollowing, { passive: true });
+// `clear`: the console emptied; it fills again with what comes from now on.
+document.getElementById("console-clear").addEventListener("click", () => {
+  consoleMessages.length = 0;
+  pointedMessage = null;
+  if (shownMessage !== null) showMessage(null);
+  markRelated(null);
+  document.getElementById("console").replaceChildren();
+  filterConsole();
+  showFollowing();
+});
 function showConsole() {
   document.getElementById("console").replaceChildren(...consoleMessages.map(consoleLine));
   filterConsole();
-- 
cgit v1.3.1