Changeset 441f5d6 in Klonkt for src/views/shell.ejs

Timestamp:

06/17/2026 04:02:46 AM (3 months ago)

Author:

roboburr <roboburr@…>

Branches:

main

Children:

c50f22e

Parents:

125e0e1

Message:

Login navigation via htmx (audio no longer jumps when opening login)

Navigating TO the login page now goes via htmx instead of a full load → the
audio player stays alive (no jump). The login itself (form submit) deliberately
remains a full load (choice: only the navigate-to-login is smooth).

For this to work, on-auth also needed to work via htmx:

• pcmsNav now applies ALL page-classes sent along (not just the first one), and on-auth is in PAGE_CLASSES → the login focus screen gets its styling via htmx.
• body.on-auth .bottom-tab { display:none } → hide the tab from the previous page (which stays alive under htmx nav), just as clean as a full-load login.
• Login links (bottom-tab + topnav) get hx-get.

CSS cache-buster v9.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@…>

File:

• src/views/shell.ejs (modified) (3 diffs)

src/views/shell.ejs

@@ -163 +163 @@
 
 <!-- v9 stylesheet (full palette system) -->
-<link rel="stylesheet" href="/assets/css/style.css?v=8">
+<link rel="stylesheet" href="/assets/css/style.css?v=9">
 
 <!-- Audio player styles: loaded on every page so the mini-player works
@@ -325 +325 @@
 <script>
 (function() {
-  // The set of mutually-exclusive page-context body classes. When pcmsNav
-  // fires we strip ALL of these and apply just the one the server told us.
-  var PAGE_CLASSES = ['on-home','on-post','on-special','on-archive','on-search','on-admin'];
+  // De page-context body-classes. Bij pcmsNav strippen we ze allemaal en zetten
+  // we opnieuw wat de server stuurde. 'on-auth' staat erbij zodat het login-
+  // focusscherm óók via htmx z'n styling krijgt (geen chrome, geen tab, audio op 0).
+  var PAGE_CLASSES = ['on-home','on-post','on-special','on-archive','on-search','on-admin','on-auth'];
 
   document.body.addEventListener('pcmsNav', function(ev) {
@@ -348 +349 @@
     var next = d.bodyClass;
     if (!next) return;
-    // Server may send a multi-class string ("on-post extra"). Only the first
-    // page-class is what we care about — strip and replace.
-    var firstClass = String(next).split(/\s+/).find(function(c) {
+    // De server kan meerdere page-classes sturen ("on-special on-auth"). Strip
+    // alle bekende en zet ALLE meegestuurde page-classes terug (niet alleen de
+    // eerste) — anders mist 'on-auth' bij htmx-nav en blijft het login-scherm
+    // de chrome/tab van de vorige pagina houden.
+    var matched = String(next).split(/\s+/).filter(function(c) {
       return PAGE_CLASSES.indexOf(c) >= 0;
     });
-    if (!firstClass) return;
+    if (!matched.length) return;
     PAGE_CLASSES.forEach(function(c) { document.body.classList.remove(c); });
-    document.body.classList.add(firstClass);
+    matched.forEach(function(c) { document.body.classList.add(c); });
   });
 })();