Begruessung, Schriftzug, hellerer Hintergrund - und "Wissen" fuer Creator

Vier Wuensche auf einmal, alle auf der Startseite und der Kopfleiste.

BEGRUESSUNG. Dort stand "Angemeldet" ueber dem Namen -- eine Zeile, die
nichts hinzufuegt, weil oben rechts ohnehin Name und Rolle stehen. Jetzt
beantwortet der Kopf die drei Fragen, die man beim Reinkommen hat:
WANN (Wochentag, Datum, Kalenderwoche nach ISO 8601, selbst gerechnet),
WER (Plakette mit dem Anfangsbuchstaben in der Farbe der Rolle -- der
einzige runde Koerper der Seite, dadurch sofort als Person lesbar) und
WIE es steht (ein Satz aus denselben Hinweisen, die darunter stehen --
keine zweite Zaehlung). An Tagen mit Charakter kommt ein Wort dazu:
Neue Woche, Endspurt, Wochenende. Der Gruss ist feiner gestuft und der
Name eigenstaendig ausgezeichnet: das Grusswort leise, der Name kraeftig.

SCHRIFTZUG oben links. Vorher alles gleich laut, der Trenner ein
Satzzeichen wie jedes andere. Jetzt hat er Rang: der Name vorn und
kraeftig, der Ort dahinter und leiser, dazwischen eine kleine Raute in
der Hausfarbe. Aufgeteilt zentral in kopf.js statt in sechzehn HTML-
Dateien, und nur die Textknoten -- Verweise bleiben unberuehrt.

HINTERGRUND heller, wie gewuenscht: Der Schleier liegt bei .86/.58/.44
statt .95/.72/.60, dazu zwei sehr weiche Farbschimmer, die dem Bild das
reine Schwarz nehmen. Der Kontrast wurde danach an echten Bildpunkten
nachgemessen und haelt ueberall (schlechtester Wert 4,78:1).

"WISSEN" statt "Team & System" -- aber nur fuer Creator. Von der Gruppe
bleibt fuer ihn genau eine Kachel uebrig; eine Ueberschrift, die Team
und System verspricht und nur die Bibliothek zeigt, verspricht etwas
Falsches.

DREI FUNDE DURCH DIE PRUEFUNGEN:

1. Die Kontrastmessung war kaputt, seit Text neben Text steht. Sie tastete
   stur 4 px rechts vom Text ab -- und traf dort den NACHBARTEXT statt den
   Untergrund (1,10:1 gemeldet, ohne dass etwas schlecht lesbar war). Jetzt
   werden sechs Stellen rings um den Text angeboten und jede zuerst
   gefragt, ob dort wirklich Untergrund liegt. Strenger, nicht lockerer.
   Texte ohne freie Stelle werden GEZAEHLT und ausgegeben, nicht still
   uebersprungen.
2. bereich.html hatte als einzige Seite kein span.marke__text. Damit
   griffen dort weder die Ueberlauf-Kuerzung noch der neue Rang. Stand seit
   Monaten so, aufgefallen erst, als die Seitenpruefung die Marke auf allen
   dreizehn Seiten nachgesehen hat.
3. Die Datumspruefung haette im Maerz stillschweigend versagt: \w kennt
   ohne Unicode-Schalter kein "ae". Ein Fehler, der sieben Monate wartet.

Co-Authored-By: Claude Opus 5 <[email protected]>

server/pruef-start-ansicht.mjs

