Changeset 3a3a882 in Klonkt for src


Ignore:
Timestamp:
08/19/2026 06:33:11 PM (3 weeks ago)
Author:
Robin <roboburr@…>
Branches:
main
Children:
8c91ed3
Parents:
70dbef4
Message:

Lezen staat in de cirkel zichtbaar maar dood, in plaats van weg

De knop verdween daar helemaal, met het argument dat een knop die niets
doet erger is dan geen knop. In de praktijk pakte dat andersom uit: de
pil werd smaller op de cirkel en breder op solo, en die sprong leest als
'er is hier iets weg' -- terwijl juist NIET duidelijk werd dat Lezen
bestaat en er alleen hier niet kan. Nu staat hij er grijs bij, met een
titel die zegt waarom, en is Grid zichtbaar de enige mogelijkheid.

Wat daarmee vervalt: de aparte cirkel-voorkeur ('pcms-cirkel-view').
Die kon nog maar een waarde hebben. De solo-keuze blijft onaangeroerd --
op de cirkel schrijven we niets meer naar localStorage, dus je komt thuis
in de weergave die je achterliet.

Drie plekken rekenden erop dat de knop er niet was en zijn meegegaan: de
terugval 'is dit de enige knop, dan brengt hij je naar de standaard' (er
zijn er nu twee, en op de cirkel hoort Grid juist de enige te blijven),
de aria-sync (een dode knop kan nooit de actieve zijn) en de klik-
afhandeling (expliciet op sw.disabled, niet vertrouwen op dat een
disabled button geen click vuurt -- deze listener hangt op document).

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

Location:
src
Files:
5 edited

Legend:

