Vier Sackgassen, zwei Kacheln namens "Chat" -- und eine Seite ohne Kopf

Durchgang durch die Team-Dogi-Seiten aus der Sicht von jemandem, der
sie zum ersten Mal sieht. Alles hier ist am Code belegt und nachgemessen.

1. "KLINGELT NICHTS?" WARF ALLE DREI TEAM-ROLLEN AUF DIE STARTSEITE.

anruf-probe.html erklaert, WARUM das Telefon stumm bleibt. Sie steht in
der Rechtetafel offen, und aus dem Chat zeigen zwei Knoepfe darauf. Nur
hatte sie nie eine Kachel -- absichtlich, sie ist kein Bereich. Seit die
Adressregel vom 15.09. eine Kachel VERLANGT, landete jeder Klick wortlos
auf start.html.

Das ist die schlimmste Sorte Sackgasse: Man ruft sie auf, WEIL schon
etwas nicht geht, und sie wirft einen hinaus.

Mit derselben Zeile geheilt: Die Hinweisleiste wirft jeden Hinweis weg,
dessen Ziel es auf dieser Adresse nicht gibt -- "Bei dir klingelt nichts"
wurde auf crew deshalb NIE angezeigt. Ausgerechnet der Hinweis, der acht
von elf Leuten betrifft.

2. UND DIESE SEITE HATTE GAR KEINE GESTALTETE KOPFLEISTE.

.kopfleiste, __zurueck, __mitte, __titel stehen in KEINER Stilvorlage --
sie leben in start.css, die diese Seite absichtlich nicht laedt. Die
Leiste war nackter Text. Auf einer Seite, die man im Stoerfall aufruft,
sieht unfertig aus wie kaputt. Jetzt im <style>-Block der Seite, aus
demselben Grund wie ihr uebriges CSS.

3. EIN MODI KAM NICHT AN SEINE EIGENE AUSWERTUNG.

entwicklung.html und werdegang.html haben BEIDE eine ausgearbeitete
Eigensicht, und die Rechtetafel laesst ihn hinein. In seiner Kachelliste
stand keine von beiden -- der Weg existierte fuer ihn nicht. Die ganze
Eigensicht war toter Code, ausgerechnet fuer den, fuer den sie ist.
Mein eigener Fehler vom Vortag.

Zwei eigene Kacheln in "Fuer dich", aus den Leitungskacheln abgeleitet.
Sie loesen zugleich eine Namenskollision: Bis heute setzten BEIDE Seiten
fuer ihn die Ueberschrift "Deine Entwicklung".

4. DER KALENDER-LINK WAR FUER DIE COMMUNITY EINE SACKGASSE.

Auf jeder Brettkarte mit Termin stand "Im Kalender am 24.09." als Link.
kalender.html steht auf ALLE -- und ALLE ist ausdruecklich ohne "gast".
Jetzt fragt der SERVER die beiden Schranken (kalender_offen) und die
Karte zeigt den Termin als Text statt als Link. Die Auskunft bleibt, nur
der Weg ins Leere faellt weg. Die Regel im Browser nachzubauen waere die
vierte Stelle fuer dieselbe Frage gewesen.

5. EIN MODI KAM AN DIE TALENTE-NOTIZEN, DIE IHM VERWEHRT SIND.

