De lijst is zo breed als haar inhoud, dus ze schuift naar links zodra ze
rechts van het veld niet meer past. position() liep alleen bij het openen,
met de volledige lijst als maat. Na het intypen van een zoekterm bleef die
verschuiving staan terwijl de lijst gekrompen was: drie korte regels ver
links van het veld waar ze bij horen.
Gemeten in test/fixture.html, veld op x=1250 in een venster van 1401px:
gefilterd tot 140px breed bleef de lijst op left 1073 staan, nu springt ze
naar 1250. Past de inhoud nog altijd niet, dan schuift ze zoals voorheen.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
De lijst hing vast aan de linkerrand van het veld en kon dus alleen naar rechts groeien. Bij een
veld rechts in het formulier bleef er niets over en viel elk label terug op afbreken. Ze kiest nu
eerst haar breedte met het volle venster beschikbaar, en schuift daarna zo ver naar links als
nodig om te passen.
Een label dat dan nog niet op één regel past loopt terug met een hangende inspring van 2.5ch, de
breedte van twee cijfers plus een streepje, dus precies het "10-" waarmee elke budgetcode begint.
Uitlijnen onder de omschrijving lag meer voor de hand, maar die inspring is zo breed als de code
en bij een lange code bleef er nauwelijks tekstbreedte over. De code zelf breekt nooit af, ook
niet op zijn eigen streepjes: daarvoor staat ze in een eigen span met white-space:pre, met de
spatie erbuiten zodat het eerste woord van de omschrijving wel kan terugvallen.
Tussen twee opties staat een haarlijn, want een meerregelige rij loopt anders over in de
volgende. highlight() tekent nu een stuk van het label in plaats van het geheel, zodat een
zoektreffer over de grens tussen code en omschrijving heen blijft kloppen. Het title-attribuut
kan weg: met terugloop staat het volledige label altijd op het scherm.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Elke grote dropdown houdt nu zijn eigen vijf laatst gekozen waarden bij,
bovenaan de lijst onder de kopregel recent. Alles zit onder een
localStorage-sleutel, per veld, met een sleutel die uit name of id volgt
zodat rij 3 en rij 4 van hetzelfde veld één lijst delen. Delete haalt een
regel uit recent, en data-ss-recent="manual" plus window.selectSearch.remember()
is er voor wie pas mag onthouden nadat de server bevestigd heeft.
bipp-budgetcode gebruikt die weg en bouwt zijn eigen recent-optgroup dus
niet langer zelf.
Een optie zonder leesbare tekst telt voortaan als "niets gekozen", ook als
ze een waarde draagt, zoals de <option value="0"> </option> van een
OAF-scherm. Zo'n regel stond eerst gewoon in de lijst; wie ze koos kreeg
haar daarna permanent als lege blauwe balk onder recent te zien.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
De blauwe balk werd alleen door de pijltjes verzet: er was een li.active-stijl maar
geen enkele hover- of mousemove-handler, dus wie met de muis over de lijst ging stond
nergens op. Nu verzet mousemove dezelfde active-regel als het toetsenbord. Bewust geen
mouseover, want een stilliggende muis boven de lijst zou dan de pijltjes blijven
tegenwerken.
Daarbovenop een generiek haakje om suggesties op te ruimen, zoals de adresbalk van een
browser dat doet. Een optie of optgroup met data-removable is met Delete te wissen: het
script haalt zelf niets weg maar stuurt een select-search:remove-event met value, label
en index, en wie de lijst bezit past de opties aan. Geen kruisje per regel: dat neemt
plek in en wie met de muis op een regel staat wil die kiezen, niet weggooien.
Delete vuurt alleen zolang er niets getypt is, anders blijft het een gewone teksttoets.
Die vraag werd eerst met input.value beantwoord, en dat is niet de zoekterm: bij een
open lijst zonder typwerk staat daar het gekozen label in, geselecteerd en klaar om over
te typen. Delete deed dus niets in precies de gewone situatie. De zoekterm zit nu in een
eigen variabele, en die lost hetzelfde stille probleem op in resync, die de open lijst
zou dichtfilteren op een label dat de gebruiker nooit intypte.
Na een herbouw van de opties blijft de balk staan waar hij stond, geklemd op de laatste
regel, zodat je meerdere regels achter elkaar kan wissen.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
De build schreef naar dist/. In deze repo is het installeerbare bestand altijd
scripts/<naam>/<naam>.user.js, zodat elke installatielink af te leiden valt zonder
in de repo te kijken. @version naar 1.1.0 zodat bestaande installaties die via de
doorverwijzing in de oude repo binnenkomen, hierna nog een stap omhoog doen.
De installatie-uitleg staat voortaan een niveau hoger in de hoofd-README.
Glenn GoossensandClaude Opus 5