Changeset 100aad8 in Klonkt for src/views/pages/read.ejs


Ignore:
Timestamp:
08/18/2026 06:47:58 PM (3 weeks ago)
Author:
Bart <bart@…>
Branches:
main
Children:
85b51bf
Parents:
7421147
git-author:
Bart <bart@…> (08/18/2026 04:27:37 AM)
git-committer:
Bart <bart@…> (08/18/2026 06:47:58 PM)
Message:

Leesweergave: Engelse namen, en het snappen werkte niet

De namen in mod/read.js waren Nederlands (stroom, vulAan, waarnemer); de rest
van assets/js/mod is Engels. Nu ook. Commentaar blijft Nederlands. chrome
heet toggleChrome, want window.chrome bestaat ook.

Door de module los te draaien kwamen er twee echte fouten boven:

  1. Wie op het OUDSTE bericht binnenkwam, zag "einde archief" en kon niet meer omhoog. Bij het laden staat er één artikel in de stroom, en dat is tegelijk het eerste én het laatste; met een else-if won de eerste tak altijd en draaide prependNewer() nooit. Twee losse ifs.
  1. Snappen deed helemaal niets. scroll-snap-type stond op .read-stream, en dat is geen scrollcontainer (overflow: visible) -- het document scrollt. De regel staat nu op <html>, en daar werkt hij.

En toen dat eenmaal werkte, vocht het met de correctie: na het invoegen trok de
proximity-snap de tekst naar de grens van het nieuwe bericht, gemeten -600 tot
-872px, precies de ruk die deze opzet moet vermijden. Snappen gaat nu even uit
tijdens invoegen+corrigeren en twee frames later weer aan: afwijking daalt naar
-35..-62px. Ook overflow-anchor: none, anders compenseren Chrome en Firefox er
nog eens overheen -- onze eigen correctie moet blijven, want Safari kent scroll
anchoring niet.

Co-Authored-By: Claude Opus 5 <claude@…>

File:
1 edited

Legend:

Unmodified
Added
Removed

  • src/views/pages/read.ejs

    r7421147 r100aad8  
    5757/* PROXIMITY, geen mandatory. Een bericht dat langer is dan het scherm moet je
    5858   rustig kunnen doorlezen; mandatory zou je bij elke pauze terugtrekken naar
    59    een grens. Zo snapt hij alleen als je in de buurt van een grens bent. */
    60 .on-read .read-stream { scroll-snap-type: y proximity; }
     59   een grens. Zo snapt hij alleen als je in de buurt van een grens bent.
     60
     61   OP <html>, en dat is geen smaakkwestie: snappen doet de SCROLLCONTAINER, en
     62   dat is hier het document -- .read-stream heeft overflow: visible en scrollt
     63   zelf niet. Op .read-stream stond de regel er wel, maar deed hij niets. */
     64html:has(body.on-read) { scroll-snap-type: y proximity; }
     65
     66/* De browser NIET ook laten compenseren. Chrome en Firefox schuiven bij
     67   invoegen bóven het beeld de scrollpositie zelf mee (scroll anchoring); samen
     68   met onze eigen correctie in mod/read.js is dat twee keer, en dan springt de
     69   tekst precies één bericht weg. Onze eigen correctie moet blijven, want Safari
     70   (en dus iOS) kent scroll anchoring helemaal niet. */
     71html:has(body.on-read), .on-read .read-stream, .on-read .read-post { overflow-anchor: none; }
    6172.on-read .read-post {
    6273  scroll-snap-align: start;
Note: See TracChangeset for help on using the changeset viewer.