@@ -75,6 +75,26 @@ async function anmelden(kontext, rolle, code) {
 
 const lesen = (seite) => seite.evaluate(() => ({
   gruss: document.getElementById("gruss")?.textContent,
+  /* Die Begrüßung ist ein Kopf aus vier Teilen geworden: Datum mit
+     Kalenderwoche, ein Wort zum Tag, die Plakette in Rollenfarbe und
+     ein Satz zur Lage. Jeder Teil wird einzeln nachgesehen -- "sieht
+     gut aus" ist kein Nachweis. */
+  datum: document.getElementById("datum")?.textContent || "",
+  grussWort: document.querySelector(".gruss__wort")?.textContent || "",
+  grussName: document.querySelector(".gruss__name")?.textContent || "",
+  plakette: document.getElementById("plakette")?.textContent || "",
+  plaketteRolle: document.getElementById("plakette")?.dataset.rolle || "",
+  plaketteRund: getComputedStyle(document.getElementById("plakette") || document.body).borderRadius,
+  marker: document.getElementById("tagesmarker")?.hidden === false
+    ? document.getElementById("tagesmarker").textContent : null,
+  lage: document.getElementById("lage")?.hidden === false
+    ? document.getElementById("lage").textContent : null,
+  lageStufe: document.getElementById("lage")?.dataset.stufe || null,
+  /* Der Schriftzug oben links, aufgeteilt in Rang. */
+  markeHaupt: document.querySelector(".kopfleiste .marke__haupt")?.textContent || "",
+  markeLeise: document.querySelector(".kopfleiste .marke__leise")?.textContent || "",
+  markeRauten: document.querySelectorAll(".kopfleiste .marke__raute").length,
+  gruppenNamen: [...document.querySelectorAll(".gruppe__name")].map((g) => g.textContent),
   gruppen: [...document.querySelectorAll(".gruppe")].map((g) => ({
     name: g.querySelector(".gruppe__name")?.textContent,
     kacheln: g.querySelectorAll(".kachel").length,
@@ -143,8 +163,61 @@ for (const [breite, wie] of [[1440, "Computer"], [390, "Handy"]]) {
 
   ok(r.gruppen.length === 3, `drei Gruppen (${r.gruppen.length})`);
   ok(r.kacheln.length === 17, `siebzehn Kacheln (${r.kacheln.length})`);
-  ok(/^(Guten Morgen|Guten Tag|Guten Abend|Noch wach), Filipe$/.test(r.gruss || ""),
-     `Begrüßung nach Tageszeit ("${r.gruss}")`);
+  ok(/^(Guten Morgen|Guten Mittag|Guten Tag|Guten Abend|Späten Abend|Noch wach), Filipe$/
+       .test(r.gruss || ""), `Begrüßung nach Tageszeit ("${r.gruss}")`);
+  /* Der Name muss eigenständig ausgezeichnet sein -- er ist das Wichtigste
+     an der Zeile und wird kräftiger gesetzt als der Gruß davor. */
+  ok(r.grussName === "Filipe", `der Name steht für sich (${r.grussName})`);
+  ok(r.grussWort.trim().endsWith(","), `und das Grußwort davor (${r.grussWort.trim()})`);
+
+  /* Datumszeile: Wochentag, Datum, Kalenderwoche. Die KW wird selbst
+     gerechnet (ISO 8601) -- eine falsche KW wäre schlimmer als keine. */
+  console.log("   Datum:  ", r.datum, r.marker ? `· ${r.marker}` : "");
+  /* Kein \w im Monatsnamen: "März" enthält einen Umlaut, den \w ohne
+     Unicode-Schalter nicht kennt. Diese Prüfung wäre im März stillschweigend
+     rot geworden -- ein Fehler, der sieben Monate lang unsichtbar wartet. */
+  ok(/^(Montag|Dienstag|Mittwoch|Donnerstag|Freitag|Samstag|Sonntag), \d{1,2}\. [A-Za-zÄÖÜäöü]+ · KW \d{1,2}$/
+       .test(r.datum), `Datum mit Kalenderwoche ("${r.datum}")`);
+  const kw = Number((r.datum.match(/KW (\d+)/) || [])[1]);
+  ok(kw >= 1 && kw <= 53, `die Kalenderwoche ist plausibel (${kw})`);
+  /* An Tagen mit Charakter steht ein Wort dabei -- an den übrigen nicht.
+     Beides ist richtig, aber es muss zum Wochentag passen. */
+  const tag = r.datum.split(",")[0];
+  const erwartet = { Montag: "Neue Woche", Freitag: "Endspurt",
+                     Samstag: "Wochenende", Sonntag: "Wochenende" }[tag] || null;
+  ok(r.marker === erwartet,
+     `das Wort zum Tag passt zum ${tag} (${r.marker || "keins"}, erwartet ${erwartet || "keins"})`);
+
+  /* Die Plakette: Anfangsbuchstabe, rund, in der Farbe der Rolle. */
+  ok(r.plakette === "F", `die Plakette trägt den Anfangsbuchstaben (${r.plakette})`);
+  ok(r.plaketteRolle === "admin", `und die Rolle für ihre Farbe (${r.plaketteRolle})`);
+  ok(/50%|9999px/.test(r.plaketteRund), `und ist rund (${r.plaketteRund})`);
+
+  /* Der Satz zur Lage kommt aus denselben Hinweisen wie die Liste
+     darunter -- keine zweite Zählung. Hier liegt Überfälliges vor,
+     also muss er das sagen und rot sein. */
+  console.log("   Lage:   ", r.lage);
+  ok(r.lageStufe === "warnung", `die Lage meldet Überfälliges (${r.lageStufe})`);
+  ok(/^\d+ Sachen? (ist|sind) überfällig/.test(r.lage || ""), `und sagt es im Klartext ("${r.lage}")`);
+  /* Sie muss zu den Hinweisen passen, sonst stünden zwei Wahrheiten
+     übereinander auf einem Bildschirm. */
+  const dringend = r.dranZeilen.filter((z) => z.stufe === "warnung")
+    .reduce((s, z) => s + Number(z.zahl), 0);
+  ok(Number((r.lage.match(/^\d+/) || [])[0]) === dringend,
+     `und stimmt mit den Hinweisen überein (${r.lage.match(/^\d+/)} = ${dringend})`);
+
+  /* Der Schriftzug oben links hat jetzt einen Rang statt einer Farbe.
+     Die geschützten Leerzeichen aus dem Quelltext bleiben erhalten (der
+     Schriftzug darf nicht umbrechen) -- beim Vergleich werden sie
+     deshalb gleichgesetzt, sonst prüft man Unsichtbares. */
+  const ohneNbsp = (t) => t.replace(/ /g, " ");
+  ok(ohneNbsp(r.markeHaupt) === "Dogfather Universe", `der Name steht vorn ("${r.markeHaupt}")`);
+  ok(ohneNbsp(r.markeLeise) === "Creator Workspace", `der Ort dahinter ("${r.markeLeise}")`);
+  ok(r.markeRauten === 1, `und dazwischen genau eine Raute (${r.markeRauten})`);
+  /* Der geschützte Leerraum muss WIRKLICH noch da sein -- ginge er beim
+     Aufteilen verloren, bräche "Creator Workspace" auf dem Handy um. */
+  ok(r.markeHaupt.includes(" ") && r.markeLeise.includes(" "),
+     "und der Schriftzug kann weiterhin nicht umbrechen");
 
   /* Jede Kachel muss ein Zeichen haben -- eine ohne waere ein leeres
      Kaestchen und faellt sofort auf. */
@@ -251,6 +324,24 @@ console.log("\n=== Creator");
   ok(!namen.includes("Automationen"), "keine Automationen");
   ok(r.gruppen.length === 3, `trotzdem drei Gruppen (${r.gruppen.length})`);
   ok(r.kacheln.every((k) => k.pfade > 0), "alle Zeichen da");
+  /* Von "Team & System" bleibt für ihn genau eine Kachel übrig. Eine
+     Überschrift, die Team und System verspricht und nur die Bibliothek
+     zeigt, verspricht etwas Falsches -- deshalb heißt sie hier "Wissen". */
+  ok(r.gruppenNamen.includes("Wissen"), `die Gruppe heißt "Wissen" (${r.gruppenNamen.join(" · ")})`);
+  ok(!r.gruppenNamen.includes("Team & System"), "und nicht mehr \"Team & System\"");
+  /* Seine Begrüßung: eigene Rollenfarbe, und da nichts anliegt, der
+     ruhige Satz statt eines erfundenen Alarms. */
+  ok(r.plaketteRolle === "creator", `die Plakette kennt seine Rolle (${r.plaketteRolle})`);
+  /* Tili hat selbst überfällige Aufgaben -- die Lage MUSS das sagen.
+     Entscheidend ist nicht, welche Stufe herauskommt, sondern dass sie
+     zu dem passt, was direkt darunter steht. Zwei verschiedene Zahlen
+     auf einem Bildschirm wären der eigentliche Fehler. */
+  const cDringend = r.dranZeilen.filter((z) => z.stufe === "warnung")
+    .reduce((s, z) => s + Number(z.zahl), 0);
+  ok(cDringend > 0 ? r.lageStufe === "warnung" : r.lageStufe !== "warnung",
+     `die Lage passt zu seinen Hinweisen (${r.lageStufe}: "${r.lage}")`);
+  ok(cDringend === 0 || Number((r.lage.match(/^\d+/) || [])[0]) === cDringend,
+     `und zur Zahl darunter (${cDringend})`);
   await seite.screenshot({ path: "pruef-start-creator.png", fullPage: true });
   await kontext.close();
 }