diff --git a/docs/features/tankekart.md b/docs/features/tankekart.md new file mode 100644 index 0000000..cedb5d1 --- /dev/null +++ b/docs/features/tankekart.md @@ -0,0 +1,108 @@ +# Feature: Tankekart (radial grafvisning) + +## Konsept + +Tankekart-panelet viser noder og edges i radial layout — en +rotnode i sentrum, relaterte noder rundt, edges som linjer. +Det er kunnskapsgrafen i en annen layout: radial i stedet +for force-directed. + +Ingen ny backend. Ingen nye tabeller. Ren frontend-visning +av eksisterende grafdata via WebSocket. + +## Brukeropplevelse + +1. Bruker åpner tankekart-panel i arbeidsflaten +2. Rotnoden er kontekst-headerens aktive node (eller manuelt valgt) +3. Relaterte noder (1-2 hopp) hentes og vises radialt +4. Klikk på en node → den blir ny rot (zoom inn) +5. Dobbeltklikk → åpne noden i editor/detalj +6. Drag fra node til node → opprett edge +7. Drag node ut av kartet → opprett ny node (universell overføring) + +## Layout + +``` + ┌─ Episode 42 + │ + ┌─ Podcast ──── Episode 41 + │ │ + │ └─ Show notes + │ +Sidelinja ─── Redaksjonen ─── Kanban + │ + │ ┌─ Vegard + └─ Team ──┤ + └─ Trond +``` + +Radial: rot i sentrum, barn i sirkel rundt, barnebarn lenger ut. +Alternativt: tree-layout (hierarkisk, topp-bunn). + +## Datakilder + +- Noder og edges fra WebSocket (sanntid, allerede tilgjengelig) +- Filtrer på edge-typer: `belongs_to`, `mentions`, `member_of`, + `source_material` — konfigurerbart per bruker +- Dybde: 1-3 hopp fra rot (konfigurerbart) + +## Interaksjon + +| Handling | Resultat | +|----------|---------| +| Klikk node | Ny rotnode (re-layout rundt denne) | +| Dobbeltklikk | Åpne i editor/detalj | +| Drag node → node | Opprett edge (mentions) | +| Drag node → utenfor | Universell overføring | +| Scroll/pinch | Zoom inn/ut | +| Drag bakgrunn | Pan | +| Hover node | Vis tittel + node_kind + antall edges | + +## Visuell stil + +- Noder som sirkler/bokser, fargekodet etter `node_kind` +- Edges som linjer, stiplede for `mentions`, heltrukne for `belongs_to` +- Rotnode visuelt fremhevet (større, annen farge) +- Privacy-markering: 🔒 på private noder (se `docs/features/nodereferanser.md`) +- Animert overgang ved rot-bytte + +## Trait + +`mindmap`-trait på samlingsnoder: + +```jsonc +{ + "traits": { + "mindmap": { + "default_depth": 2, + "layout": "radial", + "edge_types": ["belongs_to", "mentions", "source_material"] + } + } +} +``` + +Også tilgjengelig som frittstående panel i arbeidsflaten +(uten trait — bare velg en node som rot). + +## Hva det IKKE er + +- Ikke et tegneverktøy (det er whiteboard) +- Ikke fri plassering (det er canvas/arbeidsflaten) +- Ikke force-directed graf (det er kunnskapsgraf-visningen) +- Det er en **automatisk layoutet graf med rot** — data-drevet + +## Teknisk + +- Svelte-komponent med SVG eller Canvas +- Layout: `d3-hierarchy` for tree, trigonometri for radial +- Data fra eksisterende WebSocket-stores +- BlockShell-panel med fullskjerm/resize +- Responsivt: på mobil vises som vertikal trevisning + +## Bygger på +- `docs/features/canvas_primitiv.md` — pan/zoom +- `docs/features/kunnskapsgraf_og_relasjoner.md` — grafdata +- `docs/features/universell_overfoering.md` — drag ut av kart +- `docs/retninger/interaksjonsmodell.md` — drag-and-drop grammatikk +- `docs/features/nodereferanser.md` — privacy-markering diff --git a/scripts/run-next-task.sh b/scripts/run-next-task.sh index c1d61db..6c722b6 100755 --- a/scripts/run-next-task.sh +++ b/scripts/run-next-task.sh @@ -44,6 +44,7 @@ declare -A PHASE_DEPS=( [24]="23" [25]="24" [26]="25" + [27]="26" ) # --- Finn blokkerte faser --- diff --git a/tasks.md b/tasks.md index a7d3a6a..856b3b9 100644 --- a/tasks.md +++ b/tasks.md @@ -47,6 +47,7 @@ Fase 22 → Fase 23 (validering — alle faser) Fase 23 → Fase 24 (orkestrering) Fase 24 → Fase 25 (web clipper) Fase 25 → Fase 26 (epost) +Fase 26 → Fase 27 (tankekart) ``` Hvis en oppgave er `[?]` eller `[!]`, hoppes den over — og alle @@ -348,3 +349,13 @@ sidelinja.org, vegard.info) ruter til samme bruker basert på username. - [ ] 26.5 `synops-mail --receive`: Rust CLI som leser raw epost fra stdin. Sjekk 1: avsender-epost matcher `auth_identities.email`? Sjekk 2: innhold starter med "Kjære vaktmester" (eller konfigurerbar frase)? Begge må matche. Opprett `content`-node i brukerens innboks med epostinnholdet. Alt annet → /dev/null, ingen bounce. - [ ] 26.6 Domene-alias: `vegard@synops.no`, `vegard@sidelinja.org`, `vegard@vegard.info` ruter alle til samme bruker via username-oppslag i PG. Domenet er irrelevant. - [ ] 26.7 Utgående varsler: vaktmesteren kan sende epost-varsler til brukere (ny oppgave tildelt, innsendt artikkel godkjent, etc.) via `synops-mail --send`. Konfigurerbart per bruker i metadata.preferences. + +## Fase 27: Tankekart — radial grafvisning + +Ref: `docs/features/tankekart.md`. Tankekart-panel som viser noder og edges +i radial layout med en rotnode i sentrum. Ingen ny backend — ren frontend- +visning av eksisterende grafdata. + +- [ ] 27.1 MindMap Svelte-komponent: radial/tree-layout av noder rundt en rotnode. Hent relaterte noder (1-2 hopp) via WebSocket. d3-hierarchy eller trigonometri for layout. Pan/zoom via canvas-primitiv. Klikk node = ny rot, dobbeltklikk = åpne i editor. +- [ ] 27.2 BlockShell-panel: MindMap som BlockShell-panel i arbeidsflaten med fullskjerm, resize, drag-handle. Rotnode fra kontekst-header. Responsivt. +- [ ] 27.3 MindMap-trait: `mindmap`-trait for samlingsnoder. Vises i trait-velger ved opprettelse. Konfigurasjon: default dybde (1-3 hopp), layout-stil (radial/tree).