Werkbaum hat kein Backend, und das eigentlich Schwere an gemeinsamem
Bearbeiten ist das Zusammenführen gleichzeitiger Änderungen — im Plan als
`[!] Merging simultaneous edits` markiert. Etherpad hat das gelöst. Also
geliehen statt nachgebaut: das Pad ist die Schreibfläche, Werkbaum die
Ansicht.
Nachgemessen an pad.hostsharing.net, bevor irgendwas gebaut wurde:
- der Klartext-Export sendet `Access-Control-Allow-Origin: *`,
- das kanonische Beispiel (SPEC §10) kommt byte-identisch zurück,
- der HTML-Export zeigt kein Listen-Markup — Etherpad deutet `-` nicht zur
Aufzählung um und behält die führenden Leerzeichen.
Das war das Risiko, das die Idee hätte erledigen können. Nicht geprüft ist
das Tippen im Etherpad-Editor selbst (Tab-Einrückung, mögliches
Auto-Bullet); dafür braucht es einen echten Browser.
Eigener Parameter statt `?sourceUrl=`: Die URL, die ein Mensch in der Hand
hat, ist die Pad-URL — `/export/txt` hängt Werkbaum selbst an. Vor allem
aber lizenziert der eigene Parameter das andere Verhalten, sodass D23
unangetastet bleibt: `sourceUrl` heißt weiter „statische Datei, einmal pro
Laden geholt", bestehende Links bekommen kein Polling. Name und id sind die
vollständige Pad-URL (Pad-Namen sind nur pro Instanz eindeutig).
Textfeld schreibgeschützt, Knopf öffnet das Pad: ohne das verschwände
getippter Text beim nächsten Abruf. Schrift bleibt Tinte statt grau — hier
wird gelesen, der Plantext ist der Hauptinhalt.
Drei Riegel im Takt, jeder aus einem echten Fehler:
- `padBusy` — im Netzwerk-Mitschnitt stapelten sich die Abrufe, weil die
Gegenseite langsamer war als der Takt; eine spät eintreffende alte
Antwort hätte neueren Text überschrieben,
- Abbruch nach 10 s — sonst bliebe der Riegel bei hängender Gegenseite für
immer zu,
- `visibilityState` + `visibilitychange` — nicht im Hintergrund abrufen,
aber bei Rückkehr sofort.
Der Stabilitätstakt übernimmt erst beim zweiten gleichen Abruf, sonst sieht
man die anderen mitten im Tippen.
Die Normalisierung der Pad-Adresse liegt headless in `remote.js`, damit sie
testbar ist (23 neue Tests, 60 -> 83). Im Vorschau-Browser meldet
`visibilityState` „hidden" und HMR lädt bei jeder Quelländerung neu — ein
Reload sieht wie eine geglückte Übernahme aus; nachgewiesen wurde die
Übernahme deshalb mit einem Marker auf `window`, der einen Reload nicht
überlebt.
SPEC §9 zuerst, dann D31, dann Code. Der Plan bekommt den Knoten nach D30
mit `[x]`, nicht `[^]`.
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>
Dokumente von außen (mitgeliefert D27, ?sourceUrl= D23) ändern sich, ohne dass
der Betrachter es merkt. Sie zeigen jetzt, was sich seit seinem letzten Besuch
getan hat.
- „Neu" heißt bewusst NICHT „Zeile hinzugefügt", sondern **neu in Produktion**:
ein Knoten trägt jetzt [^] und tat es in der zuletzt gesehenen Fassung nicht.
Ein Zeilendiff meldete vor allem Rauschen; die Nachricht, die zählt, ist was
live gegangen ist. Nebeneffekt: es leuchtet eine Handvoll Knoten, nicht dreißig.
- Basis ist die zuletzt GESEHENE Fassung je Dokument (`werkbaum-seen`), nicht
die letzte Auslieferung — wer Fassungen überspringt, sieht alles seither.
Fortgeschrieben wird erst beim Bestätigen, sonst wäre die Meldung nach einem
Neuladen weg, bevor sie jemand bemerkt. Beim Erstkontakt leuchtet nichts.
- Knoten-Identität ist der Label-Pfad, nicht die Zeilennummer: Umeinrücken und
Umsortieren erzeugen keine Falschmeldungen; gleichnamige Geschwister per
Index; Umbenennen gilt als neuer Knoten (der Text ist der Vertrag, D14).
- Darstellung: gelber Strahlenkranz nach außen, kein Blinken (WCAG 2.2.2/2.3.1;
Blinken zöge dauerhaft den Blick statt einmal zu melden). Außen, weil die
Füllung dem Status gehört (SPEC §4). Zusammen mit der Cursor-Zeile: Tinte
innen, Gelb außen. Nicht im Druck und nicht im Grafikexport — die Markierung
hängt am persönlichen Besuchsstand.
- Knopf im Diagramm-Kopf nur, wenn es etwas gibt; nennt die Anzahl, Klick
bestätigt. Kein Dauer-Umschalter.
- Bei selbst bearbeitetem mitgeliefertem Dokument wird nichts hervorgehoben —
dort fehlt die saubere Vergleichsbasis (D27).
Fehler beim Bauen, der zuerst durchrutschte: Die Menge wurde beim Laden aus
einem eigenen Parse-Durchlauf berechnet. Der Zähler stimmte, aber kein Knoten
leuchtete — `Set.has()` prüft Objektidentität, und die gerenderten Knoten kamen
aus einem anderen Parse. `render()` bildet die Menge jetzt bei jedem Durchlauf
aus den gerade geparsten Wurzeln; vorgehalten wird nur der geparste Basisbaum.
Verifiziert: 9 neue Modelltests (Statuswechsel, neuer [^]-Knoten, nicht-[^]
ignoriert, unverändert ignoriert, Erstkontakt leer, Umsortieren/Tabs ohne
Falschmeldung, gleiches Label unter verschiedenen Eltern, gleichnamige
Geschwister, verworfene). Im Browser: Erstkontakt setzt nur die Basis (Knopf
versteckt); zurückgedrehte Basis lässt genau die erwarteten Knoten leuchten
(Zähler 3, dann 1); Bestätigen räumt auf und überlebt das Neuladen; ohne
Bestätigen bleibt die Meldung über ein Neuladen stehen. Vitest 46/46.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Die Legende wurde abgeschnitten statt zu scrollen — obwohl `.hint` seit jeher
`flex:1 1 auto; min-height:0; overflow:auto` trägt.
Ursache: Chrome legt den Inhalt eines <details> in das Pseudo-Element
`::details-content`. Damit war `.hint` kein Flex-Kind von `.agenda` mehr, die
Begrenzung griff nicht und der Kasten wuchs auf seine Inhaltshöhe (gemessen
585 px in einem 282 px hohen Container) und wurde geclippt. Eine Regel für
`::details-content` wirkte im Test, ist aber Chrome-eigen — Firefox und Safari
kennen das Pseudo-Element nicht.
- Die Legende ist deshalb kein <details> mehr, sondern `div.agenda` +
`button.agenda-summary`; der Zustand hängt an der Klasse `open`
(`aria-expanded` am Button, `#legendBtn` und Splitter-Sichtbarkeit über
`setAgendaOpen()` synchron). `.hint` ist wieder echtes Flex-Kind und scrollt
in allen Browsern.
- Neuer Splitter `#hintGutter` im selben Idiom wie der große (Pointer-Capture,
Doppelklick setzt zurück): horizontal nebeneinander -> Breite `--hcol`,
gestapelt (side/mobil) -> Höhe `--hrow`. Beide getrennt gehalten und in
`werkbaum-ui` persistiert (samt Auf-/Zu-Zustand), damit ein Moduswechsel die
jeweils andere Aufteilung nicht zerstört. Grenzen 90 px bis 85 %.
- Die 85-%-Obergrenze steht zusätzlich als max-width/max-height im CSS: die
gespeicherte Größe ist ein fester px-Wert und würde den Editor sonst auf 0
drücken, wenn das Panel später schrumpft (großer Splitter, Drehung,
Bildschirmtastatur). Verifiziert mit --hrow:9999px -> gekappt bei 85 %.
- Nebenbei: der große Splitter war als einziges Bedienelement nicht lokalisiert
(fest deutsche title/aria-label). Beide teilen sich nun `gutterTooltip`,
dazu `gutterAria`/`hintGutterAria` — 9 Sprachen.
Verifiziert im Browser: Legende scrollt (247 px Fenster, 607 px Inhalt);
Ziehen in beiden Ausrichtungen inkl. Unter-/Obergrenze und Doppelklick-Reset;
`--hcol` und `--hrow` überleben den Moduswechsel; nach Neuladen sind
Auf-Zustand, Breite und beide Variablen wiederhergestellt; auf Mobil ist die
Summary-Zeile aus und der Kopf-Knopf steuert. Vitest 37/37.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Der Editor kann jetzt mehrere Notationstexte halten und zwischen ihnen
umschalten. Der Name des aktiven Dokuments ersetzt die feste Beschriftung
„Struktur (Text)" und öffnet als Dropdown den Wähler mit Wechseln, Neu,
Umbenennen und Löschen.
- Datenmodell (noch kein Backend): Dokumente als [{id,name,text}] in
localStorage (werkbaum-docs), aktives per id in werkbaum-active; der
aktive Text bleibt zusätzlich in werkbaum-src gespiegelt.
- Migration verlustfrei: fehlt werkbaum-docs, wird der bestehende Einzeltext
(oder INITIAL) in ein Dokument gepackt. Reset und Löschen des letzten
Dokuments säen das Beispiel neu.
- Jedes Dokument ist nur Text + Name (kein Strukturformat, D14) —
vorwärtskompatibel zum geplanten Backend (D13). Ansichts-State (Modus,
Zoom, Aufteilung) bleibt global.
- i18n in allen 9 Sprachen; Doc-Namen bleiben Nutzerdaten (nicht übersetzt).
- Dokumentiert als ADR D22 (DECISIONS.md) + frontend/CLAUDE.md.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Texte unter dem Titel angepasst, um Work Breakdown Structure (PSP/WBS) und
Lean Pathfinding gleich prominent zu zeigen. Feature-Tree nur erwähnt, wenn
Platz ist. Kurzversionen auf Mobile: „PSP · Lean Pathfinding Editor".
Alle 9 Sprachen angepasst (DE/EN/ES/FR/PL/RU/HI/ZH/JA).
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
- Zoom-Controls collapse automatisch nach 3 Sekunden Inaktivität
- Toggle-Button mit Lupe+Plus-Symbol zum Expandieren der Controls
- Position weiter nach rechts-unten verschoben (6px)
- Event-Delegation für zuverlässige Click-Erfassung
- Lazy-Loading der DOM-Elemente für robuste Initialisierung
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
Attached the `aria-labelledby` attribute to the editor textarea and added an ID to the editor title. Corrected the relative path for the script reference.
IBM Plex Sans and Mono are now embedded locally (`woff2`) under `src/fonts`, licensed under SIL OFL 1.1. Removed external `<link>` to Google Fonts for enhanced privacy and compliance. Updated `style.css` with `@font-face` and unicode ranges for `latin` and `latin-ext` subsets. Added license details to documentation.
"Claude Code" bleibt als Produktname unveraendert. Der Credit ist hartkodiert
(kein data-i18n) und damit wie zuvor sprachunabhaengig englisch — keine
Uebersetzungen betroffen.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
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>
Erster Schritt der Modularisierung (ROADMAP „tragfähige Codebasis",
TASKS Phase 1). Der bisher einzelne index.html-Prototyp wird zur Vite-App:
- CSS -> src/style.css, gesamtes JS -> src/app.js (noch als ein Modul;
Parser/Renderer werden in den folgenden Checkboxen herausgelöst).
- index.html ist der Vite-Entry (<script type="module" src="/src/app.js">).
- npm run build (vite + vite-plugin-singlefile) inlint JS+CSS+Favicon (als
data:-URI) in EINE self-contained dist/index.html -> bleibt file://-tauglich.
- Vitest als Testrunner eingerichtet (tests/, passWithNoTests bis Schritt 2/3).
- Pages-Workflow: Node + npm ci + npm test + npm run build, deployt dist/;
Favicon-sed entfällt (inline), nur ../LICENSE + Footer-Version bleiben.
- .claude/launch.json auf Vite-Dev-Server (Port 8137) umgestellt.
Entscheidung als D19 dokumentiert (weicht D11 „kein Build-Zwang" bewusst auf,
hält aber D16 file://-Versprechen über die gebündelte Datei). README (de/en)
und frontend/CLAUDE.md um Dev-/Build-/Test-Workflow ergänzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Auf dem Smartphone hatte der Splitter zwei Fehler: nach dem ersten Ziehen
rastete er in eine feste Aufteilung und ließ sich nicht mehr bewegen (die
Titelzeile im Snap-Rand fing jeden weiteren Zug ab), und das Tippen auf eine
Titelzeile klappte das Panel nicht mehr aus (der Handler verlangte den
collapsed-Zustand, den ein freier Zug aufhob).
Mobil jetzt kontinuierlich statt diskret:
- Grid-Zeilen-Minima --pmin-d/--pmin-e = gemessene Kopfhöhen (syncPanelMins),
dadurch bleiben beide Titelzeilen immer stehen (kein Snap/Collapse).
- Gutter-Drag ruft setMobileDrow() (klemmt --drow frei) — jederzeit beweglich.
- Tipp auf eine Titelzeile maximiert dieses Panel (das andere = Titelzeile).
- applyLayout ruft auf Mobil kein applySplit (behält --drow bei Moduswechsel);
seg-Klick stoppt Propagation, damit er die Titelzeile nicht mit-maximiert.
- Default: Diagramm maximiert. Desktop behält das diskrete Modell + Buttons.
SPEC §9, DECISIONS D17 und frontend/CLAUDE.md nachgeführt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Auf kleinen Screens brach die Diagramm-Titelzeile um, weil die Download-Buttons
mit „SVG“/„PNG“-Textlabels zu breit sind. Sie klappen jetzt auf Mobil hinter
einen einzelnen Download-Icon zusammen (dlGroup/dlTrigger/dlmenu); ein Tipp
zeigt die Formatwahl als Dropdown-Overlay unter der Kopfzeile, Auswahl oder
Tipp daneben schließt. „Kopieren“ bleibt sichtbar. Desktop unverändert (SVG/PNG
inline). Neuer i18n-Key downloadMenu (9 Sprachen), SPEC §9 nachgeführt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Im vertikalen Modus zentriert li.has-and den Alternativknoten (z. B. „Web+Nativ")
vertikal mittig zu seinem Rechts-Fächer; der einkommende any-of-Abzweig saß aber
weiter bei 23 px und traf den Knoten nicht mehr — er war von seiner Linie von
oben abgetrennt. Fix nur für .tree.vertical ul.or>li.has-and: symmetrisches
Padding hält die Knotenmitte bei 50 %, Abzweig (::before) und Rail-Endkante
(:last-child::after) auf 50 %. Horizontal/kompakt unberührt. D18 nachgeführt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
100dvh versagt bei Browsern, die ihre untere Leiste als Overlay zeichnen
(z. B. Brave): dvh meldet weiter die volle Höhe, Footer/Editor-Titelzeile
verschwinden dahinter. JS setzt nun --app-height aus window.visualViewport
.height (wirklich sichtbare Fläche), aktualisiert bei resize/orientationchange.
CSS-Kaskade bleibt Fallback: vh -> dvh -> var(--app-height).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Auf Mobilgeräten ist 100vh die große Viewport-Höhe inkl. der Fläche hinter der
unteren Browserleiste — Footer und die eingeklappte Editor-Titelzeile rutschen
dahinter und sind nicht antippbar. 100dvh (dynamische Viewport-Höhe) folgt der
sichtbaren Fläche; 100vh bleibt als Fallback für alte Browser.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- eingeklappt zeigt die Leiste nur noch die aktive Sprache (kein EN-Default,
kein „…“); ein Tipp klappt die volle Liste als Overlay über die Kopfzeile auf
(position:absolute, z-index) statt die Zeile zu verbreitern
- nach Auswahl klappt sie wieder auf die gewählte Sprache ein; Tipp daneben
schließt ebenfalls; applyMobile() startet eingeklappt
- nur body.mobile betroffen; Desktop (DE EN ES FR + „…“, inline) unverändert
- SPEC §9 (Kleiner Bildschirm) und DECISIONS D17 nachgeführt
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- gestrichelte, geschwungene Petrol-Linie (Katmull-Rom) durch die Endknoten
des Pfads; kräftig hinter den Knoten, abgetönte Kopie davor
- blasse, große Stationspunkte nur an echten Blättern (U-Bahn-Plan) — macht
durchquerte Fremd-/Zwischenknoten eindeutig als "nicht Endknoten" erkennbar
- Linie + Punkte auch im SVG/PNG-Export (hinten/vorne-Schichtung)
- Overlays liegen in #out, erben dessen CSS-zoom (Punkte /zoom umgerechnet);
Neuzeichnung nach render() und applyLayout()
- Beispiel erweitert: Frontend (M) -> PWA | Web+Nativ (Web[/]+Android+iOS)
- Layout-Fix: all-of unter einer any-of-Alternative wird nur horizontal schmal
transponiert gestapelt (ul.or>li.has-and>ul.and), sonst schob der breite
Fächer Alternativknoten und Elternbaum weit nach rechts
- Geist-Knoten-Label "Untergliederung fehlt" -> "…" (alle 9 Sprachen), die
Erklärung bleibt im Tooltip; der lange Text verbreiterte gestapelte Zellen
- SPEC §5/§9 und DECISIONS D18 nachgeführt, Notiz in frontend/CLAUDE.md
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- Umschalter im Diagramm-Kopf (Default an, Zustand in werkbaum-ui persistiert)
- nötige Knoten: all-of ⇒ alle Kinder, any-of ⇒ günstigste Alternative
(kleinste rekursive Kosten; Gleichstand ⇒ erste); verworfene zählen nie mit
- Darstellung per Inversion: nicht benötigte Knoten treten blass/entsättigt
zurück (kein Zusatzrahmen an den ohnehin dichten Knoten-Ecken)
- fehlende T-Shirt-Größe wird für die Kostenschätzung als M gewertet;
invertiertes M-Badge (weiß mit Petrol-Rand) macht die Annahme sichtbar
- neue Tooltips i18n (DE-Quelle + 8 Übersetzungen, 50 Keys × 9)
- SPEC §9 (Günstigster Pfad) und DECISIONS D18 mitgeführt
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Im Footer sind "Werkbaum" und die Versionsnummer jetzt zwei Links:
- "Werkbaum" -> Repo-Startseite (wie bisher).
- Versionsnummer (<a class="ver">) -> exakt der deployte Commit.
CI setzt beim Build sowohl den Versionstext als auch den href der
ver-Anchor: COMMIT_URL=.../commit/$(git rev-parse HEAD); zwei gezielte
seds (href + Text). Lokal zeigt die Version "1.0" und verlinkt die
Commits-Uebersicht als Fallback.
Verifiziert: YAML gueltig; Trockenlauf ersetzt href -> commit/<sha> und
Text -> 1.0.7, "Werkbaum"-Link unveraendert. Preview lokal: Name -> Repo,
Version -> /commits/main.
Doku: README (EN+DE) Deployment + DECISIONS D16 ergaenzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Verifiziert: .site-footer margin-top jetzt 14px. Gilt auf allen
Bildschirmen. Keine SPEC-Aenderung.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Der Untertitel nennt jetzt auch Requirements(-Baum) — analog zur
Meta-Description. Fuer kleine Bildschirme gibt es eine garantiert
einzeilige Kurzfassung (neuer i18n-Key subtitleShort, 9 Sprachen): zwei
Spans (.sub-full/.sub-short), per body.mobile umgeschaltet; zusaetzlich
white-space:nowrap + ellipsis als Sicherung gegen Umbruch.
Verifiziert (headless): Desktop zeigt die Langfassung mit Requirements,
375px zeigt die Kurzfassung einzeilig ohne Overflow in allen geprueften
Sprachen (de/en/es/fr/ru/ja); i18n konsistent (48 Keys x 9). Normalgroesse
unveraendert (Kurzfassung nur mobil).
SPEC §9 (Kleiner Bildschirm) ergaenzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Der breite Schalter mit Text wird ein schmaler Druck-Button (29px statt
Schalter+Label): Symbol = gestrichelte Box mit Durchstreichung (spiegelt
den verworfenen Knoten), aria-pressed als Ein/Aus-Zustand (gedrueckt =
petrol gefuellt), Erklaerung per Tooltip (discardedTooltip). Ersetzt die
Checkbox #showc; Zustand jetzt ueber aria-pressed (discardedShown/
setDiscarded), unveraendert in Filter, Speichern und Wiederherstellen.
Verifiziert (headless): Button toggelt aria-pressed + Petrol-Fuellung,
blendet verworfene Knoten ein/aus, Zustand ueberlebt Reload. Gilt auf
allen Bildschirmen (spart auch mobil Platz).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Der #legendBtn (nur auf kleinem Bildschirm sichtbar) trug ein Menue-/
Listen-Icon; die Legende ist aber eine Hilfe-/Referenzseite. Jetzt ein
Hilfe-Icon (Kreis mit Fragezeichen). Nur der Button-Inhalt geaendert,
Normalgroesse nicht betroffen (Button dort verborgen).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Auf body.mobile zeigt der horizontal/kompakt/vertikal-Waehler nur noch das
aktive Icon (label:has(input:checked)); Tippen schaltet reihum zum naechsten
Modus (horizontal -> kompakt -> vertikal -> …). Spart zwei Drittel Breite.
Verifiziert (headless): mobil ein Icon sichtbar (~40px), 3x Tippen zyklt
horizontal/kompakt/vertikal/horizontal; Desktop unveraendert (3 Icons,
~118px, Direktauswahl ohne Zyklus), keine Konsolenfehler.
SPEC §9 (Kleiner Bildschirm) ergaenzt. Normalgroesse nicht betroffen.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Der Gutter wurde auf Mobil faelschlich ganz ausgeblendet. Jetzt bleibt er
sichtbar und ziehbar (die 820-px-Regel liefert das gestapelte Layout inkl.
Gutter); nur die Min/Normal/Max-Buttons bleiben verborgen. Default weiterhin
ein Bereich gross, Umschalten per Titelzeilen-Tap unveraendert, zusaetzlich
Teilen per Ziehen moeglich.
Verifiziert (headless, 375px): Gutter sichtbar, Ziehen erzeugt Custom-Split
(--drow gesetzt, beide Bereiche sichtbar); Default-Einzelansicht und
winbtns-verborgen unveraendert. Normalgroesse nicht betroffen.
SPEC §9 und DECISIONS D17 an "Splitter bleibt" angepasst.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Der Default-Beispieltext (INITIAL) ist jetzt englisch (passend zur
englischen Haupt-README). Statt "Cloud" nun "Cooperative Community Cloud"
mit Link https://hostsharing.net (nackte URL -> klickbarer Knoten mit ↗).
README-Screenshot neu erzeugt (englische UI + Inhalt).
SPEC §10 (kanonisches Fixture) bleibt bewusst deutsch: normatives
Beispiel der deutschsprachigen Doku, unabhaengig vom Live-Demo-Text.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Auf kleinem Bildschirm (body.mobile per matchMedia, <=640px):
- Immer nur ein Bereich gross (Diagramm ODER Editor); der andere schrumpft
auf seine Titelzeile und dient als Umschalter (Antippen holt ihn nach
vorn). Splitter und Min/Normal/Max-Buttons entfallen.
- Legende von der Bereichs-Umschaltung entkoppelt: eigener Umschalter
(#legendBtn) im Editor-Kopf statt der dauerhaften "AGENDA"-Zeile, damit
sie zugeklappt keinen Platz kostet (neuer i18n-Key legendTooltip, 9 Spr.).
- Sprachwahl schlank: nur EN + aktive Sprache + "…" (klappt alle auf); die
aktive Sprache wird auch als "extra" eingeblendet, Auto-Aufklappen entfaellt.
- Default Vollbild auf Mobil (nur ohne gespeicherte Nutzerwahl).
Verifiziert (headless, 375px): body.mobile gesetzt, Diagramm-Default +
Editor als Titelzeile, Umschalten per Tap, Legenden-Toggle, Sprachleiste
DE+EN+…/Aufklappen zeigt alle 9/aktives Extra bleibt sichtbar, Vollbild an,
keine Konsolenfehler; Desktop unveraendert (beide Panels, 4 Sprachen,
Legendenbutton verborgen). i18n konsistent (47 Keys x 9).
SPEC §9 (Kleiner Bildschirm) + DECISIONS D17 + frontend/CLAUDE.md ergaenzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
In den transponierten Modi ueberlappte das Groessen-Badge (oben rechts)
eines Knotens oft mit den Namens-Tags (unten rechts) des Knotens darueber
(gemessen: nur 10 px Luecke, 6 px Ueberlappung). Jetzt +20 px Abstand
nach unten fuer gestapelte Blaetter/any-of/kompakt (Luecke 25 px, ~9 px
Freiraum); der obere 23-px-Abzweig bleibt unveraendert. Vertikal
zentrierte all-of-Zwischenknoten bekommen den Abstand symmetrisch (16 px),
damit ihr 50%-Abzweig auf der Knotenmitte bleibt.
Verifiziert (headless): keine Ueberlappung mehr; alle Abzweige treffen die
Knotenmitte (|delta| <= 1 px) in vertikal und kompakt. Horizontal
unveraendert. SPEC §9 (Geometrie-Invarianten) ergaenzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
"Vibe-Coded with Claude Code Fable 5 and Opus 4.8" wird zu
"Vibe-Coded with Claude Code"; "Fable 5 and Opus 4.8" steckt als
title-Tooltip im span.vibe (gepunktete Unterstreichung, cursor:help).
Spart Platz auf allen Bildschirmen. Keine SPEC-Aenderung.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Ohne Backend bleiben Einstellungen und Text ueber ein Neuladen erhalten
(localStorage). Gespeichert: Editortext (werkbaum-src) und GUI-Zustand
(werkbaum-ui: Modus, verworfene, Split-Zustand inkl. freier Drag-Groesse
--col/--drow, Zoom, Vollbild); Sprache bleibt in werkbaum-lang.
saveUI()/saveSrc() haengen an allen Zustandsaenderungen (Layout, Toggle,
Fenster-Buttons, Splitter-Drag, Zoom, Vollbild, Texteingabe);
restoreState() stellt beim Laden alles wieder her und unterdrueckt
waehrenddessen ueber restoring=true das Zurueckschreiben. Fehlender Text
faellt auf das Beispiel (INITIAL) zurueck, ein leerer bleibt leer.
Verifiziert (headless): Text, Modus, verworfene, Zoom, Vollbild,
Custom-Split (--col) und Minimier-Zustand ueberstehen ein Reload;
keine Konsolenfehler. Keine SPEC-Aenderung (Notation unberuehrt);
localStorage-Schluessel in frontend/CLAUDE.md dokumentiert.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Link auf https://michael.hoennig.de/imprint.html am Ende des Footers.
Neuer i18n-Key "imprint": deutsch nur "Impressum", in allen anderen
Sprachen die uebersetzte Bezeichnung mit "(Impressum)" in Klammern
dahinter (z. B. EN "Imprint (Impressum)", FR "Mentions legales
(Impressum)"). Keine SPEC-Aenderung (Notation unberuehrt).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
LibreOffice liest weder das Browser-Bild-Clipboard noch das SVG zuverlässig.
Neben dem SVG-Download gibt es daher jetzt einen zweiten Button, der das
Diagramm als PNG-Datei (werkbaum-diagramm.png, Raster) speichert — überall
per "Bild einfügen" importierbar. Beide Download-Buttons tragen ein
Format-Label (SVG/PNG). Tooltip in allen neun Sprachen; SPEC §9 ergänzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
LibreOffice Writer erkennt das Browser-Bild-Clipboard nicht zuverlässig
(sein HTML-Filter ignoriert data-URI-Bilder, und die Async-Clipboard-API
erlaubt kein SVG als Bildtyp). Neue Download-Schaltfläche im Diagramm-Kopf
speichert das Diagramm als eigenständige SVG-Datei (Vektor), die per
Einfügen → Bild überall zuverlässig importierbar ist. Der bisherige
PNG-Clipboard-Button bleibt für Apps, die ihn lesen. Tooltip in allen neun
Sprachen; SPEC §9 ergänzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Zwei weitere aufklappbare Sprachen hinter dem "…"-Umschalter mit
vollständigen UI-Übersetzungen (inkl. Diagramm-Tooltips). Reihenfolge:
de en es fr pl ru hi zh ja …. LANG_EXTRA und CLAUDE.md-Konvention ergänzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Statt bündig am Fensterrand bleibt im Vollbild links/rechts ein 7-px-Rand
(halber Panel-Zwischenraum von 14 px), damit die Panels nicht gedrängt
wirken.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Das Diagramm wird bewusst als PNG kopiert. Zusätzlich zum image/png-Flavor
wird eine text/html-Variante mit eingebettetem PNG geschrieben, die
Office-Programme wie LibreOffice Writer bevorzugt einbetten — damit ist das
Bild dort einfügbar. Der Tooltip nennt jetzt das Format ("PNG-Bild in die
Zwischenablage"). SPEC §9 entsprechend ergänzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Der Diagramm-Kopieren-Button liefert nun ein grafisches Format statt Text:
Das gerenderte Diagramm wird aus der Live-Geometrie in ein eigenständiges
SVG (nur Formen + Text, keine externen Ressourcen) nachgezeichnet und als
PNG in die Zwischenablage gelegt. Knotenfarben, Größen-Badges, Tags und der
Geister-Knoten werden übernommen; Verbindungslinien je Gate neu gezogen
(und = durchgezogen Tinte, oder = gestrichelt Grau) und treffen so in allen
Modi die Knoten. Fallback: SVG-Quelltext, wenn kein Bild-Clipboard verfügbar.
Der bisherige ASCII-Text-Export (treeToText, CODE_BY_KEY) entfällt.
Tooltip-Texte auf "als Bild" aktualisiert, SPEC §9 entsprechend ersetzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Erklärt in allen sieben Sprachen die Regel aus SPEC §5: ab T-Shirt-Größe M
sollte ein Element weiter untergliedert werden.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Erklärt in allen sieben Sprachen, dass der Schalter verworfene Knoten
samt Teilbaum ein-/ausblendet.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Neuer Icon-Toggle in der Kopfzeile (links vom Sprachumschalter). Aktiv
entfernt er linken/rechten Rand und die 1200px-Maximalbreite von Kopf,
Panel-Bereich und Fußzeile, sodass die Panels die ganze Fensterbreite
nutzen. Tooltip in allen sieben Sprachen.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Der Markentitel erklärt per Tooltip die Wortbedeutung („Werk-Baum" — der
WBS-/Projektstrukturbaum) in allen sieben UI-Sprachen.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
In der zentrierten vertikalen Darstellung sind all-of-Zwischenknoten selbst
vertikal mittig zu ihrem Teilbaum. Der Abzweig war jedoch fest auf 23 px
verankert und lief daher bei diesen Knoten ins Leere. Abzweig und die Enden
der Sammelleiste zielen für all-of-Kinder nun auf 50 % (Knotenmitte);
Blatt- und Any-of-Kinder bleiben bei 23 px. Verifiziert: alle Abzweige
treffen ihren Knoten.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Die aufklappbaren Sprachen (PL/RU/HI) erscheinen nun vor dem "…"-Button,
sodass dieser am rechten, gerundeten Ende der Sprachleiste bleibt und
das Auf-/Zuklappen dort stattfindet.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Der Sprachumschalter zeigt DE/EN/ES/FR direkt; ein "…"-Button klappt
Polnisch, Russisch und Hindi auf. Ist eine dieser Sprachen aktiv (auch
per gemerkter Auswahl), öffnet sich der Bereich automatisch. Vollständige
Übersetzungen aller UI-Texte inkl. Diagramm-Tooltips für PL/RU/HI.
Wurzel-CLAUDE.md-Konvention entsprechend ergänzt.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
mhoennig