Unmodified
Added
Removed
  • src/assets/css/style.css

    r70dbef4 r3a3a882  
    23712371    color: var(--ink);
    23722372    border-color: var(--ink-muted);
     2373}
     2374/* Uitgeschakeld (Lezen in de cirkel) wint van :hover -- anders licht een knop
     2375   op die je niet kunt indrukken, en dat is precies de verkeerde belofte. */
     2376.view-switch-btn[disabled],
     2377.view-switch-btn[disabled]:hover {
     2378    opacity: .38;
     2379    cursor: not-allowed;
     2380    color: var(--ink-muted);
     2381    border-color: var(--rule);
    23732382}
    23742383/* Actieve state: puur afgeleid van body[data-feed-view]. Geen .is-active class meer.
  • src/services/i18n.js

    r70dbef4 r3a3a882  
    3434    'switch.circle': 'Cirkels',
    3535    'switch.grid': 'Grid', 'switch.reader': 'Lezen',
     36    'switch.reader_solo_only': 'Lezen kan alleen in Solo — in de cirkel staan berichten van anderen',
    3637    'postnav.newer': 'Nieuwer',
    3738    'postnav.older': 'Ouder',
     
    10481049    'switch.circle': 'Circles',
    10491050    'switch.grid': 'Grid', 'switch.reader': 'Reader',
     1051    'switch.reader_solo_only': 'Reader is Solo only — a circle shows other people\u2019s posts',
    10501052    'postnav.newer': 'Newer',
    10511053    'postnav.older': 'Older',
     
    20532055    'switch.circle': 'Zirkel',
    20542056    'switch.grid': 'Raster', 'switch.reader': 'Lesen',
     2057    'switch.reader_solo_only': 'Lesen gibt es nur in Solo — im Zirkel stehen Beitr\u00e4ge anderer',
    20552058    'postnav.newer': 'Neuer',
    20562059    'postnav.older': 'Älter',
  • src/views/partials/shared-styles.ejs

    r70dbef4 r3a3a882  
    4040   feed pages syncAria sets aria-selected=false → both grey. */
    4141.view-switch-btn[aria-selected="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
     42/* Lezen in de cirkel: zichtbaar maar dood. Niet weggelaten, want dan springt de
     43   pil van breedte tussen Solo en Cirkel, en juist DAT verbergt dat er een
     44   tweede weergave bestaat. Grijs + not-allowed zegt "bestaat, kan hier niet". */
     45.view-switch-btn[disabled] { opacity: .38; cursor: not-allowed; }
     46.view-switch-btn[disabled]:hover { color: var(--ink-muted, var(--ink-soft)); background: transparent; }
    4247
    4348/* Agenda = its OWN pill (separate from Timeline/Grid, so the feed-toggle is never
  • src/views/partials/view-switcher.ejs

    r70dbef4 r3a3a882  
    1212  // Lezen bestaat alleen waar een leessectie is, en dat is de eigen feed. De
    1313  // cirkel toont berichten van ANDEREN, opgehaald van hun servers -- daar is
    14   // "het hele stuk" niet iets wat wij in handen hebben. Dus daar geen knop:
    15   // een knop die niets doet is erger dan een knop die er niet is.
    16   var _leesbaar = _bc.indexOf('on-cirkel') < 0;
     14  // "het hele stuk" niet iets wat wij in handen hebben.
     15  //
     16  // De knop verdween daar eerst helemaal, met het argument dat een knop die
     17  // niets doet erger is dan geen knop. In de praktijk pakte dat andersom uit:
     18  // de pil werd smaller op de cirkel en breder op solo, en die sprong leest als
     19  // "er is hier iets weg" -- terwijl juist NIET duidelijk werd dat Lezen
     20  // bestaat en hier alleen niet kan. Hij staat er nu dood bij: zichtbaar, grijs
     21  // en niet aan te klikken. Dan is er maar een mogelijkheid, Grid, en je ziet
     22  // meteen dat dat geen toeval is maar de enige.
     23  var _leesUit = _bc.indexOf('on-cirkel') >= 0;
     24  var _gridStandaard = (typeof site !== 'undefined' && site && site.feed_view_default === 'grid');
    1725%>
    1826<div class="view-switcher-wrap">
     
    4048    <% } %>
    4149    <div class="view-switcher" role="tablist" aria-label="Weergave">
    42       <% if (_leesbaar) { %>
     50
    4351      <%# Lezen is de standaardweergave sinds Tijdlijn weg is: hele berichten,
    4452          één per scherm. De chronologische lijst bestaat nog wel als opmaak
     
    4654          meer -- daar was Lezen de betere vorm van. %>
    4755      <button type="button" class="view-switch-btn" data-view="reader" role="tab"
    48               aria-selected="<%= (!_neutral && !(typeof site !== 'undefined' && site && site.feed_view_default === 'grid')) ? 'true' : 'false' %>">
     56              <%- _leesUit ? 'disabled aria-disabled="true" tabindex="-1" title="' + t('switch.reader_solo_only') + '"' : '' %>
     57              aria-selected="<%= (!_leesUit && !_neutral && !_gridStandaard) ? 'true' : 'false' %>">
    4958        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/><path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/></svg>
    5059        <span><%= t('switch.reader') %></span>
    5160      </button>
    52       <% } %>
    5361      <button type="button" class="view-switch-btn" data-view="grid" role="tab"
    54               aria-selected="<%= (!_neutral && (typeof site !== 'undefined' && site && site.feed_view_default === 'grid')) ? 'true' : 'false' %>">
     62              aria-selected="<%= (!_neutral && (_leesUit || _gridStandaard)) ? 'true' : 'false' %>">
    5563        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></svg>
    5664        <span><%= t('switch.grid') %></span>
  • src/views/shell.ejs

    r70dbef4 r3a3a882  
    548548  var body = document.body;
    549549
    550   // DE CIRKEL HEEFT EEN EIGEN KEUZE, met een eigen standaard: Grid.
     550  // DE CIRKEL HEEFT MAAR EEN WEERGAVE: Grid.
    551551  //
    552   // Twee redenen om die apart te houden van de gewone voorkeur. Ten eerste is
    553   // Lezen daar geen optie (dat zijn berichten van anderen, van hun servers), dus
    554   // "reader" betekent er iets anders dan hier: de gewone lijst. Ten tweede zou
    555   // een tuimeling op de cirkel anders je SOLO-weergave veranderen -- je zet daar
    556   // Grid uit en komt thuis in een andere feed terug dan je achterliet.
    557   var CIRKEL_SLEUTEL = 'pcms-cirkel-view';
     552  // Lezen is daar geen optie -- dat zijn berichten van ANDEREN, van hun servers,
     553  // en "het hele stuk" hebben wij daar niet in handen. De knop staat er wel,
     554  // maar dood (zie view-switcher.ejs). Er valt dus niets te kiezen en dus ook
     555  // niets te onthouden: de eigen cirkel-voorkeur die hier stond
     556  // ('pcms-cirkel-view') is vervallen, want hij kon nog maar een waarde hebben.
     557  //
     558  // Wat WEL blijft: de cirkel raakt je solo-keuze niet aan. Die staat in
     559  // 'pcms-feed-view' en wordt hier nergens geschreven, zodat je thuiskomt in de
     560  // weergave die je achterliet.
    558561  function opCirkel() { return body.classList.contains('on-cirkel'); }
    559562
     
    562565    try {
    563566      if (opCirkel()) {
    564         // Alles behalve een uitdrukkelijke 'list' is grid: dat is de standaard.
    565         body.dataset.feedView = (localStorage.getItem(CIRKEL_SLEUTEL) === 'list') ? 'reader' : 'grid';
     567        body.dataset.feedView = 'grid';   // de enige mogelijkheid daar
    566568        return;
    567569      }
     
    588590    var _feedC = ['on-home','on-tag','on-type','on-user','on-cirkel'];
    589591    var _onFeed = _feedC.some(function(c){ return body.classList.contains(c); });
    590     // Een weergave die op DEZE pagina niet bestaat, kan ook niet actief zijn.
    591     // Lezen ontbreekt in de cirkel (daar staan berichten van anderen), en wie
    592     // op de eigen feed Lezen koos houdt die voorkeur in localStorage. Zonder
    593     // terugval staat de hele pil dan grijs terwijl de tijdlijn gewoon te zien
    594     // is -- de lezer ziet nergens meer waar hij is. De VOORKEUR blijft staan:
    595     // terug op de eigen feed is Lezen weer actief.
     592    // Een weergave die op DEZE pagina niet KAN, kan ook niet actief zijn. In de
     593    // cirkel staat Lezen er wel maar uitgeschakeld; pasWeergaveToe() heeft
     594    // feedView daar al op 'grid' gezet, dus de terugval hieronder vuurt er niet.
     595    // Hij blijft staan voor het geval een pagina een knop mist: zonder terugval
     596    // staat de hele pil grijs terwijl er wel degelijk iets te zien is, en dan
     597    // ziet de lezer nergens meer waar hij is. De solo-VOORKEUR blijft intact.
    596598    var _view = String(body.dataset.feedView || 'reader');
    597599    if (!/^[a-z]+$/.test(_view)) _view = 'reader';
    598600    if (!document.querySelector('.view-switch-btn[data-view="' + _view + '"]')) _view = 'reader';
    599601    document.querySelectorAll('.view-switch-btn').forEach(function(b) {
    600       b.setAttribute('aria-selected', (_onFeed && b.dataset.view === _view) ? 'true' : 'false');
     602      b.setAttribute('aria-selected', (_onFeed && !b.disabled && b.dataset.view === _view) ? 'true' : 'false');
    601603    });
    602604    document.querySelectorAll('.grid-cols-btn').forEach(function(b) {
     
    635637    var sw = e.target.closest('.view-switch-btn');
    636638    if (sw) {
     639      // Een dode knop doet niets. Een <button disabled> vuurt in de meeste
     640      // browsers geen click, maar deze listener hangt op document en vangt ook
     641      // wat er langs de randen komt -- dus expliciet, niet op goed vertrouwen.
     642      if (sw.disabled) return;
    637643      var view = sw.dataset.view;
    638       // EEN KEUZE MOET TERUG KUNNEN. Op de cirkel is Grid de enige knop (Lezen
    639       // bestaat daar niet, want dat zijn berichten van anderen), en een knop die
    640       // al actief is doet normaal niets -- dan zit je in Grid zonder weg terug.
    641       // Is dit de enige knop op deze pagina en staat hij al aan, dan brengt hij
    642       // je terug naar de standaard, en dat is daar de gewone lijst.
    643       if (document.querySelectorAll('.view-switch-btn').length === 1
    644           && sw.getAttribute('aria-selected') === 'true') {
    645         view = 'reader';
    646       }
    647644      body.dataset.feedView = view;
    648       // Op de cirkel onthouden we los, want daar betekent 'reader' de gewone
    649       // lijst en hoort het je thuisweergave niet aan te raken.
     645      // Op de cirkel schrijven we NIETS. Daar is Grid de enige mogelijkheid, dus
     646      // er valt niets te onthouden -- en je solo-keuze mag er zeker niet door
     647      // veranderen: die moet je terugvinden zoals je hem achterliet.
    650648      try {
    651         if (opCirkel()) localStorage.setItem(CIRKEL_SLEUTEL, view === 'grid' ? 'grid' : 'list');
    652         else localStorage.setItem('pcms-feed-view', view);
     649        if (!opCirkel()) localStorage.setItem('pcms-feed-view', view);
    653650      } catch(_) {}
    654651      syncAria();
Note: See TracChangeset for help on using the changeset viewer.