Index: src/assets/js/mod/chrome.js
===================================================================
--- src/assets/js/mod/chrome.js (revision 86cfa1a2d9b65efe6ad3db8bd0411bedd61b0f82)
+++ src/assets/js/mod/chrome.js (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
@@ -119,7 +119,26 @@
try { localStorage.setItem('pcms-theme', next); } catch (e) {}
}
+ // ── Het zoeken: de balk bovenaan, het vak met resultaten eronder ─────
+ // Twee plekken, één vorm (Robins ontwerp, 30-9): de overlay die op elke
+ // pagina kan openen, en de pagina /search?q=... zelf. Alles hieronder werkt
+ // op elk .search-surface, zodat de twee zich ook hetzelfde gedragen.
function overlay() { return document.getElementById('search-overlay'); }
- function openSearch() { var o = overlay(); if (o) { o.hidden = false; var i = o.querySelector('input'); if (i) i.focus(); } }
- function closeSearch() { var o = overlay(); if (o) { o.hidden = true; var b = document.getElementById('search-suggest'); if (b) b.innerHTML = ''; } }
+ function openSearch() {
+ var o = overlay(); if (!o) return;
+ var inp = o.querySelector('input[name="q"]');
+ var box = o.querySelector('.search-box-inner');
+ // Een verse start: tekst en resultaten van de vorige keer horen niet te
+ // blijven staan als je hem opnieuw opent.
+ if (inp) inp.value = '';
+ if (box) box.innerHTML = '';
+ o.hidden = false;
+ document.documentElement.classList.add('search-open');
+ if (inp) inp.focus();
+ }
+ function closeSearch() {
+ var o = overlay(); if (!o) return;
+ o.hidden = true;
+ document.documentElement.classList.remove('search-open');
+ }
document.body.addEventListener('click', function(e) {
@@ -137,84 +156,74 @@
});
- // ── Live results while typing ───────────────────────────────────
- // De teksten komen van de overlay zelf, elke keer opnieuw: bij een
- // htmx-navigatie wordt die vervangen en kan de taal gewisseld zijn.
- function _st() {
- var o = document.getElementById('search-overlay');
- try { return JSON.parse((o && o.getAttribute('data-i18n')) || '{}'); } catch (e) { return {}; }
- }
function esc(s) { return String(s == null ? '' : s).replace(/[&<>"]/g, function(c){ return {'&':'&','<':'<','>':'>','"':'"'}[c]; }); }
- function renderSuggest(box, d, q, ov) {
- var html = '';
- function grp(title, items, fmt) {
- if (!items || !items.length) return;
- html += '
'; return; }
- var action = (ov && ov.getAttribute('data-action')) || '/search';
- html += '' + esc(_st().all) + '';
- box.innerHTML = html;
- }
- // Een ADRES is geen zoekterm (shaer-utpi). Dezelfde regel als lookupUri in
- // routes/search.js: een schema is verplicht, anders wordt zoeken naar
- // "soundfabrics.nl" een netwerkverzoek. De server beslist daarna nog eens,
- // met de rechten erbij; dit scheelt alleen een vraag die toch nee oplevert.
- function lookupUri(q) {
- if (!/^https?:\/\//i.test(q) || /\s/.test(q)) return null;
- try { var u = new URL(q); return u.hostname.indexOf('.') < 0 ? null : u.href; } catch (e) { return null; }
- }
- function allLink(ov, q) {
- var action = (ov && ov.getAttribute('data-action')) || '/search';
- return '' + esc(_st().all) + '';
- }
- function fetchSuggest(box, q, ov, seq) {
- var url = (ov && ov.getAttribute('data-suggest')) || '/search/suggest';
- fetch(url + '?q=' + encodeURIComponent(q))
- .then(function(r){ return r.ok ? r.json() : null; })
- .then(function(d){ if (d && seq === _sSeq) renderSuggest(box, d, q, ov); })
- .catch(function(){});
- }
- // Elke toetsaanslag krijgt een volgnummer. Een ophaling van een andere
- // server duurt soms seconden; zonder nummer overschrijft een traag antwoord
- // op een oude vraag wat je inmiddels hebt getypt.
- var _sTimer, _sSeq = 0;
+ function texts(surface) { try { return JSON.parse(surface.getAttribute('data-i18n') || '{}'); } catch (e) { return {}; } }
+
+ // Iets dat van een andere server moet komen: een adres of een handle. Dezelfde
+ // regels als lookupUri en lookupHandle in routes/search.js. Hier alleen om te
+ // weten of er meteen een wachtregel moet staan: de server beslist daarna
+ // zelf, met de rechten erbij.
+ function isRemoteLookup(q) {
+ if (/^https?:\/\//i.test(q) && !/\s/.test(q)) {
+ try { return new URL(q).hostname.indexOf('.') >= 0; } catch (e) { return false; }
+ }
+ return /^@?[a-z0-9_.-]+@[a-z0-9-]+(\.[a-z0-9-]+)*\.[a-z]{2,}$/i.test(q);
+ }
+
+ // Elke zoekopdracht krijgt een volgnummer per vlak. Een ophaling van een
+ // andere server duurt soms seconden; zonder nummer overschrijft een traag
+ // antwoord op een oude vraag wat je inmiddels hebt getypt.
+ function runSearch(surface, now) {
+ if (!surface) return;
+ var inp = surface.querySelector('input[name="q"]');
+ var box = surface.querySelector('.search-box-inner');
+ if (!inp || !box) return;
+ var q = inp.value.trim();
+ var seq = (surface.__seq = (surface.__seq || 0) + 1);
+ clearTimeout(surface.__timer);
+ if (q.length < 2) { box.innerHTML = ''; return; }
+ var remote = isRemoteLookup(q);
+ if (remote) box.innerHTML = '
' + esc(texts(surface).looking) + '
';
+ // Op de pagina beweegt het adres mee, zodat wat je ziet te delen blijft.
+ if (surface.classList.contains('is-page') && history.replaceState) {
+ history.replaceState(history.state, '', (surface.getAttribute('data-action') || '/search') + '?q=' + encodeURIComponent(q));
+ }
+ surface.__timer = setTimeout(function() {
+ var url = surface.getAttribute('data-results') || '/search/results';
+ fetch(url + '?q=' + encodeURIComponent(q), { credentials: 'same-origin', headers: { 'X-Requested-With': 'fetch' } })
+ .then(function(r) { return r.status === 200 ? r.text() : ''; })
+ .then(function(html) {
+ if (seq !== surface.__seq) return;
+ box.innerHTML = html;
+ // De links naar een post zijn htmx-links; wat via innerHTML binnenkomt
+ // kent htmx nog niet.
+ if (window.htmx && window.htmx.process) window.htmx.process(box);
+ })
+ .catch(function() {});
+ }, now ? 0 : (remote ? 300 : 200));
+ }
document.addEventListener('input', function(e) {
- var inp = e.target.closest && e.target.closest('#search-overlay input[name="q"]');
- if (!inp) return;
- var box = document.getElementById('search-suggest');
- if (!box) return;
- var q = inp.value.trim();
- var seq = ++_sSeq;
- clearTimeout(_sTimer);
- if (q.length < 2) { box.innerHTML = ''; return; }
- var ov = document.getElementById('search-overlay');
- var address = lookupUri(q);
- if (!address) { _sTimer = setTimeout(function() { fetchSuggest(box, q, ov, seq); }, 200); return; }
- // Een geplakt adres: de post zelf, niet de tekst van de link doorzocht.
- box.innerHTML = '
' + esc(_st().looking) + '
';
- _sTimer = setTimeout(function() {
- var url = (ov && ov.getAttribute('data-remote')) || '/search/remote';
- fetch(url + '?q=' + encodeURIComponent(address), { credentials: 'same-origin', headers: { 'X-Requested-With': 'fetch' } })
- .then(function(r) {
- if (seq !== _sSeq) return;
- // 204: geen recht om op te halen (of toch geen adres). Dan is het
- // gewoon een zoekterm en krijg je de gewone suggesties.
- if (r.status === 204 || !r.ok) { fetchSuggest(box, q, ov, seq); return; }
- return r.text().then(function(html) { if (seq === _sSeq) box.innerHTML = html + allLink(ov, q); });
- })
- .catch(function() { if (seq === _sSeq) fetchSuggest(box, q, ov, seq); });
- }, 300);
- });
- // Een klik op een suggestie sluit de overlay, want de link gaat ergens heen.
- // Behalve wat in een nieuw tabblad opent (het origineel, een profiel): dan
- // blijf je hier, en hoort de kaart er nog te staan als je terugkomt.
+ var inp = e.target.closest && e.target.closest('.search-surface input[name="q"]');
+ if (inp) runSearch(inp.closest('.search-surface'), false);
+ });
+ // Enter blijft waar hij is: het vak IS de resultaten. Zonder JS gaat het
+ // formulier naar /search, dat er precies zo uitziet.
+ document.addEventListener('submit', function(e) {
+ var f = e.target.closest && e.target.closest('.search-bar-form');
+ if (!f) return;
+ e.preventDefault();
+ runSearch(f.closest('.search-surface'), true);
+ });
+ // Sluiten op de pagina is teruggaan, als je van deze site kwam; anders volgt
+ // de link naar het begin van de site.
document.addEventListener('click', function(e) {
- var a = e.target.closest && e.target.closest('#search-suggest a');
- if (a && a.getAttribute('target') !== '_blank') { var o = overlay(); if (o) o.hidden = true; }
+ var leave = e.target.closest && e.target.closest('[data-search-leave]');
+ if (!leave) return;
+ if (document.referrer.indexOf(location.origin + '/') === 0 && history.length > 1) { e.preventDefault(); history.back(); }
+ });
+ // Een klik op een resultaat in de overlay sluit hem, want de link gaat ergens
+ // heen. Behalve wat in een nieuw tabblad opent: dan blijf je hier.
+ document.addEventListener('click', function(e) {
+ var a = e.target.closest && e.target.closest('#search-overlay .search-box a');
+ if (a && a.getAttribute('target') !== '_blank') closeSearch();
});
})();
Index: src/middleware/render.js
===================================================================
--- src/middleware/render.js (revision 86cfa1a2d9b65efe6ad3db8bd0411bedd61b0f82)
+++ src/middleware/render.js (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
@@ -108,5 +108,5 @@
};
-const formatDate = (iso) => {
+export const formatDate = (iso) => {
const d = parseStamp(iso);
return d ? d.toLocaleDateString('nl-NL', { timeZone: siteTimezone(), day: 'numeric', month: 'long', year: 'numeric' }) : '';
Index: src/routes/search.js
===================================================================
--- src/routes/search.js (revision 86cfa1a2d9b65efe6ad3db8bd0411bedd61b0f82)
+++ src/routes/search.js (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
@@ -21,5 +21,5 @@
import express from 'express';
import db from '../config/database.js';
-import { renderPage } from '../middleware/render.js';
+import { renderPage, formatDate } from '../middleware/render.js';
import { audioUrl } from '../services/AudioStreamService.js';
import { getSetting } from '../services/SettingsService.js';
@@ -86,4 +86,20 @@
/**
+ * Is dit een HANDLE (@naam@server) en geen zoekterm? Dan de genormaliseerde
+ * handle, anders null.
+ *
+ * Met of zonder @ vooraan, zoals Mastodon het ook aanneemt. De server moet een
+ * echte domeinnaam zijn (met een punt en een extensie): "@robin" is een naam om
+ * naar te zoeken, geen adres. Een spatie maakt er een zoekopdracht van.
+ *
+ * WebFinger zelf is openbaar en gaat niet ondertekend; het profiel erachter
+ * wel, via resolveRemoteActor, en alleen namens een ingelogde beheerder.
+ */
+export function lookupHandle(q) {
+ const m = /^@?([a-z0-9_.-]+)@([a-z0-9-]+(?:\.[a-z0-9-]+)*\.[a-z]{2,})$/i.exec(String(q || '').trim());
+ return m ? `@${m[1]}@${m[2].toLowerCase()}` : null;
+}
+
+/**
* Mag deze bezoeker een adres laten OPHALEN?
*
@@ -114,8 +130,12 @@
* een anonieme GET, en dan lijkt een bestaande post te ontbreken.
*/
-async function lookUpRemote(remoteUri, site) {
+async function lookUpRemote(remoteUri, site, { handle = false } = {}) {
let remote = null;
let remoteKind = null;
- try { remote = await ActivityPubService.resolveRemoteNote(remoteUri, { asSlug: site.slug }); } catch { /* onbereikbaar */ }
+ // Een handle wijst altijd naar een persoon: geen post-poging, die zou alleen
+ // een verzoek kosten dat niets kan opleveren.
+ if (!handle) {
+ try { remote = await ActivityPubService.resolveRemoteNote(remoteUri, { asSlug: site.slug }); } catch { /* onbereikbaar */ }
+ }
if (remote) remoteKind = 'note';
if (!remote) {
@@ -226,63 +246,72 @@
}
-// ── Full results page ────────────────────────────────────────────────────────
-router.get('/', async (req, res) => {
- const site = res.locals.site;
- if (!site) return res.status(404).send('No site');
- const rawQ = (req.query.q || '').toString().trim();
-
- if (!rawQ) {
- return renderPage(req, res, 'pages/search', {
- pageTitle: 'Zoeken', bodyClass: 'on-special', query: '',
- results: [], tracks: [], events: [], pages: [], total: 0,
- });
- }
-
- // Een adres wordt OPGEHAALD, niet doorzocht (shaer-utpi). Eerst als post,
- // dan als profiel: een URL die geen van beide oplevert is gewoon een
- // zoekterm die toevallig op een link lijkt, en dan blijft de rest staan.
- const remoteUri = lookupUri(rawQ);
+// ── Wat er bij een zoekopdracht hoort ────────────────────────────────────────
+//
+// EEN verzameling voor beide ingangen: de pagina /search?q=... en het live vak
+// onder de zoekbalk (/search/results). Ze tonen sinds Robins ontwerp van 30-9
+// hetzelfde, dus ze horen ook hetzelfde op te halen.
+//
+// Een adres wordt OPGEHAALD, niet doorzocht (shaer-utpi). Eerst als post, dan
+// als profiel; ondertekend, en alleen namens een ingelogde beheerder.
+async function gather(req, res, rawQ) {
+ const site = res.locals.site;
+ // Een adres (https://...) of een handle (@naam@server): allebei iets dat van
+ // een andere server moet komen, dus allebei achter dezelfde rechtengrens.
+ const uri = lookupUri(rawQ);
+ const handle = uri ? null : lookupHandle(rawQ);
+ const remoteUri = uri || handle;
const mayLookup = remoteUri ? mayLookUp(req, res) : false;
const { remote, remoteKind, reacted: remoteReacted } = (remoteUri && mayLookup)
- ? await lookUpRemote(remoteUri, site)
+ ? await lookUpRemote(remoteUri, site, { handle: !!handle })
: { remote: null, remoteKind: null, reacted: { liked: false, boosted: false } };
-
const r = searchSite(req, res, rawQ, { posts: 50, tracks: 25, events: 25, pages: 8 });
- const total = r.results.length + r.tracks.length + r.events.length + r.pages.length;
+ return {
+ query: rawQ,
+ results: r.results, tracks: r.tracks, events: r.events, pages: r.pages,
+ total: r.results.length + r.tracks.length + r.events.length + r.pages.length,
+ queryError: r.queryError,
+ remoteUri, remote, remoteKind, mayLookup, remoteReacted,
+ siteTitle: site.title || '',
+ };
+}
+
+// ── De pagina: het zoekvlak, open, met de resultaten erin ────────────────────
+router.get('/', async (req, res) => {
+ const site = res.locals.site;
+ if (!site) return res.status(404).send('No site');
+ const rawQ = (req.query.q || '').toString().trim().slice(0, 2048);
+ const data = rawQ ? await gather(req, res, rawQ) : { query: '' };
renderPage(req, res, 'pages/search', {
- pageTitle: `Zoeken: ${rawQ}`, bodyClass: 'on-special', query: rawQ,
- results: r.results, tracks: r.tracks, events: r.events, pages: r.pages,
- total, queryError: r.queryError,
- remoteUri, remote, remoteKind, mayLookup,
- remoteReacted,
- siteTitle: site.title || '',
+ pageTitle: rawQ ? `Zoeken: ${rawQ}` : 'Zoeken', bodyClass: 'on-special',
+ ...data,
});
});
-// ── De live-preview van een adres (HTML-fragment) ─────────────────────────────
+// ── Het live vak onder de zoekbalk (HTML-fragment) ───────────────────────────
//
-// Plak je een link in de zoekbalk, dan haalt de uitklaplijst de post zelf op
-// in plaats van te zoeken naar de tekst van de link (shaer-utpi).
+// Dezelfde render als de pagina (partials/search-results.ejs), zodat het vak
+// en de pagina er per constructie hetzelfde uitzien. Dit verving twee routes:
+// /suggest (JSON, dat de browser zelf tot een lijstje bouwde, anders dan de
+// pagina) en /remote (alleen het adres).
//
-// Dezelfde grens als de volle pagina, en hier weegt hij zwaarder: deze route
-// wordt bij elke toetsaanslag geraakt, dus zonder die grens is hij een
-// haalservice die iedereen deze server op adressen naar keuze laat afsturen.
-// Mag je niet ophalen, of is het geen adres, dan 204: de zoekbalk valt dan
-// terug op de gewone suggesties. Geen 403, want voor een bezoeker is een
-// geplakte link gewoon een zoekterm en geen geweigerde handeling.
+// De rechtengrens voor het ophalen zit in gather en is dezelfde als voor de
+// pagina; hier weegt hij zwaarder, want dit wordt bij elke toetsaanslag
+// geraakt. Een bezoeker die een link plakt krijgt de gewone resultaten en de
+// zin waarom er verder niets staat, en er gaat geen verzoek uit.
const VIEWS_DIR = path.join(path.dirname(fileURLToPath(import.meta.url)), '..', 'views');
-router.get('/remote', async (req, res) => {
- const site = res.locals.site;
- const remoteUri = lookupUri(String(req.query.q || '').slice(0, 2048));
- if (!site || !remoteUri || !mayLookUp(req, res)) return res.status(204).end();
- const { remote, remoteKind, reacted } = await lookUpRemote(remoteUri, site);
- // Dezelfde taal als de pagina eromheen, anders staat er een Engelse kaart
+router.get('/results', async (req, res) => {
+ const site = res.locals.site;
+ const rawQ = String(req.query.q || '').trim().slice(0, 2048);
+ if (!site || rawQ.length < 2) return res.status(204).end();
+ const data = await gather(req, res, rawQ);
+ // Dezelfde taal als de pagina eromheen, anders staat er een Engelse lijst
// in een Nederlandse zoekbalk.
const lang = resolveLang(req, { userLang: req.session?.user?.lang, defaultLang: getSetting('default_lang') });
- const html = await ejs.renderFile(path.join(VIEWS_DIR, 'partials', 'remote-preview.ejs'), {
+ const html = await ejs.renderFile(path.join(VIEWS_DIR, 'partials', 'search-results.ejs'), {
+ ...data,
t: (k, vars) => i18nT(lang, k, vars),
- remote, remoteKind, remoteUri, reacted,
- siteTitle: site.title || '',
+ formatDate,
+ siteUrlBase: res.locals.siteUrlBase || '',
}, { async: false });
// Wat deze bezoeker ziet hangt van zijn rechten en zijn reacties af: niet
@@ -292,20 +321,3 @@
});
-// ── Live suggestions (JSON) ──────────────────────────────────────────────────
-router.get('/suggest', (req, res) => {
- const site = res.locals.site;
- if (!site) return res.json({ posts: [], tracks: [], events: [], pages: [] });
- const rawQ = (req.query.q || '').toString().trim().slice(0, 100);
- if (rawQ.length < 2) return res.json({ posts: [], tracks: [], events: [], pages: [] });
-
- const urlFor = (slug) => `/${slug}`;
- const r = searchSite(req, res, rawQ, { posts: 5, tracks: 4, events: 3, pages: 4 });
- res.json({
- posts: r.results.map((p) => ({ title: p.title || '(zonder titel)', url: urlFor(p.slug) })),
- tracks: r.tracks.map((tr) => ({ title: tr.title, artist: tr.artist, url: tr.postUrl })),
- events: r.events.map((e) => ({ when: [e.date, e.time].filter(Boolean).join(' '), where: e.where, url: e.url })),
- pages: r.pages,
- });
-});
-
export default router;
Index: src/views/pages/search.ejs
===================================================================
--- src/views/pages/search.ejs (revision 86cfa1a2d9b65efe6ad3db8bd0411bedd61b0f82)
+++ src/views/pages/search.ejs (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
@@ -1,265 +1,9 @@
-<% const _base = (typeof siteUrlBase !== 'undefined' && siteUrlBase) ? siteUrlBase : ''; %>
-<% const _tracks = (typeof tracks !== 'undefined' && tracks) ? tracks : []; %>
-<% const _events = (typeof events !== 'undefined' && events) ? events : []; %>
-<% const _pages = (typeof pages !== 'undefined' && pages) ? pages : []; %>
-
-
<%= t('nav.search') %>
+<%#
+ /search?q=... is geen eigen pagina meer met een eigen uiterlijk (Robins
+ ontwerp, 30-9): het is het zoekvlak, open, met de resultaten al op de server
+ gerenderd. Een gedeelde link en Enter zonder JavaScript komen zo op precies
+ hetzelfde beeld uit als de zoekbalk op elke andere pagina.
-
-
- <% if (queryError) { %>
-
- <% } %>
-
- <%# Een geplakt adres is geen zoekterm maar een aanwijzing (shaer-utpi): het
- object van de andere server staat bovenaan, met dezelfde knoppen als op
- /authorize_interaction -- dezelfde partial, dus één render en één plek
- waar een poort of een sanitizer kan wonen. %>
- <% if (typeof remoteUri !== 'undefined' && remoteUri) { %>
-
<%= t('search.section_fediverse') %>
-
- <% if (!mayLookup) { %>
- <%# Ophalen is een uitgaand verzoek namens deze server; dat doen we niet
- op verzoek van een willekeurige bezoeker. %>
-
-
-
+ De opmaak staat in partials/search-styles.ejs, die de topnav al meebrengt.
+%>
+<%- include('../partials/search-surface', Object.assign({}, locals, { mode: 'page' })) %>
Index: src/views/partials/fedi-interact-styles.ejs
===================================================================
--- src/views/partials/fedi-interact-styles.ejs (revision 86cfa1a2d9b65efe6ad3db8bd0411bedd61b0f82)
+++ src/views/partials/fedi-interact-styles.ejs (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
@@ -159,16 +159,8 @@
border: 1px solid color-mix(in srgb, var(--ink, #000) 18%, transparent); background: var(--paper, #fff); color: var(--ink, #000); }
- /* De live-preview: open-link onder de kaart, en de kaart zonder rand-marge. */
+ /* De compacte kaart in het zoekvak: de link naar de volle pagina eronder. */
.rp-open { display: block; padding: 10px 4px 2px; text-align: right; font-weight: 600; font-size: .88rem;
color: var(--accent, #06c); text-decoration: none; }
.rp-open:hover { text-decoration: underline; }
- .ss-remote { padding: 4px 0 6px; }
- .ss-remote-note { padding: .8rem .6rem; color: var(--ink-soft, var(--ink-muted)); font-size: .9rem; }
- .ss-remote-loading { display: flex; align-items: center; gap: 10px; padding: .9rem .6rem; color: var(--ink-soft, var(--ink-muted)); font-size: .9rem; }
- .ss-remote-loading::before { content: ''; width: 16px; height: 16px; border-radius: 50%; flex: 0 0 16px;
- border: 2px solid color-mix(in srgb, var(--accent, #06c) 30%, transparent); border-top-color: var(--accent, #06c);
- animation: ss-spin .8s linear infinite; }
- @keyframes ss-spin { to { transform: rotate(360deg); } }
- @media (prefers-reduced-motion: reduce) { .ss-remote-loading::before { animation: none; } }
/* Smal scherm: alleen de tekens, gelijk verdeeld over de breedte. De woorden
Index: src/views/partials/remote-preview.ejs
===================================================================
--- src/views/partials/remote-preview.ejs (revision 86cfa1a2d9b65efe6ad3db8bd0411bedd61b0f82)
+++ (revision )
@@ -1,28 +1,0 @@
-<%#
- De live-preview van een geplakt adres, onder de zoekbalk (shaer-utpi).
-
- Een los fragment, geen pagina: de zoekbalk haalt dit op terwijl je plakt en
- zet het in de uitklaplijst. Daarom:
-
- - GEEN SCRIPT. Wat via innerHTML binnenkomt draait niet, en onder de
- strenge CSP zou het ook niet mogen. Het gedrag (waarderen en boosten
- zonder de pagina te verlaten) zit in chrome.js, dat op elke pagina staat.
- - DE OPMAAK REIST MEE. De overlay staat op elke pagina en die heeft de
- opmaak van de kaart niet vanzelf; style-src staat inline toe.
- - COMPACT. Antwoorden en melden gebeuren op de volle pagina: een editor in
- een uitklaplijst is op een telefoon geen plek om te schrijven.
-
- Verwacht: remote, remoteKind ('note' | 'actor' | null), remoteUri, reacted,
- siteTitle.
-%>
-<%- include('./fedi-interact-styles') %>
-
Index: src/views/partials/search-results.ejs
===================================================================
--- src/views/partials/search-results.ejs (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
+++ src/views/partials/search-results.ejs (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
@@ -0,0 +1,138 @@
+<%#
+ Wat er onder de zoekbalk staat. EEN render voor beide ingangen: het live
+ resultatenvak (via /search/results) en de pagina /search?q=... zelf. Zo zien
+ ze er per constructie hetzelfde uit; twee renders lopen gegarandeerd uit de
+ pas.
+
+ Verwacht: query, results (posts), tracks, events, pages, queryError,
+ remoteUri, remote, remoteKind, mayLookup, remoteReacted, siteTitle,
+ siteUrlBase, formatDate, t.
+
+ GEEN SCRIPT hierin: het live vak zet dit via innerHTML neer, en daar draait
+ niets. Gedrag (afspelen, waarderen, htmx-links) luistert op document.
+%>
+<%
+ const _base = (typeof siteUrlBase !== 'undefined' && siteUrlBase) ? siteUrlBase : '';
+ const _results = (typeof results !== 'undefined' && results) ? results : [];
+ const _tracks = (typeof tracks !== 'undefined' && tracks) ? tracks : [];
+ const _events = (typeof events !== 'undefined' && events) ? events : [];
+ const _pages = (typeof pages !== 'undefined' && pages) ? pages : [];
+ const _remote = (typeof remoteUri !== 'undefined' && remoteUri) ? remoteUri : '';
+ // Alles via locals: een veld dat een aanroeper vergeet mag de render niet
+ // laten omvallen (een kale verwijzing naar iets ongedefinieerds gooit).
+ const _queryError = !!locals.queryError;
+ const _mayLookup = !!locals.mayLookup;
+ const _found = locals.remote || null;
+ const _kind = locals.remoteKind || null;
+ const _reacted = locals.remoteReacted || { liked: false, boosted: false };
+ const _siteTitle = locals.siteTitle || '';
+ const _inPost = t('search.in_post');
+ const _any = _results.length || _tracks.length || _events.length || _pages.length;
+%>
+<% if (locals.query) { %>
+
+ <% if (_remote) { %>
+ <%# Een geplakt adres is geen zoekterm maar een aanwijzing (shaer-utpi).
+ Ophalen doen we alleen namens een ingelogde beheerder van de site. %>
+
+
+<% } %>
Index: src/views/partials/search-styles.ejs
===================================================================
--- src/views/partials/search-styles.ejs (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
+++ src/views/partials/search-styles.ejs (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
@@ -0,0 +1,70 @@
+<%#
+ De opmaak van het zoeken: het vlak (balk + vak) en wat erin staat. Staat in
+ de topnav, dus op elke pagina: de overlay kan overal open, en de pagina
+ /search gebruikt precies dezelfde regels.
+%>
+
Index: src/views/partials/search-surface.ejs
===================================================================
--- src/views/partials/search-surface.ejs (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
+++ src/views/partials/search-surface.ejs (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
@@ -0,0 +1,50 @@
+<%#
+ Het zoeken, in twee vormen en verder niets: de zoekbalk bovenaan, en
+ daaronder het vak met resultaten dat alle ruimte krijgt (Robins ontwerp,
+ 30-9). Er is geen aparte resultatenpagina meer die er anders uitziet.
+
+ EEN PARTIAL, TWEE INGANGEN:
+ mode 'overlay' in de topnav, op elke pagina; verborgen tot je op zoeken
+ tikt. Draagt de id's waar chrome.js hem aan herkent.
+ mode 'page' /search?q=...: dezelfde vorm, open, met de resultaten al
+ op de server gerenderd. Een gedeelde link en Enter zonder
+ JavaScript komen zo op precies hetzelfde beeld uit.
+
+ Verwacht: mode, t, siteUrlBase. Voor 'page' ook query en de resultaten
+ (zie search-results.ejs).
+%>
+<%
+ const _page = locals.mode === 'page';
+ const _base = locals.siteUrlBase || '';
+ const _q = _page ? (locals.query || '') : '';
+%>
+
Index: src/views/partials/topnav.ejs
===================================================================
--- src/views/partials/topnav.ejs (revision 86cfa1a2d9b65efe6ad3db8bd0411bedd61b0f82)
+++ src/views/partials/topnav.ejs (revision fd8faf581c665d69b41dd6f5262d74bf432c0e1b)
@@ -175,22 +175,8 @@
-
-<%# De teksten staan op het element dat ze gebruikt, niet in het script: een
- module is een statisch bestand en kan geen vertaling interpoleren. %>
-