Commit Graph
13 Commits
Author SHA1 Message Date
mhoennigandClaude Opus 4.8 506bdccd2e frontend: Ein-Bereich-Ansicht + kompakte Legende/Sprachwahl auf Mobil
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>
2026-07-21 14:14:31 +02:00
mhoennigandClaude Opus 4.8 ac81f0a209 frontend: Mehr Abstand zwischen gestapelten Knoten (vertikal/kompakt)
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>
2026-07-21 14:04:30 +02:00
mhoennigandClaude Opus 4.8 340c7e7195 frontend: Zweiter Download-Button für PNG (neben SVG)
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>
2026-07-21 13:03:15 +02:00
mhoennigandClaude Opus 4.8 8d35611f4c frontend: Diagramm als SVG-Datei herunterladen (LibreOffice-tauglich)
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>
2026-07-21 12:56:17 +02:00
mhoennigandClaude Opus 4.8 508de56628 frontend: Diagramm-Copy als PNG + text/html-Flavor (LibreOffice-lesbar)
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>
2026-07-21 12:44:47 +02:00
mhoennigandClaude Opus 4.8 57fb72cbe4 frontend: Diagramm als Bild (PNG) in die Zwischenablage kopieren
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>
2026-07-21 12:39:56 +02:00
mhoennigandClaude Opus 4.8 6e33591b84 frontend: Diagramm als Text-Baum in die Zwischenablage kopieren
Neue Icon-Schaltfläche im Diagramm-Kopf exportiert die sichtbare Struktur
als einfachen, überall einsetzbaren ASCII-Baum: ├─/└─ für all-of,
├◇/└◇ für any-of-Alternativen, je Knoten [Status] Label (Größe) @tags.
Respektiert den verworfene-Filter. Clipboard-Logik in writeClipboard/
flashCopied ausgelagert und von beiden Kopieren-Buttons genutzt.
SPEC §9 um den Textexport ergänzt.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-21 12:16:09 +02:00
mhoennigandClaude Opus 4.8 7aa33220ff frontend: Vertikale Darstellung als zentrierten LR-Baum
Der vertikale Modus zeigt all-of jetzt als exakt transponierten
Organigramm-Fächer: der Überknoten sitzt vertikal mittig zu seiner
Kindergruppe, die Verbindung tritt rechts auf halber Höhe aus und
verteilt über eine Sammelleiste (erste bis letzte Kindmitte) auf die
Kinder. Horizontal und kompakt bleiben unverändert. SPEC §9 angepasst.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-21 12:03:41 +02:00
Michael HoennigandClaude Opus 4.8 a69d51b908 frontend: Darstellungs-Umschalter mit Icons statt Text
Segment-Buttons zeigen jetzt schematische Baum-Icons in der Reihenfolge
horizontal · kompakt · vertikal, jeweils mit Tooltip (title) und
aria-label. SPEC §9 entsprechend ergänzt.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-21 11:24:44 +02:00
Michael HoennigandClaude Opus 4.8 593f81e50b frontend: T-Shirt-Größen-Badge in Petrol
Größen-Badge (oben rechts am Knoten) von dunkler Tinte auf Petrol (--or)
umgestellt, weiße Schrift bleibt. SPEC §5 angepasst.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-21 10:36:57 +02:00
Michael HoennigandClaude Opus 4.8 b8cddffd4c frontend: Warn-Umrandung an unzerlegten M+-Knoten entfernen
Der Geister-Knoten "Untergliederung fehlt" darunter genügt als Hinweis;
die zusätzliche gestrichelte orange Umrandung des Knotens war doppelt.
Die needs-Klasse wird nicht mehr vergeben. SPEC §5 angepasst.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-21 10:36:24 +02:00
Michael HoennigandClaude Opus 4.8 20b9d89f88 frontend: Darstellung horizontal/vertikal/kompakt + graue Any-of-Linien
Der bisherige „vertikal"-Toggle wird zur dreistufigen Auswahl
„horizontal / vertikal / kompakt", die zugleich das Seitenlayout wählt:

- horizontal: Diagramm oben, Editor unten (je volle Breite), Agenda
  rechts im Editor aufklappbar.
- vertikal: Editor links, Diagramm rechts; „all of" tritt rechts aus.
- kompakt: wie vertikal, aber „all of" läuft nach unten (spart Breite);
  Gate nur noch über den Linienstil codiert.

Zusätzlich wird das Petrol im Diagramm aufgegeben: any-of-Linien
(Sammelleiste und Abzweige) sowie der Rahmen der Alternative-Knoten sind
in allen Modi durchgehend gestrichelt bzw. grau (#6B7A8C). all-of bleibt
durchgezogen in Tinte. Petrol nur noch für UI-Akzente und das Logo.

Doku nachgezogen: SPEC §9 (Linienführung, drei Modi), DECISIONS D15,
frontend/CLAUDE.md.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-21 10:30:56 +02:00
Michael Hoennig ded894a4da initial, vibe-coded version, mostly frontend 2026-07-21 09:55:30 +02:00