source: Klonkt/src/views/partials/chrome.ejs@ 3cd1aaa

main
Last change on this file since 3cd1aaa was 3cd1aaa, checked in by roboburr <roboburr@…>, 3 months ago

Hub: chrome in #pcms-chrome slot + out-of-band swap on htmx → header always correct, audio never jumps

The site chrome (topnav/profile header/view-switcher) now lives in a fixed
slot #pcms-chrome. On every htmx partial, render.js renders that chrome
out-of-band (chrome.ejs with oob=true) so htmx replaces it with the chrome
of the NEW page/artist — while the audio player (separate in document.body)
stays alive. Result: hub-home has no header (hero=header, empty slot), each
artist gets its own header (no stale "Studio Noord on Luna"), and music
never jumps on navigation. Solo/circle: chrome refreshes identically (no-op
in terms of content).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@…>
  • Property mode set to 100644
File size: 1.1 KB
RevLine 
[3cd1aaa]1<%
2// Site-chrome (topnav + profielkop + view-switcher) in één vaste slot #pcms-chrome.
3//
4// Waarom een slot: bij htmx-navigatie verversen we deze hele chrome out-of-band
5// (oob=true), zodat de kop ALTIJD bij de nieuwe pagina/artiest hoort — terwijl de
6// audioplayer (los in document.body, buiten dit slot) blijft leven → geen
7// verspringen. Op de hub-landing (bareChrome) is het slot leeg: hero = de header.
8//
9// Wordt zowel door shell.ejs (oob niet gezet) als door render.js bij partials
10// (oob=true) gerenderd. bareChrome-logica staat hier zodat beide identiek zijn.
11var _isAdmin = typeof bodyClass === 'string' && bodyClass.indexOf('on-admin') >= 0;
12var bareChrome = (typeof bodyClass === 'string' && (bodyClass.indexOf('on-hub') >= 0 || bodyClass.indexOf('on-auth') >= 0))
13 || ((typeof tenancy !== 'undefined' && tenancy === 'hub') && !siteUrlBase && !_isAdmin);
14%>
15<div id="pcms-chrome"<% if (typeof oob !== 'undefined' && oob) { %> hx-swap-oob="true"<% } %>>
16<% if (!bareChrome) { %>
17 <%- include('topnav') %>
18 <%- include('profile-header') %>
19 <% if (!_isAdmin) { %><%- include('view-switcher') %><% } %>
20<% } %>
21</div>
Note: See TracBrowser for help on using the repository browser.