Index: src/assets/js/mod/messages.js
===================================================================
--- src/assets/js/mod/messages.js (revision 9c9a3d96eb8e158f6fe12c09a790663c76a14afe)
+++ src/assets/js/mod/messages.js (revision 2bd31d67a4567197583d1b78c6097c9c4b4558bf)
@@ -126,4 +126,52 @@
}
+ // Zwaaien ter plekke: een seintje is geen paginawissel.
+ //
+ // Het formulier blijft een echt formulier -- zonder JS post het en leidt de
+ // route om, precies als vroeger. Hier onderscheppen we het en sturen het met
+ // fetch, zoals like/boost in de Krant het al deden.
+ //
+ // LET OP DE VERZENDKNOP. Deze formulieren hebben er MEERDERE ("Wat leuk!",
+ // "Hoe gaat het?", "Terug"), elk met een eigen name="text". FormData(f) neemt
+ // de aangeklikte knop NIET mee -- dat doet de browser alleen bij een echte
+ // verzending. Zonder submitter vertrekt er dus een zwaai zonder tekst, en die
+ // weigert de route. Vandaar submitter, met een terugval op de eerste knop.
+ document.addEventListener('submit', function (e) {
+ var f = e.target.closest && e.target.closest('.msg-wave, .msg-quickreply');
+ if (!f || f.dataset.sending) return;
+ e.preventDefault();
+ var knoppen = [].slice.call(f.querySelectorAll('button'));
+ var knop = e.submitter || knoppen[0];
+ if (!knop) return;
+ f.dataset.sending = '1';
+ knoppen.forEach(function (b) { b.disabled = true; });
+ var body = new URLSearchParams();
+ new FormData(f).forEach(function (v, k) { body.append(k, v); });
+ if (knop.name) body.set(knop.name, knop.value);
+ fetch(f.action, {
+ method: 'POST', body: body,
+ headers: { 'X-Requested-With': 'fetch' },
+ credentials: 'same-origin',
+ })
+ .then(function (r) { return r.ok ? r.json() : null; })
+ .then(function (j) {
+ if (!j || !j.ok) throw new Error('geweigerd');
+ // Gelukt: de knoppen maken plaats voor de bevestiging. Zwaaien is
+ // eenmalig -- anders dan een like valt het niet terug te draaien, dus
+ // een aan/uit-knop zou liegen over wat er kan.
+ var klaar = document.createElement('span');
+ klaar.className = 'msg-wave-done';
+ klaar.textContent = '👋 ' + (f.dataset.sent || '');
+ f.replaceChildren(klaar);
+ })
+ .catch(function () {
+ // Mislukt: alles terug zoals het was, zodat een tweede poging kan.
+ delete f.dataset.sending;
+ knoppen.forEach(function (b) { b.disabled = false; });
+ f.classList.add('is-failed');
+ setTimeout(function () { f.classList.remove('is-failed'); }, 600);
+ });
+ });
+
function start() { reindex(); apply(); wireBookmarklet(); }
start();
Index: src/routes/posts.js
===================================================================
--- src/routes/posts.js (revision 9c9a3d96eb8e158f6fe12c09a790663c76a14afe)
+++ src/routes/posts.js (revision 2bd31d67a4567197583d1b78c6097c9c4b4558bf)
@@ -973,10 +973,15 @@
const to = String(req.body.to || '').trim();
const text = String(req.body.text || '').trim().slice(0, 200);
- if (!site || !/^https?:\/\//i.test(to) || !text) return res.redirect(back + '?error=quickreply');
+ // Zwaaien is een seintje, en een seintje hoort de pagina niet te herladen.
+ // De module stuurt hem met X-Requested-With: fetch en krijgt JSON terug;
+ // zonder JS blijft het formulier gewoon posten en omleiden.
+ const viaFetch = req.get('X-Requested-With') === 'fetch';
+ const mis = (reden) => (viaFetch ? res.status(400).json({ ok: false, error: reden }) : res.redirect(back + '?error=' + reden));
+ if (!site || !/^https?:\/\//i.test(to) || !text) return mis('quickreply');
try {
const r = await ActivityPubService.deliverDirectNote(site, { recipients: [to], text, wave: true });
- if (r) return res.redirect(back + '?success=wave_sent');
+ if (r) return viaFetch ? res.json({ ok: true }) : res.redirect(back + '?success=wave_sent');
} catch { /* fall through */ }
- res.redirect(back + '?error=quickreply');
+ return mis('quickreply');
});
Index: src/views/pages/messages.ejs
===================================================================
--- src/views/pages/messages.ejs (revision 9c9a3d96eb8e158f6fe12c09a790663c76a14afe)
+++ src/views/pages/messages.ejs (revision 2bd31d67a4567197583d1b78c6097c9c4b4558bf)
@@ -162,4 +162,20 @@
.msg-wave button { line-height: 1.2; }
+ /* Zwaaien gebeurt ter plekke (mod/messages.js). Twee toestanden na de klik:
+ gelukt, dan vervangt de bevestiging de knoppen -- en mislukt, dan komen de
+ knoppen terug met een schud, zodat een tweede poging voor de hand ligt.
+ De bestaande klasse `nudge` kon hier niet voor dienen: die heeft alleen
+ CSS op authorize-interaction, dus op deze pagina zou hij niets doen. */
+ .msg-wave-done { font-size: .82rem; color: var(--ink-soft, #888); white-space: nowrap; }
+ .msg-wave.is-failed, .msg-quickreply.is-failed { animation: msg-wave-shake .4s ease; }
+ @keyframes msg-wave-shake {
+ 0%, 100% { transform: translateX(0); }
+ 25% { transform: translateX(-4px); }
+ 75% { transform: translateX(4px); }
+ }
+ @media (prefers-reduced-motion: reduce) {
+ .msg-wave.is-failed, .msg-quickreply.is-failed { animation: none; outline: 2px solid var(--accent); }
+ }
+
@media (max-width: 560px) {
/* Op een telefoon is 40px avatar per bubbel puur verlies: de naam staat er
Index: src/views/partials/msg-item.ejs
===================================================================
--- src/views/partials/msg-item.ejs (revision 9c9a3d96eb8e158f6fe12c09a790663c76a14afe)
+++ src/views/partials/msg-item.ejs (revision 2bd31d67a4567197583d1b78c6097c9c4b4558bf)
@@ -70,5 +70,5 @@
seintje (FEP-633c), en die twee horen niet op een hoop. %>
<% if (_rt.actorUri) { %>
-