BRETTER_UEBER_SEITEN war eine feste Liste ("wer die Seite darf, muss
auch dorthin kommen") und fragte nie, WER fragt. Ueber
bereich.html?b=talente kam er an Notizen zu Zuschauern, obwohl
talente.html fuer ihn gesperrt ist -- Begruendung dort: "Hier stehen
Namen von Menschen, die nichts davon wissen."

Aus der Liste wurde eine Zuordnung Brett -> Seite, gefragt wird
darfSeite(). Nachgemessen: modi/talente 404, modi/entwicklung darf,
hand+admin unveraendert.

Dazu stand in workspace-bereiche.js ein Kommentar, der das GEGENTEIL des
Codes behauptete ("entwicklung, talente bleiben 404"). Ein falscher
Kommentar an einer Rechtestelle ist schlimmer als keiner.

6. ZWEI KACHELN "CHAT", BEIDE AUF DIESELBE SEITE.

Seit dem Treff-Chat von gestern sahen Modi und rechte Hand zweimal
"Chat" mit demselben Ziel. Jetzt "Treff-Chat" mit ?raum=treff, das den
Raum direkt oeffnet -- gesucht an denselben zwei Merkmalen, an denen ihn
der Rest der Datei erkennt.

7. VERTRAUEN: "WIE GEHT'S DIR?" VERSPRACH MEHR, ALS ES HALTEN KANN.

Dort stand: "Niemand aus dem Team sieht deine Antworten -- auch
DogFather nicht." Punkt. Fast wahr und deshalb gefaehrlich: Aus
denselben Antworten entsteht eine namenlose Ampel fuer die Leitung.

Der ehrliche Satz war laengst geschrieben und wurde vom Server sogar
mitgeliefert (block.text) -- nur hat ihn nie jemand angezeigt. Er steht
jetzt im HTML, nicht im Skript: Wer die Seite oeffnet, soll ihn lesen,
BEVOR er tippt.

8. DIE NEUE AUSWERTUNG, AUS BENUTZERSICHT NACHGEBESSERT.

- Der Streifen hatte keine Zeichenerklaerung. Im Dateikopf stand "wer
  Farben schlecht unterscheidet, liest dasselbe Zeichen" -- das stimmt
  nur, wenn irgendwo steht, was die Zeichen heissen. Jetzt eine Legende,
  aus `stufen` gebaut statt abgeschrieben.
- "nie gesetzt" war ein Mittelpunkt, "Kann ich nicht sagen" ein
  Halbgeviertstrich. Zwei kurze Striche nebeneinander fuer den
  Unterschied zwischen "niemand hat hingesehen" und "jemand hat
  hingesehen und konnte es nicht sagen". Leer ist jetzt wirklich leer,
  mit gestricheltem Rahmen.
- Die Aufschluesselung der Balken stand nur im Mausueberfahren -- am
  Handy also nie, und dort steht jemand damit im Stream. Jetzt als Text.
- Die Modi-Sicht bekam Balken ohne Erklaerung, ein "Frag danach" ohne
  Adressaten und bei fehlender Bewegung ein LEERES Element. Jetzt
  Lesehilfe, ein Leerkasten mit Satz und zwei Wege weiter.

9. NEBENBEFUNDE, DIE DIE PRUEFUNG GEFUNDEN HAT.

pruef-css-klassen war schon VOR dieser Arbeit rot (nachgemessen mit
git stash). Alle drei Befunde behoben:
  - hilfe.html und unsere-seiten.html luden ihre Seitendatei NACH
    module.css und haus.css und ueberschrieben damit das Haus.
  - Zwei Schriftgroessen unter 11,5 px aus dem gestrigen Bau
    (.71rem Monatsbeschriftung, .68rem Marke) auf .75 und .72 gehoben.
  - Die Pruefung selbst war blind fuer <style>-Bloecke in der Seite und
    meldete deshalb dauerhaft drei Fehler an einer Seite, die ihre
    Stile mit Absicht selbst traegt. Eine Warnung, die immer kommt, ist
    keine Warnung mehr -- jetzt sieht sie hin, statt die Seite
    auszunehmen.

Kleinkram nebenbei: "die Antworten sieht nur du" -> "siehst nur du" auf
der Kachel zur empfindlichsten Seite des Hauses. "Bewertet wird dort" ->
"Eingeschaetzt wird dort" in teamlage.html, zwei Zeilen unter "keine
Bewertung von Menschen". "1 Aufgabe(n) angelegt" ausgeschrieben.

GEMESSEN: pruef-css-klassen ALLES IN ORDNUNG (vorher 3 Fehler),
pruef-meldungen 8/0, pruef-rechtetafel 19/0, alle Module laden,
keine doppelten Kachelnamen/-ziele/-farben mehr in allen vier Rollen.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-09-19 14:57:55 +02:00
co-authored by Claude Opus 5
parent 461d41943a
commit 273318dd9c
48 changed files with 1054 additions and 509 deletions
+5 -1
View File
@@ -383,7 +383,11 @@
}
.e-punkt__marke {
display: inline-block; margin: 2px 0 0;
font-size: .68rem; letter-spacing: .06em; text-transform: uppercase;
/* .72rem statt .68rem (19.09.2026): 10,88 px sind auch fuer ein
Schild zu klein -- Grossbuchstaben und Sperrung machen es nicht
lesbarer, nur breiter. .72rem ist die Groesse, die das Haus an
seinen uebrigen Marken benutzt (b-verlauf__datum). */
font-size: .72rem; letter-spacing: .06em; text-transform: uppercase;
color: var(--text-still);
border: 1px solid var(--rand); border-radius: 999px;
padding: 1px 8px;
+18
View File
@@ -406,6 +406,24 @@ body.gate {
.unterzeile { margin: 0 0 26px; color: var(--text-leise); font-size: .94rem; }
/* DER NACHSATZ, DER EINE EINSCHRÄNKUNG TRÄGT (19.09.2026).
Eine Zeile unter der Unterzeile, ruhiger gesetzt und mit einem
Strich links: Sie widerspricht dem Satz darüber nicht, sie
vervollständigt ihn. Deshalb tritt sie zurück, statt zu warnen —
augenschonend heißt hier ausdrücklich auch: keine Signalfarbe für
etwas, das keine Warnung ist. */
.unterzeile--zusatz {
margin: -18px 0 26px;
padding-left: 11px;
border-left: 2px solid var(--rand);
max-width: 62ch;
font-size: .86rem;
line-height: 1.6;
color: var(--text-still);
}
.unterzeile--zusatz em { font-style: normal; color: var(--text-leise); font-weight: 600; }
/* ---------- Rollen --------------------------------------------------- */
.feldschild {
+113 -2
View File
@@ -202,7 +202,11 @@
padding-right: 8px;
}
.w-streifen__monat {
font-size: .71rem; color: var(--text-still); text-align: center;
/* .75rem statt .71rem (19.09.2026): Die Monatsbeschriftung ist
kein Schild, sondern etwas, das man liest -- 11,4 px sind dafuer
zu klein. 12 px ist die Untergrenze, die das Haus fuer Fliesstext
und Beschriftungen einhaelt. */
font-size: .75rem; color: var(--text-still); text-align: center;
font-variant-numeric: tabular-nums;
}
.w-streifen__zelle {
@@ -217,7 +221,64 @@
.w-streifen__zelle[data-stufe="laeuft"] { color: #7fb08a; border-color: color-mix(in srgb, #668e6e 55%, transparent); }
.w-streifen__zelle[data-stufe="waechst"] { color: #8ec9ff; border-color: color-mix(in srgb, #8ec9ff 45%, transparent); }
.w-streifen__zelle[data-stufe="hakt"] { color: #d8a76a; border-color: color-mix(in srgb, #cc9451 55%, transparent); }
.w-streifen__zelle[data-stufe="leer"] { opacity: .32; }
/* LEER IST WIRKLICH LEER (19.09.2026).
Vorher stand hier ein Mittelpunkt bei 32 % Deckkraft -- und daneben
trägt „Kann ich nicht sagen" einen Halbgeviertstrich. Zwei kurze
waagerechte Striche nebeneinander, und dazwischen liegt der
Unterschied zwischen „niemand hat hingesehen" und „jemand hat
hingesehen und konnte es nicht sagen".
Jetzt trägt die leere Zelle kein Zeichen, sondern einen
gestrichelten Rahmen: Man SIEHT das Fehlen, statt es zu lesen --
und es lässt sich mit keinem Zeichen mehr verwechseln. */
.w-streifen__zelle[data-stufe="leer"] {
background: none;
border-style: dashed;
border-color: color-mix(in srgb, var(--rand) 70%, transparent);
}
.w-streifen__zelle[data-stufe="unklar"] { color: var(--text-still); }
/* Die Zeichenerklärung unter dem Streifen. Dieselben Farben wie die
Zellen -- sie wird daneben gelesen, nicht auswendig gelernt. */
.w-legende--streifen { margin-top: 12px; }
.w-legende__zeichen {
display: grid; place-items: center;
width: 1.55rem; height: 1.4rem;
font-size: .82rem; font-weight: 700;
border: 1px solid var(--rand);
border-radius: var(--radius);
color: var(--text-still);
background: rgba(0, 0, 0, .25);
}
.w-legende__zeichen[data-stufe="laeuft"] { color: #7fb08a; border-color: color-mix(in srgb, #668e6e 55%, transparent); }
.w-legende__zeichen[data-stufe="waechst"] { color: #8ec9ff; border-color: color-mix(in srgb, #8ec9ff 45%, transparent); }
.w-legende__zeichen[data-stufe="hakt"] { color: #d8a76a; border-color: color-mix(in srgb, #cc9451 55%, transparent); }
.w-legende__zeichen[data-stufe="leer"] {
background: none; border-style: dashed;
border-color: color-mix(in srgb, var(--rand) 70%, transparent);
}
/* DIE ZAHLEN IN WORTEN, unter dem Bewegungsdiagramm.
Es gibt sie, weil die Aufschlüsselung vorher nur im Mausüberfahren
stand -- und wer dieses Haus benutzt, steht oft mit dem Handy im
Stream. Dort gibt es kein Überfahren. */
.w-bewegung__worte {
margin: 14px 0 0;
display: grid; gap: 4px;
}
.w-bewegung__wortzeile {
margin: 0;
display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px;
font-size: .82rem; line-height: 1.55;
}
.w-bewegung__wortmonat {
min-width: 4.5ch;
color: var(--text-leise); font-weight: 640;
font-variant-numeric: tabular-nums;
}
.w-bewegung__worttext { color: var(--text-still); }
/* Älter als 90 Tage: sichtbar, aber sichtbar alt. Nicht weg — man soll
sehen, DASS etwas alt ist, statt dass es verschwindet. */
.w-streifen__zelle[data-alt="ja"] { opacity: .45; border-style: dashed; }
@@ -298,3 +359,53 @@
.w-legende__fleck { background: CanvasText; }
.w-streifen__zelle { border-color: CanvasText; }
}
/* =====================================================================
DIE EIGENE SICHT — Lesehilfe, leerer Zustand, Wege weiter
(19.09.2026)
Alle drei sind dazugekommen, weil beim Durchgehen aus Benutzersicht
auffiel: Die Seite, die dem Beurteilten etwas geben soll, gab ihm
weniger als dem Beurteilenden — keine Erklärung zum Diagramm, keinen
Satz wenn nichts da ist, und eine Aufforderung ohne Ort.
===================================================================== */
.w-lesehilfe {
margin: 0 0 16px;
max-width: 62ch;
font-size: .84rem; line-height: 1.6;
color: var(--text-still);
}
/* Der leere Zustand. Kein Diagramm über nichts — ein Satz.
Ruhig gesetzt: „noch nichts da" ist keine Warnung. */
.w-leer {
padding: 20px 22px;
border: 1px dashed color-mix(in srgb, var(--rand) 80%, transparent);
border-radius: var(--radius);
background: color-mix(in srgb, var(--tinte) 96%, #ffffff 4%);
}
.w-leer__titel {
margin: 0 0 6px;
font-size: .95rem; font-weight: 640; color: var(--text-leise);
}
.w-leer__satz {
margin: 0; max-width: 58ch;
font-size: .86rem; line-height: 1.6; color: var(--text-still);
}
/* Die Wege weiter. Zwei, nicht fünf: einer führt zum Katalog, einer
zum Gespräch. Mehr wäre eine Auswahl statt eines nächsten Schritts. */
.w-wege {
margin: 20px 0 0;
display: flex; flex-wrap: wrap; gap: 10px;
}
/* Der zweite Weg tritt zurück: Der Katalog ist der naheliegende
nächste Schritt, das Gespräch der zweite. Eine eigene Knopfart
dafür anzulegen wäre zu viel — es reicht, die Fläche wegzunehmen. */
.w-weg--leise {
background: none;
border: 1px solid var(--rand);
color: var(--text-leise);
}
.w-weg--leise:hover { color: var(--text); border-color: var(--rand-hell); }
+26 -2
View File
@@ -130,6 +130,12 @@
noch einmal steht, ist die, die auseinanderlaeuft; und die Fassung
im Browser kann man aendern. */
let treffBrett = false;
/* Darf ich den Kalender oeffnen? Kommt vom Server (kalender_offen).
Vorgabe `true`: Antwortet ein aelterer Server das Feld noch nicht,
bleibt es wie bisher -- ein fehlender Link waere fuer das Team ein
Rueckschritt, ein ueberzaehliger fuer die Community nur der alte
Zustand. */
let kalenderOffen = true;
let lage = null;
/* WELCHE BRETTER NACH ART GEGLIEDERT WERDEN.
Stand frueher mitten in der Zeichenfunktion -- dort konnte
@@ -750,9 +756,25 @@
ES IST EIN LINK, keine Marke. Wer liest „steht im Kalender",
will als Naechstes nachsehen, was noch an dem Tag ist. */
if (e.termin) {
const zeile = el('a', 'im-kalender');
/* LINK NUR, WENN DER KALENDER FUER MICH OFFEN IST (19.09.2026).
Fuer die Community ist er es nicht -- `kalender.html` steht in
der Rechtetafel auf ALLE, und ALLE ist ausdruecklich ohne
"gast". Bis heute stand hier trotzdem ein Link, und ein Klick
landete wortlos auf der Startseite: sichtbar, beschriftet,
vielversprechend -- und eine Sackgasse.
GEFRAGT WIRD DER SERVER (`kalender_offen`), nicht die Rolle.
Eine Rollenabfrage hier waere eine vierte Fassung derselben
Regel; die vierte ist die, die beim naechsten Umbau etwas
durchlaesst.
DIE AUSKUNFT BLEIBT in jedem Fall stehen -- "Im Kalender am
24.09." ist auch ohne Weg dorthin richtig und nuetzlich. Es
faellt nur der Klick weg, der nirgendwohin fuehrt. */
const zeile = el(kalenderOffen ? 'a' : 'span', 'im-kalender');
zeile.dataset.grund = e.termin.grund;
zeile.href = 'kalender.html';
if (kalenderOffen) zeile.href = 'kalender.html';
zeile.append(el('span', 'im-kalender__zeichen', '\u{1F5D3}'));
zeile.append(el('span', 'im-kalender__text',
(e.termin.grund === 'zugesagt' ? 'Zugesagt für ' : 'Im Kalender am ')
@@ -1677,6 +1699,7 @@
const daten = await a.json();
einstellung = daten.einstellung;
treffBrett = !!daten.treff;
kalenderOffen = daten.kalender_offen !== false;
weiterZeigen(daten.weiter);
await lageHolen();
filterBauen(daten.eintraege || []);
@@ -2154,6 +2177,7 @@
ausgerechnet an der Stelle, an der jemand gerade überlegt, ob er
schreiben darf. */
treffBrett = !!daten.treff;
kalenderOffen = daten.kalender_offen !== false;
await lageHolen();
/* DER WEG ZU DEN REGELN STEHT AUF JEDEM BRETT DES TREFFS
+21
View File
@@ -2303,6 +2303,27 @@
/* Kommt man aus einer Benachrichtigung, steht das Gespräch in der
Adresse -- dann direkt hinein. */
const suche = new URLSearchParams(location.search);
/* ?raum=treff -- der Weg von der Treff-Kachel (19.09.2026).
ANLASS: Ein Modi sah ZWEI Kacheln namens "Chat", beide auf
dieselbe Seite -- eine in "Taeglich" (Team), eine in "Community"
(Treff). Sie taten auch dasselbe: Man landete in der
Gespraechsliste und musste den richtigen Raum suchen. Zwei Wege
zum selben Ziel verwirren mehr, als ein fehlender fehlt.
Die Nummer des Treff-Raums steht nicht fest (er wird beim ersten
Start angelegt), deshalb das Wort statt einer Zahl. Gesucht wird
er in der Liste, die ohnehin schon geladen ist -- an denselben
zwei Merkmalen, an denen ihn der Rest der Datei erkennt. */
if (suche.get('raum') === 'treff') {
const t = raeume.find((r) => r.art === 'kanal' && r.kategorie === 'treff');
if (t) { await raumOeffnen(t.id); return; }
/* DRITTER AUSGANG: Gibt es ihn (noch) nicht, bleibt die Liste
stehen -- das ist die richtige Antwort und kein Fehler. Ein
leerer Verlauf waere schlimmer als eine Liste. */
}
const wunsch = Number(suche.get('raum'));
if (Number.isInteger(wunsch) && wunsch > 0) { await raumOeffnen(wunsch); return; }
+6 -1
View File
@@ -840,7 +840,12 @@
jetzt ihre eigene Seite, also stimmte der Titel nicht mehr.
Ein Titel, der etwas anderes verspricht als die Seite zeigt,
ist derselbe Fehler wie der an der Kachel. */
$('titel').textContent = 'Deine Entwicklung';
/* NICHT 'Deine Entwicklung' (geaendert 19.09.2026): So hiess bis
heute AUCH werdegang.html fuer denselben Menschen. Wer aus der
Glocke oder einem Link kam, konnte nicht sagen, auf welcher der
beiden Seiten er stand. Jetzt traegt jede den Namen ihrer
Kachel: hier 'Deine Aufgaben', dort 'Deine Entwicklung'. */
$('titel').textContent = 'Deine Aufgaben';
$('unterzeile').textContent =
'Was im Team über deine Arbeit notiert ist – und was du selbst dazu sagst. '
+ 'Keine Noten, keine Punktzahl.';
+1 -1
View File
@@ -469,7 +469,7 @@
knopf.disabled = false; return;
}
const d = await a.json().catch(() => ({}));
melde(d.aufgaben ? `${d.aufgaben} Aufgabe(n) angelegt.` : '');
melde(d.aufgaben ? (d.aufgaben === 1 ? 'Eine Aufgabe angelegt.' : `${d.aufgaben} Aufgaben angelegt.`) : '');
await laden();
} catch { knopf.disabled = false; }
}
+119 -4
View File
@@ -146,6 +146,31 @@
legende.append(p);
}
wurzel.append(legende);
/* DIE ZAHLEN IN WORTEN (ergänzt 19.09.2026).
Über dem Balken steht „4". Was die 4 ausmacht, stand nur im
`title` — also beim Mausüberfahren, also am Handy nie. Und genau
dort steht jemand damit: im Stream, zwischen zwei Szenen.
Nur Monate mit Inhalt, damit aus sechs Zeilen nicht fünf leere
werden. */
const worte = el('div', 'w-bewegung__worte');
for (const m of bewegung) {
const teile = [
m.vor ? `${m.vor}× nach vorn` : null,
m.geklaert ? `${m.geklaert}× geklärt` : null,
m.neu ? `${m.neu}× zum ersten Mal` : null,
m.zurueck ? `${m.zurueck}× zurückgesetzt` : null,
m.offen ? `${m.offen}× wieder offen` : null,
].filter(Boolean);
if (!teile.length) continue;
const zeile = el('p', 'w-bewegung__wortzeile');
zeile.append(el('strong', 'w-bewegung__wortmonat', monatKurz(m.monat)));
zeile.append(el('span', 'w-bewegung__worttext', teile.join(' · ')));
worte.append(zeile);
}
if (worte.childElementCount) wurzel.append(worte);
return wurzel;
}
@@ -164,8 +189,20 @@
const zeile = el('div', 'w-streifen__zeile');
zeile.append(el('span', 'w-streifen__punkt-name', z.titel));
for (const c of z.zellen) {
/* LEER IST NICHT „KANN ICH NICHT SAGEN“ (getrennt 19.09.2026).
Beim Durchgehen aus Benutzersicht aufgefallen: Hier stand für
„nie etwas gesetzt“ ein Mittelpunkt `·` — und „Kann ich nicht
sagen“ trägt im Katalog den Halbgeviertstrich `–`. Zwei kleine
waagerechte Striche in Nachbarzellen, und der Unterschied
zwischen ihnen ist genau der, den dieses Haus sonst sehr ernst
nimmt: „niemand hat hingesehen“ gegen „jemand hat hingesehen
und konnte es nicht sagen“.
Leer ist jetzt WIRKLICH leer — kein Zeichen, dafür ein
gestrichelter Rahmen. Man sieht das Fehlen, statt es zu lesen. */
const zelle = el('span', 'w-streifen__zelle',
c.stufe ? zeichenVon(c.stufe) : '·');
c.stufe ? zeichenVon(c.stufe) : '');
if (c.stufe) {
zelle.dataset.stufe = c.stufe;
if (c.alt) zelle.dataset.alt = 'ja';
@@ -180,7 +217,35 @@
}
gitter.append(zeile);
}
return gitter;
/* DIE ZEICHENERKLÄRUNG — und sie ist der Grund, warum die Zeichen
überhaupt etwas taugen (ergänzt 19.09.2026).
Im Kopf dieser Datei steht: „Jede Zelle trägt das Zeichen ihrer
Stufe als Text. Wer Farben schlecht unterscheidet, liest genau
dasselbe." Das stimmt nur, wenn irgendwo steht, WAS die Zeichen
heißen. Tat es nicht — die Bedeutung steckte ausschließlich im
Mausüberfahren, und auf einem Handy gibt es das nicht.
Gebaut aus `stufen` vom Server, nicht abgeschrieben: Wer dort ein
Zeichen ändert, ändert die Erklärung mit. */
const legende = el('div', 'w-legende w-legende--streifen');
for (const st of stufen) {
const p = el('span', 'w-legende__punkt');
const z = el('span', 'w-legende__zeichen', st.zeichen);
z.dataset.stufe = st.schluessel;
p.append(z, el('span', 'w-legende__text', st.name));
legende.append(p);
}
const leerP = el('span', 'w-legende__punkt');
const leerZ = el('span', 'w-legende__zeichen', '');
leerZ.dataset.stufe = 'leer';
leerP.append(leerZ, el('span', 'w-legende__text', 'noch nichts gesetzt'));
legende.append(leerP);
const huelle = el('div');
huelle.append(gitter, legende);
return huelle;
}
/* =====================================================================
@@ -377,9 +442,59 @@
stufen = d.stufen || stufen;
$('mich-satz').textContent = d.satz;
$('mich-hinweis').textContent = d.hinweis;
/* DREI DINGE, DIE HIER GEFEHLT HABEN (19.09.2026).
Beim Durchgehen aus der Sicht dessen, dem diese Seite gehört,
fiel auf: Er bekam Balken ohne die Erklärung, die die Leitung
daneben bekommt („Nach oben: weitergekommen"). Er bekam eine
Aufforderung ohne Adressaten („Frag danach" — wen?). Und wenn
sich nichts bewegt hatte, bekam er ein leeres Element, also
nichts: eine Seite, die einlädt und dann schweigt.
Alle drei sind hier behoben. Es ist derselbe Gedanke wie überall
im Haus: Der leere Zustand ist kein Sonderfall, er ist der
häufigste Fall — vor allem am Anfang. */
const etwas = d.bewegung?.some((m) => m.vor || m.zurueck || m.neu || m.geklaert);
$('mich-bewegung').replaceChildren(
etwas ? bewegungBauen(d.bewegung, d.spalten) : el('span'));
if (etwas) {
$('mich-bewegung').replaceChildren(bewegungBauen(d.bewegung, d.spalten));
$('mich-lesehilfe').textContent =
'Nach oben: ein Punkt ist weitergekommen. Nach unten: er wird '
+ 'gerade anders gesehen als vorher – das ist kein Rückschritt, '
+ 'sondern meist nur ein genauerer Blick.';
$('mich-lesehilfe').hidden = false;
} else {
/* KEIN DIAGRAMM ÜBER NICHTS. Ein Raster aus leeren Spalten sieht
aus, als sei etwas kaputt. Ein Satz ist eine Auskunft. */
$('mich-bewegung').replaceChildren(leerKasten(
'Hier ist noch nichts zu sehen',
'Sobald jemand aus der Leitung eine Einschätzung setzt oder '
+ 'ändert, erscheint sie hier als Bewegung. Am Anfang ist diese '
+ 'Seite leer – das ist der Normalfall, kein Fehler.'));
$('mich-lesehilfe').hidden = true;
}
/* DER WEG WEITER. „Frag danach" ohne einen Ort ist eine Sackgasse
mit freundlichem Ton. */
const wege = $('mich-wege');
wege.replaceChildren();
const k1 = el('a', 'knopf knopf--klein', 'Deine Aufgaben ansehen');
k1.href = 'entwicklung.html';
const k2 = el('a', 'knopf knopf--klein w-weg--leise', 'Jemanden fragen');
k2.href = 'chat.html';
wege.append(k1, k2);
wege.hidden = false;
}
/** Ein Kasten für „hier ist noch nichts" — Überschrift plus Satz.
*
* ALS EIGENE FUNKTION, weil dieser Fall im Haus überall vorkommt und
* überall gleich aussehen soll. Ein leerer Zustand, der jedes Mal
* anders gebaut ist, liest sich wie ein Fehler. */
function leerKasten(titel, satz) {
const k = el('div', 'w-leer');
k.append(el('p', 'w-leer__titel', titel));
k.append(el('p', 'w-leer__satz', satz));
return k;
}
/* ---- Start ---------------------------------------------------------- */