Files
webmanager-mvp/project_docs/UI_KEYBOARD_V1_1_AND_WILDCARD_DESIGN.md

4.9 KiB

UI_KEYBOARD_V1_1_AND_WILDCARD_DESIGN.md

Deel 1: Keyboard Navigation v1.1 (Mac-vriendelijk)

Doel

Keyboard v1.1 bouwt voort op v1 en maakt navigatie sneller op Mac zonder de bestaande muisflow of backendcontracten te wijzigen.

Shortcut scope (v1.1)

  • Tab: wissel actief paneel (left <-> right)
  • ArrowUp / ArrowDown: verplaats current row
  • Enter: open directory op current row
  • Space: toggle selectie op current row
  • Escape: wis selectie in actief paneel
  • Cmd + ArrowUp: ga naar eerste rij
  • Cmd + ArrowDown: ga naar laatste rij
  • Alt + ArrowUp: grotere stap omhoog
  • Alt + ArrowDown: grotere stap omlaag

State impact

Geen nieuw globaal model nodig; uitbreiding op bestaand model:

  • per paneel blijft:
    • currentPath
    • visibleItems
    • selectedItems
    • currentRowIndex
  • globaal blijft:
    • activePane

Aanvullende constante voor stapgrootte:

  • PAGE_STEP (voorstel: 10 rijen)

Navigatie- en scrollgedrag

  • Cmd + ArrowUp: currentRowIndex = 0
  • Cmd + ArrowDown: currentRowIndex = visibleItems.length - 1
  • Alt + ArrowUp: currentRowIndex = max(0, currentRowIndex - PAGE_STEP)
  • Alt + ArrowDown: currentRowIndex = min(last, currentRowIndex + PAGE_STEP)
  • na elke indexwijziging: scrollIntoView({ block: "nearest" })
  • bij leeg paneel: alle row-shortcuts zijn no-op

Focusregels

Shortcuts alleen actief als focus niet in interactieve controls zit:

  • input, textarea, select, button, checkbox, contenteditable

Extra voor Mac-combinaties:

  • alleen onderscheppen als de combinatie exact matcht met ondersteunde shortcuts
  • geen brede override van browser/system shortcuts buiten scope

Regressierisico

  • Mac key-detectie kan verschillen (metaKey/altKey + Arrow* combinaties)
  • Overcapturing van Alt+Arrow kan botsen met OS/browsergedrag op sommige layouts
  • Onbedoelde interactie met bestaande klikselectie bij snelle keyboard/muis mix

Mitigatie:

  • centrale keyboard dispatcher met expliciete guard
  • alleen exacte combinaties afvangen
  • bestaande click handlers ongewijzigd laten

Teststrategie

Geautomatiseerd (beperkt):

  • bestaande UI smoke tests behouden
  • optioneel kleine statische regressiecheck op paneelstructuur ongewijzigd

Handmatig (primair):

  • Cmd+ArrowUp/Down springt naar begin/eind van lijst
  • Alt+ArrowUp/Down springt met grote stap en scrollt correct mee
  • shortcuts werken alleen in actief paneel
  • shortcuts doen niets in inputs/checkboxfocus
  • bestaande v1 shortcuts blijven correct werken

Deel 2: Wildcard selectie ontwerp

Doel

Snelle bulkselectie op patroon in het actieve paneel, zonder backendaanpassing.

Trigger shortcuts

  • Shift + + (oftewel Shift + = op veel toetsenborden): selecteer items op patroon
  • Shift + - : deselecteer items op patroon

Scopekeuzes (v1)

  • Werkt alleen op actief paneel
  • Werkt alleen op zichtbare items (visibleItems), niet recursief
  • Werkt op files én directories in v1 (consistent met zichtbare lijst)
  • .. parent-entry doet niet mee

Patroonformaat

  • Glob-achtig, minimaal:
    • * = willekeurige reeks
    • ? = één karakter
  • Voorbeelden:
    • *.mkv
    • S??E??*
    • Project*

Case sensitivity

  • Voorstel v1: case-insensitive matching
  • Reden: voorspelbaarder voor eindgebruikers en sluit aan op typische file-manager verwachtingen

Gedrag met bestaande selectie

  • Shift + +:
    • additief: matchende items worden toegevoegd aan bestaande selectie
    • niet-matchende selectie blijft behouden
  • Shift + -:
    • subtractief: alleen matchende items worden uit selectie verwijderd

Minimale popup UX

Eenvoudige modal/prompt met:

  • titel: Select by pattern of Deselect by pattern
  • één inputveld: patroon
  • knoppen: Apply, Cancel
  • compacte feedbackregel na apply:
    • N items matched, M changed

Paneelcontext:

  • popup wordt gestart vanuit actief paneel en toont dat expliciet (Active pane: left/right)

Wat expliciet nog niet in scope is

  • Geen regex-modus
  • Geen include/exclude in één dialoog
  • Geen persistente pattern-history
  • Geen backend batch-endpoints
  • Geen recursieve mapmatching
  • Geen geavanceerde filters op size/date/type

Regressierisico

  • Shortcut-conflict met keyboard-layouts (+ op verschillende toetsen)
  • Matchlogica kan onduidelijk zijn bij verborgen bestanden (afhankelijk van show_hidden)
  • Onbedoelde selectie van directories als gebruiker file-only verwacht

Mitigatie:

  • in popup korte hinttekst over scope (visible items in active pane)
  • heldere result-feedback (matched/changed)
  • parent-entry expliciet uitsluiten

Teststrategie

Geautomatiseerd:

  • basis smoke: UI laadt, paneelstructuur blijft intact
  • (indien kleine JS-tests bestaan) unitniveau voor glob-matcher helper

Handmatig:

  • Shift + + selecteert matchende zichtbare items in actief paneel
  • Shift + - deselecteert matchende geselecteerde items
  • inactief paneel blijft onaangeraakt
  • behavior met gemixte selectie (file+dir) is consistent
  • case-insensitive matching bevestigd