4e6f98bbee3fd1cde8783829ce7d836c0aa5eda8
9
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
 mhoennigandClaude Opus 5
|
3fbc772d81 |
feat(diagram): das Knoten-Fenster löst den nativen Tooltip überall ab
Das Fenster aus D52 war für Touch gebaut — damit standen zwei Darstellungen desselben Inhalts nebeneinander, und ausgerechnet die schlechtere bekam der Zeiger. Jetzt zeigt es überall: am Zeiger nach 350 ms beim Überfahren, bei Tastaturfokus sofort, auf Touch unverändert beim Tipp. Was ein `title` prinzipiell nicht kann: - keine Absätze (die Beschreibungen im Plan brechen bei ~76 Zeichen, das sah ausgefranst aus), - keine Linie (der Trennstrich war aus 24 `─` GEMALT, D40-Nachtrag), - nichts bei Tastaturfokus — wer mit Tab durch das Diagramm geht, sah bisher keine Beschreibung. Nachgemessen mit ECHTEM Tastendruck: Fokus von #not.line auf #not.status, Fenster folgt, 10 px unter dem Knoten, Ring am fokussierten Knoten. - Inhalt zieht von `title` nach `data-tip` (sonst zeigte der Browser seinen eigenen zusätzlich) — dasselbe Attribut unter anderem Namen, keine Verdopplung der 20 kB DOM-Text. - Die letzten drei nativen Tooltips IN Knoten mussten weichen: Das Warndreieck war redundant (Statusname steht in den Fakten), die Annahme „Größe fehlt, gilt als M" wandert in die Faktenzeile. Nachgemessen: 0 von 161 Knoten und 0 Kinder tragen noch einen `title`. - Absicht-Erkennung: 350 ms Verzögerung, beim Wechsel zwischen Knoten ohne Warten, 120 ms Nachfrist beim Verlassen (der Weg ins Fenster führt über einen Zwischenraum). - `aria-hidden` am Fenster: Der Inhalt steht schon im aria-label, sonst würde er doppelt vorgelesen; × und ↗ deshalb `tabindex="-1"`. Werkzeuggrenze notiert: `element.focus()` feuert ohne Fensterfokus keine Fokus-Ereignisse (`document.hasFocus()` false) — der erste Prüflauf zeigte fälschlich „öffnet nichts". SPEC §9 + D57; Plan: #ed.tipwindow [x] (161 Knoten, 0 Warnungen). 293 Tests grün, 5 Snapshots/Zusicherungen auf `data-tip` nachgezogen. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> |
||
|
mhoennigandClaude Opus 5
|
b6e83b4f2a |
fix: Erledigte Knoten treten nie zurück (D46-Nachtrag)
Gemeldet: manche Knoten in Produktion werden grau dargestellt, etwa `#ed.fresh`. Ursache war nicht der Status, sondern die Pfad-Inversion: Der Knoten ist eine Zugabe (`+`) und liegt damit per D29 nie auf dem günstigsten Pfad — `.cheap-on .node:not(.cheap)` blasste ihn aus (Deckkraft 0,32, Sättigung 0,4; Pastellblau liest sich so als Grau). D46 hatte „erledigt tritt nicht zurück" bereits entschieden, die Regel hing aber an `cheapCls()` und griff nur für Knoten AUF dem Pfad. Durch das Raster fielen die fertige Zugabe und die fertige, nicht gewählte Alternative. Jetzt gilt sie unabhängig vom Pfad; Blässe heißt damit einheitlich „hier ist nichts getan und wird auch nichts getan". Umgesetzt als eigene Klasse `done` per `isDone(n)` in render.js, nicht über `st-fertig`/`st-prod`: Die Statusklasse trägt den EFFEKTIVEN Status (D39), die Ausnahme muss dem intrinsischen folgen — dieselbe Linie wie bei D35, D28 und der Kostenrechnung aus D46. Gefärbt wird unverändert nach dem effektiven Status. Nachgemessen (Werkbaum-Plan, 149 sichtbare Knoten, Pfad an): vorher blass und fertig waren genau drei Knoten (#ed.fresh, #ed.export.print, #ed.closure.greedy) — jetzt alle drei opacity 1, filter none, Füllung rgb(219,234,248) wie die fertigen Knoten auf dem Pfad. Weiterhin blass: 31 Knoten, darunter kein einziger fertiger. Der Grafikexport hatte den Fehler nie (er liest backgroundColor, nicht opacity). 240 Tests grün (4 neue in tests/frontier.test.js). Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> |
||
|
mhoennigandClaude Fable 5
|
c793bf0038 |
feat: der günstigste Pfad zeigt die offene Front (D46)
Der Pfad rechnete rein aus T-Shirt-Größen — `ownCost()` war `SIZE_RANK[size] + 1`, der Status kam in der Kostenrechnung überhaupt nicht vor (nur `[-]` flog heraus). Folge: Längst Erledigtes wurde voll eingepreist und lag weiter hell auf dem Pfad; im mitgelieferten Werkbaum-Plan zeichnete die Linie damit überwiegend fertige Arbeit nach. Und in einer Alternativgruppe hatte eine bereits realisierte Alternative keinerlei Kostenvorteil — der Pfad empfahl die nominell billigere, obwohl die Wahl längst getroffen und bezahlt ist. Ab jetzt kostet Erledigtes 0. Der Pfad beantwortet damit „was ist als Nächstes am günstigsten?" statt „was hätte der Plan von vorn gekostet?". - Schwelle bei `[x]` fertig: die Beförderung auf `[^]` ist keine Kostenfrage (das tut per D30 ein eigener Commit). - Angefangenes (`[~]`, `[/]`) zählt weiter voll — Bruchteile ordinaler Größen wären erfunden, und `[~]` heißt laut §4 gerade „Risiko hoch". - Maßgeblich ist der intrinsische Status: investiert ist investiert, auch wenn Abhängigkeiten den Knoten effektiv zurückhalten (D39). Verhindert nebenbei doppeltes Zählen — die Abhängigkeit steht mit eigenen Kosten selbst da. - Abgezogen werden nur die eigenen Kosten, nicht der Teilbaum. Darstellung: Erledigte bleiben `cheap` und behalten ihre volle Statusfarbe (grün/blau sagt schon „nichts mehr zu tun"), verlieren aber Stationspunkt und implizites M-Badge — Letzteres macht eine Kostenannahme sichtbar, und an einem erledigten Knoten wird keine getroffen. Station ist der tiefste noch OFFENE Knoten eines Zweigs (`hidesOpenCheap()` fragt den Teilbaum statt nur die direkten Kinder): Sind alle Kinder fertig, wird der offene Elternknoten selbst die Station. Der eingeklappte Knoten (D38) erbt dieselbe Verschärfung. Kein neuer Umschalter — der vorhandene ändert seine Bedeutung. Nachgemessen am Werkbaum-Plan: 110 Knoten auf dem Pfad (unverändert), Stationen 69 -> 24, und die 24 sind exakt die offene Front (Ticket-Referenzen, Öffnen/Speichern, Backend-Gerüst samt REST und Persistenz, Websocket-Transport, Text-CRDT, Mermaid-Layout, IDEA-Plugin). Linie wird weiter gezogen; Export und Druck folgen ohne Zusatzcode, sie lesen dieselbe `.node.cheap-leaf`. 236 Tests grün, davon 14 neue (tests/frontier.test.js). Der Snapshot des kanonischen Beispiels ändert sich um genau zwei Knoten. SPEC §9, llms.md und ROADMAP/TASKS nachgezogen. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> |
||
|
mhoennigandClaude Fable 5
|
cbe798d746 |
feat: Faltmarken (>/<) — Teilbäume ein-/ausklappbar (SPEC §1/§9, D38)
Parser liest die Marke zwischen Zeichen und Statusbox (Leerraum-Regel, `- >Achtung` bleibt Label); den Anfangszustand rechnet initialCollapsed() in model.js: `>` klappt ein, `<` (und die Fokusmarke !!!) holt seinen Teilbaum hervor, indem die Faltung die Pfad-Ebenen hinunterwandert — Geschwister stehen als einzelne eingeklappte Knoten da, jede Kante bleibt eine echte. Im Diagramm: Falt-Zeichen ▾/„▸ n" vor dem Label (n = alle verborgenen Knoten), Klick oder ←/→ am fokussierten Knoten klappt um; Eingriffe je Label-Pfad, nur für die Sitzung, Dokumentwechsel setzt zurück. Eingeklappte Kinder werden nicht gerendert (Export, Messungen, Pfadlinie automatisch konsistent), ihre Warnungen aber weiter gemeldet. Export/Druck: „▸ n" bleibt, das ▾ offener Knoten fällt weg. Legende + a11y in allen 9 Sprachen; SPEC-§11-Abschnitt in §1/§9 überführt; 15 neue Tests (tests/fold.test.js), Snapshots aktualisiert. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> |
||
|
mhoennigandClaude Opus 4.8
|
091e8849d8 |
frontend: optionale Abzweige gestrichelt + Stiel trifft die Knotenmitte
Zwei Nachbesserungen aus dem ersten Blick auf `+` (D29). **Gestrichelter Abzweig.** Der hohle Kreis allein war zu leise. Der Einwand gegen einen dritten Linienstil bleibt richtig, greift aber nicht so weit wie gedacht: Gestrichelt wird NUR der Abzweig zum Knoten (nicht die Sammelleiste — die gehört der ganzen Gruppe) und zwar in TINTE, während die any-of-Linien gestrichelt in Grau sind. Entscheidend ist, dass beide sich nie am selben Verteiler treffen können: | darf nach SPEC §3 nicht mit -/+ gemischt werden. Der Kreis bleibt zusätzlich — er sagt, WELCHER Knoten gemeint ist. Umgesetzt an den vorhandenen Pseudoelementen, ohne neue Zeichenebene: im Fächer der senkrechte Stiel (border-left von ::after, beim letzten Kind border-right von ::before), gestapelt der waagerechte Ast (border-top von ::before); die jeweils andere Kante ist die Leiste und bleibt durchgezogen. Dafür braucht auch das <li> die Klasse `opt` — den Abzweig zeichnet es, nicht der Knoten. Der SVG-Export zieht mit (dash || isOpt). **Stiel trifft die Knotenmitte auch waagerecht (`--stem-x`).** Dabei fiel ein älterer Fehler auf, gemeldet als „die Linie zu Wahl trifft den Knoten nicht": Im horizontalen Fächer lief der Stiel zu einem Knoten mit any-of-Kindern neben dem Knoten vorbei (gemessen 13,4 px). Dieselbe Verwechslung, die D10 senkrecht schon behoben hat, nur in der anderen Achse — der Stiel saß bei 50 % der ZELLE, und das ist nur die Knotenmitte, solange der Knoten darin zentriert steht. `li.has-or` ist aber flex-start (der Knoten steht links, damit die any-of-Sammelleiste unter ihm aufsetzt), und die Zelle ist so breit wie der Teilbaum. Rein in CSS nicht lösbar: gebraucht wird die Knotenbreite, und kein Selektor macht sie einer Elternregel zugänglich (Anchor Positioning ist Chrome-only). `alignStems()` misst deshalb nach jedem render() und in applyLayout() die Knotenmitte der betroffenen Zellen und setzt `--stem-x`; die Pseudoelemente rechnen über left:var(--stem-x, 50%) bzw. right:calc(100% - var(--stem-x, 50%)). Der Rückfallwert 50 % hält alle übrigen Zellen ohne Messung richtig, die transponierten Modi setzen left/right ohnehin fest. Messwerte werden wie in drawCheapPath() durch `zoom` zurückgerechnet. Verifiziert: Vitest 60/60 (2 neue Tests: `opt` auch am <li> neben dem Gate der eigenen Kinder; <li> ohne Attribut, wenn weder Kinder noch optional). Im Browser gemessen: Abweichung Stiel↔Knotenmitte bei „Wahl" 13,4 px → 0,0 px, alle übrigen Zellen unverändert 0,0 px ohne gesetzte Variable. Angesehen in horizontal und kompakt: gestrichelter Ast in Tinte zum Kreis, Sammelleiste durchgezogen, deutlich unterscheidbar vom gestrichelt-grauen any-of-Ast daneben. SVG-Export gerendert geprüft: 2 von 9 Tinte-Linien gestrichelt, beide Kreise am Auftreffpunkt. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> |
||
|
mhoennigandClaude Opus 4.8
|
aa3e087ee6 |
notation: + für optionale Knoten — Zugaben statt Pflicht oder Alternative
Die Notation kannte nur „erforderlich" (-) und „wählbar" (|). Ein einzelnes zusätzliches Feature — weder nötig noch Alternative zu etwas anderem — musste als normales -Kind notiert werden und log damit. Feature-Modelle (FODA) unterscheiden seit den 90ern mandatory/optional/alternative; `+` ergänzt die fehlende zweite Beziehung. Mnemonik: `-` Teilpaket, `+` Zugabe, `|` Alternative. Anlass ist nicht die Optik, sondern der günstigste Pfad (D18): markCheapest() lief bei all-of über ALLE Kinder, jede Zugabe steckte also im errechneten Minimum — systematisch zu groß, und zwar umso mehr, je ehrlicher ein Plan auch die Kür notiert. Sichtbar wird es beim Alternativenvergleich: eine Alternative mit teurer Zugabe verlor gegen eine schlichtere, obwohl die Zugabe gar nicht dazugehört. - Parser setzt `optional:true` und lässt `type:'and'` stehen — `+` gehört zum Knoten, nicht zur Gruppe. Dadurch bleiben gateOf() und die mixedGate-Warnung unverändert richtig: sie meldet weiter genau dann, wenn | mit -/+ gemischt wird. `-` neben `+` ist erlaubt und still — „diese drei sind nötig, das hier wäre schön" ist der Normalfall, nicht der Fehlerfall. - Aus dem Pfad fallen optionale Knoten über pathChildren() heraus, die eine Stelle, die cheapestCost() und markCheapest() gemeinsam nutzen — deshalb wirkt es samt Teilbaum. - Darstellung: hohler Kreis mittig auf der Knotenkante, wo der Abzweig auftrifft (FODA-Konvention). Bewusst KEIN dritter Linienstil: im kompakten Modus codiert allein der Stil das Gate (D15), gepunktet müsste sich dort gegen gestrichelt-grau behaupten. Der Kreis ist orthogonal dazu. CSS-Grundfall ist gestapelt (links/50 %), Ausnahme der horizontale Fächer (oben/50 %), Rück-Ausnahme der gestapelte all-of-Teilbaum unter any-of (D18) — andersherum wären es vier Ausnahmen statt zwei. - SVG-Export zeichnet den Kreis NACH den Knoten (optMarks, Schritt 3a): er liegt halb außerhalb der Box und würde sonst vom Knoten-Rechteck überdeckt. - Legende, Knoten-Tooltip und aria-label in allen neun Sprachen; hint_root formuliert die neue Mischregel. Bekannte Schwäche, bewusst in Kauf genommen: Bei aktivem Pfad-Umschalter wird der optionale Knoten ausgeblasst (opacity:.32) — und mit ihm sein Kreis, der die Erklärung dafür wäre. `opacity` am Elternteil schlägt auf Pseudoelemente durch, das lässt sich nicht zurücknehmen. Das Zurücktreten ist hier die Hauptaussage (wie bei nicht gewählten Alternativen), Tooltip/aria/Legende liefern die Begründung nach. Verhaltensänderung: `+` am Zeilenanfang ist jetzt ein Zeichen und nicht mehr Teil des Labels (`+ 5 % Puffer` ergibt „5 % Puffer"). Test-abgedeckt. SPEC §1/§3/§9/§10 zuerst, dann Code (CLAUDE). Das kanonische Beispiel in §10 enthält jetzt eine `+`-Zeile und ist mit der Test-Fixture wieder deckungsgleich. Der mitgelieferte Werkbaum-Plan markiert Drucklayout, „Was ist neu?" und die Personenfarben als Zugaben — „Was ist neu?" war der Auslöser der Frage. Verifiziert: 12 neue Tests (Parser setzt optional/type; Status/Größe/Tags/URL am +-Knoten; führendes + wird verbraucht; Pfad lässt Zugabe samt Teilbaum aus; Kosten des Elternknotens ohne Zugabe; Alternativenvergleich ohne Zugaben; optionale Knoten bleiben sichtbar; opt-Klasse; keine Warnung bei -/+; Warnung bei |/+; aria-label). Vitest 58/58, Snapshot zeigt `node opt` OHNE `cheap`. Im Browser in allen drei Modi angesehen: Kreis sitzt in horizontal oben mittig, in vertikal und kompakt links auf halber Höhe, jeweils genau auf dem Ende des Abzweigs; SVG-Export enthält beide Kreise an denselben Punkten (gerendert geprüft, nicht nur im Quelltext). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> |
||
|
mhoennigandClaude Opus 4.8
|
1f6988b047 |
frontend: Sprung zwischen Diagramm und Text (beide Richtungen)
Knoten und Notationszeile sind nun verknüpft. Der Parser hängte die
Zeilennummer ohnehin schon an jeden Knoten — sie wandert jetzt als data-line
ins Markup.
- Diagramm -> Text: Alt+Klick markiert die ganze Zeile im Editor (Fokus,
in Sicht gescrollt); Tastatur Alt+Enter, Touch langer Druck (500 ms,
Wischen bricht ab). Ein zugeklapptes Editor-Panel wird zuerst geöffnet.
- Text -> Diagramm: der Knoten der Cursor-Zeile bekommt weißen Halo +
Tinte-Ring und wird beim Zeilenwechsel ins Bild gescrollt.
- Alt statt einfachem Klick, weil ein Knoten mit URL als <a> den ganzen
Kasten belegt (SPEC §6 bleibt unverändert). Der Handler ruft
preventDefault() — sonst lädt Alt+Klick auf einen Link das Ziel herunter.
Neuer Tooltip-Hinweis an jedem Knoten (i18n `jumpHint`, 9 Sprachen).
- Gescrollt wird über einen Spiegel-div, nicht über Zeilenhöhe x n: lange
Zeilen brechen weich um, die naive Rechnung lag im Test bei 60 Zeilen um
bis zu 525 px daneben.
Beim Verifizieren gefunden und behoben: `ul.or .node{box-shadow:none}` ist
spezifischer als `.node.current` und schluckte den Ring überall unterhalb
einer any-of-Gruppe — die Regel braucht den #out-Präfix.
Verifiziert im Browser (Alt+Klick auf <a>- und div-Knoten, Klick aufs
Größen-Badge, Klick/Enter ohne Alt unverändert, Alt+Enter, kurzer/langer
Druck und Wischen auf Mobil, Panel-Aufklappen aus dem minimierten Zustand,
Zeile nach Sprung immer im sichtbaren Band, Kommentar-/verworfene Zeilen
heben nichts hervor). Vitest 37/37 (3 neue data-line-Tests, Snapshots
aktualisiert). Dokumentiert als D25 + SPEC §9 + frontend/CLAUDE.md + README.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
|
||
|
mhoennigandClaude Opus 4.8
|
15699c321c |
frontend: Barrierefreiheit — aria-Labels, Fokusreihenfolge, Live-Region
TASKS Phase 2. Jeder Diagramm-Knoten bekommt in render.js (nodeAria) einen sprechenden, lokalisierten aria-label: Label + Status + Aufwand (inkl. „(angenommen)" beim impliziten M) + Zuständige + Link. Die rein visuellen Badges (Größe, Tags, ↗) sind aria-hidden, damit der Screenreader nicht „M", „anna", „↗" kryptisch doppelt vorliest. Neue a11y*-i18n-Keys in allen 9 Sprachen. Alle Knoten sind fokussierbar (tabindex=0 bzw. der Link) in Dokument-/Lese- reihenfolge; sichtbarer :focus-visible-Rahmen (Petrol). #warn ist eine Live-Region (role=status, aria-live=polite) — neue Warnungen werden angesagt. Verifiziert: aria-label folgt dem Sprachwechsel (DE/EN), Badges aria-hidden, keine visuelle Regression, keine Konsolenfehler. Renderer-Snapshots aktualisiert (29 Tests grün). SPEC §9 (Barrierefreiheit) + CLAUDE ergänzt. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> |
||
|
mhoennigandClaude Opus 4.8
|
5905712aa5 |
frontend: Renderer + Modell headless auslagern (src/model.js, src/render.js)
TASKS Phase 1. Baum-/Kostenlogik -> model.js (gateOf, needsBreakdown, visibleChildren, computeCheapSet, cheapCls), HTML-Erzeugung -> render.js (renderTreeHtml). Beide sind headless: UI-State (verworfene einblenden, günstigster Pfad) kommt als Parameter herein statt aus Globals; nur cheapPathOn bleibt UI-State in app.js. render() in app.js ist jetzt die dünne DOM-Anbindung. Snapshot-Tests (tests/render.test.js): Grundzustand, günstigster Pfad, verworfene einblenden, Geister-Knoten („Untergliederung fehlt"), plus die Zusicherung, dass der Renderer nie eine Modus-Klasse erzeugt (Modus = CSS-Container-Klasse in app.js -> ein Snapshot deckt alle drei Modi). 24 Tests grün. Byte-identisches Rendering im Browser verifiziert (18 Knoten, 6 Blätter, 3 Geister, Toggles ok, keine Konsolenfehler). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> |