Files
dogfather-universe/workspace/profil.html
T
DogFatherGitandClaude Opus 5 e0d8e6d55d Tagesblick: Termine als Karten, und vier Fehler, die dabei auffielen
Filipe zu der Liste mit einem einzigen Termin darin: "das soll viel
geiler und krasser aussehen bitte."

Er hatte recht, und der Grund war der Einzelfall. Ein Zeitstrahl lebt
davon, dass er etwas VERBINDET -- bei einem Eintrag verbindet er nichts.
Uebrig blieben eine magere Zeile, ein Strich ins Leere und Weissraum bis
zur Plakette am rechten Rand.

Jetzt traegt jede Karte fuer sich: eigene Flaeche mit farbiger Kante,
die Uhrzeit gross und in der Farbe der Terminart (vorher war sie
kleiner als der Titel -- dabei ist sie das, was man sucht), ein Balken
fuer die Dauer, und "JETZT" am naechsten Termin statt eines etwas
helleren Hintergrunds. Erledigtes bekommt einen Haken und verliert die
Farbe, bleibt aber voll lesbar; vorher wurde alles blasser, was auch
den Text traf.

Kein Neon dazu. Die Wirkung kommt aus Kontrast und Hierarchie.

VIER FEHLER, DIE DIE PRUEFUNGEN GEFUNDEN HABEN

1. ZEITZONE, in NEUN Pruefungen. Um 00:10 meldete pruef-teilnehmer
   ploetzlich 13 Fehlschlaege an einer Datei, die seit Stunden niemand
   angefasst hatte:

       Ortszeit:  06.09.2026, 00:10
       UTC:       05.09.2026, 22:10

   Sie bildeten ihr Tagesdatum mit toISOString() -- also UTC -- legten
   ihre Termine auf gestern und suchten heute. ZWEI STUNDEN AM TAG waren
   sie damit rot, im Winter eine. Wer nur tagsueber laeuft, sieht das
   nie. Jetzt gibt es helfer-zeit.mjs mit derselben Rechenweise wie die
   Anwendung, und pruef-struktur sucht das Muster kuenftig automatisch.

2. MEIN UMSTELL-SKRIPT VERSAGTE STILL. Es pruefte
   `if "helfer-zeit.mjs" not in s` -- und mein eigener Kommentar
   enthielt den Dateinamen. Ergebnis: keine einzige der neun Dateien
   bekam den Import, alle waeren zur Laufzeit abgestuerzt. `node --check`
   findet das nicht. Aufgefallen, weil danach nachgezaehlt wurde statt
   der Erfolgsmeldung zu glauben.

3. DIE KACHEL LIESS DIE SEITE SPRINGEN. Der Layout-Sprung auf
   start.html stieg von 0 auf 0,96 -- zweimal bestaetigt. Sie erschien
   erst nach dem Laden und schob alles darunter weg. Das ist kein
   Schoenheitsfehler, sondern der Grund, warum man auf den falschen
   Knopf drueckt.

   Gemessen wurden die echten Hoehen (1 Termin 169 px, 3 → 327, 5 →
   486). Daraus zwei Konsequenzen: Platz vorher reservieren, und
   hoechstens DREI Termine zeigen -- das halbiert die Spanne und ist
   die klarere Aussage. Der Rest steht als "1 weiterer Termin heute"
   darunter, nicht stillschweigend abgeschnitten. Von 0,96 auf 0,163.

4. SCHRIFTGROESSE, zweimal am selben Tag: erst die Art-Plaketten mit
   10,56 px, dann -- nach der Korrektur -- die neue Jetzt-Marke mit
   10,88. Beide Male gemeldet von pruef-handy und pruef-grosscheck,
   beide Male erst nach einem mehrminuetigen Browserlauf.

ZWEI PRUEFUNGEN, DIE SICH SELBST IM WEG STANDEN

pruef-tempo-workspace meldete "NEUE Doppelabfrage: start.html 2x
/workspace/api/termine". Nachgemessen an einem einzelnen Seitenaufruf:
genau eine Anfrage. Die Pruefung startete ihren Zaehler, bevor die
Anmeldung zur Ruhe gekommen war, und schrieb der Seite an, was die
vorherige noch offen hatte.

pruef-tagesblick fiel zum zweiten Mal auf dieselbe Falle herein: Sie
mass die Artfarbe an einem vorbeigezogenen Termin, der absichtlich grau
ist. Diesmal an der Wurzel geloest -- die Daempfung wird fuer die
Messung kurz abgeschaltet und sofort zurueckgesetzt. Damit ist die
Zuordnung fuer JEDEN Termin geprueft, unabhaengig von der Uhrzeit des
Laufs, und zusaetzlich beweist die Pruefung, dass die Daempfung greift.

NEU: Schriftgroessen werden jetzt AN DER QUELLE geprueft, in Sekunden
statt Minuten. Im Bestand stehen 43 solche Stellen; sie alle rot zu
melden haette die Pruefung ab Tag eins wertlos gemacht. Deshalb eine
Grundlinie wie beim Layout-Sprung: Sie haelt den Stand fest und
schlaegt an, sobald es MEHR werden. Heute haette das zweimal gegriffen.
Die Browserpruefung bleibt daneben -- sie sieht, was am Ende auf dem
Schirm steht, die CSS-Pruefung nur, was gemeint war.

Gesamtlauf: 56 von 56 Dateien, 2002 von 2002 Punkten.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-06 01:32:33 +02:00

212 lines
9.2 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Creator-Profil · Creator Workspace</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#0674b9" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609060056" />
<link rel="stylesheet" href="assets/css/start.css?v=202609060056" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609060056" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609060056" />
</head>
<body class="start">
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
Pseudo-Elements -- body hat nur ::before und ::after. -->
<div class="schleier" aria-hidden="true"></div>
<header class="kopfleiste">
<button type="button" class="zurueck-knopf" id="zurueck" hidden>
<svg class="zurueck-knopf__pfeil" viewBox="0 0 24 24" aria-hidden="true">
<path d="M14.5 5.5 8 12l6.5 6.5" />
</svg>
<span class="zurueck-knopf__text">Zurück</span>
</button>
<p class="marke"><span class="marke__text"><a class="zurueck" href="start.html">Creator&nbsp;Workspace</a> · Profil</span></p>
<div class="kopfleiste__rechts">
<span class="wer" id="wer">…</span>
<button type="button" class="abmelden" id="abmelden">Abmelden</button>
</div>
</header>
<main class="inhalt">
<section class="kopf-zeile">
<div>
<p class="marke">Onboarding</p>
<h1 class="titel" id="titel">Creator-Profil</h1>
<p class="unterzeile" id="unterzeile">…</p>
</div>
<div id="auswahl-block" hidden>
<label class="feld-schild" for="auswahl">Creator</label>
<select id="auswahl"></select>
</div>
</section>
<!-- Der eigene Steckbrief -- hier NUR fuer Creator, weil ein Creator
nur eine Profilseite hat und beides zusammengehoert.
Scouts, Manager und DogFather sehen ihn auf steckbrief.html.
Grund: Auf dieser Seite steht die Akte eines ANDEREN Menschen
("Profil: SpongBobSchwammKopf"). Der eigene Steckbrief mittendrin
ergab zwei Personen auf einem Bildschirm, ohne dass klar war,
welche gerade gemeint ist. steckbrief.js blendet ihn hier nur
fuer Creator ein. -->
<section class="steckbrief" id="steckbrief" data-nur-creator="ja" hidden>
<div class="steckbrief__kopf">
<div class="steckbrief__bildfeld">
<span class="steckbrief__bild" id="sb-bild" aria-hidden="true"></span>
<div class="steckbrief__bildknoepfe">
<label class="schritt" for="sb-datei">Bild wählen</label>
<input type="file" id="sb-datei" accept="image/jpeg,image/png,image/webp" hidden />
<button type="button" class="schritt" id="sb-bild-weg" hidden>entfernen</button>
</div>
</div>
<div class="steckbrief__text">
<p class="feldschild">Mein Profil</p>
<h2 class="steckbrief__name" id="sb-name">…</h2>
<p class="steckbrief__rolle" id="sb-rolle"></p>
<label class="feld-schild" for="sb-ueber">Ein Satz über dich</label>
<textarea id="sb-ueber" rows="2" maxlength="400"
placeholder="z. B. Ich streame Gaming und Just Chatting, meistens abends."></textarea>
<p class="feldschild steckbrief__schild">Meine Kanäle</p>
<!-- Bewusst nur der öffentliche Name, kein Login: siehe die
Begründung im Kopf von server/workspace-steckbrief.js. -->
<div class="steckbrief__kanaele" id="sb-kanaele"></div>
<p class="fehler" id="sb-fehler" role="alert" aria-live="polite"></p>
<div class="steckbrief__fuss">
<button type="button" class="knopf knopf--klein" id="sb-speichern">Profil speichern</button>
<span class="steckbrief__stand" id="sb-stand" role="status" aria-live="polite"></span>
</div>
</div>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<form id="formular" hidden>
<fieldset class="gruppe">
<legend class="gruppe__titel">Stammdaten</legend>
<p class="gruppe__text">Wer ist der Creator, und wie arbeitet er?</p>
<label class="feld-schild" for="handles">Social-Handles</label>
<textarea id="handles" rows="2" maxlength="2000"
placeholder="TikTok, Instagram, Discord …"></textarea>
<label class="feld-schild" for="nische">Nische &amp; Content-Stil</label>
<textarea id="nische" rows="2" maxlength="2000"
placeholder="Worum geht es, und wie wirkt es?"></textarea>
<label class="feld-schild" for="live_zeiten">LIVE-Zeiten &amp; Routinen</label>
<textarea id="live_zeiten" rows="2" maxlength="2000"
placeholder="Wann wird gestreamt, wie regelmäßig?"></textarea>
<label class="feld-schild" for="technik">Technik-Setup &amp; Tools</label>
<textarea id="technik" rows="2" maxlength="2000"
placeholder="PC/Handy, Kamera, Mikro, OBS …"></textarea>
</fieldset>
<fieldset class="gruppe">
<legend class="gruppe__titel">Ziele</legend>
<p class="gruppe__text">Was soll wachsen? Aus dem Konzept, Seite 5.</p>
<label class="feld-schild" for="ziel_live">LIVE-Qualität &amp; Bindung</label>
<textarea id="ziel_live" rows="2" maxlength="2000"></textarea>
<label class="feld-schild" for="ziel_content">Content-Reichweite</label>
<textarea id="ziel_content" rows="2" maxlength="2000"></textarea>
<label class="feld-schild" for="ziel_community">Community &amp; Wiederkehr</label>
<textarea id="ziel_community" rows="2" maxlength="2000"></textarea>
<label class="feld-schild" for="ziel_technik">Technische Stabilität</label>
<textarea id="ziel_technik" rows="2" maxlength="2000"></textarea>
</fieldset>
<fieldset class="gruppe">
<legend class="gruppe__titel">90-Tage-Plan</legend>
<p class="gruppe__text">Wenige Punkte, dafür verbindlich – Top&nbsp;3 aus dem Konzept.</p>
<label class="feld-schild" for="plan_prio1">Priorität 1</label>
<input id="plan_prio1" maxlength="2000" />
<label class="feld-schild" for="plan_prio2">Priorität 2</label>
<input id="plan_prio2" maxlength="2000" />
<label class="feld-schild" for="plan_prio3">Priorität 3</label>
<input id="plan_prio3" maxlength="2000" />
<div class="gruppe__raster" id="termine" hidden>
<div>
<label class="feld-schild" for="plan_start">Plan-Start</label>
<input id="plan_start" type="date" />
</div>
<div>
<label class="feld-schild" for="naechster_review">Nächster Review</label>
<input id="naechster_review" type="date" />
</div>
</div>
</fieldset>
<!-- Nur für DogFather. Der Server schickt dieses Feld an Creator
gar nicht erst mit. -->
<fieldset class="gruppe gruppe--intern" id="gruppe-intern" hidden>
<legend class="gruppe__titel">Interne Notiz</legend>
<p class="gruppe__text">
Sieht <strong>nur DogFather</strong>. Der Creator bekommt dieses Feld
weder angezeigt noch übertragen.
</p>
<!-- Beschriftung ergänzt 04.09.2026 (Audit): Als einziges der
vierzehn Felder auf dieser Seite hatte dieses keine. Die
Überschrift der Gruppe steht zwar darüber, gehört für ein
Vorleseprogramm aber nicht zum Feld -- dort kam schlicht
"Textfeld" an, ohne zu sagen, wofür. -->
<label class="feld-schild" for="admin_notiz">Interne Notiz zum Creator</label>
<textarea id="admin_notiz" rows="4" maxlength="2000"></textarea>
</fieldset>
<div class="speicher-leiste">
<button type="submit" class="knopf knopf--klein" id="speichern">Speichern</button>
<span class="leise" id="stand"></span>
</div>
</form>
<!-- DAS TEAM (01.09.2026). Steht auch hier, weil ein Creator nur diese
eine Seite hat: Er soll sehen, wer ihn betreut -- mit Gesicht, nicht
nur mit Namen. Wen er sehen darf, entscheidet der Server; für ihn
sind das seine Betreuer und das Management, nicht die anderen
Creator. Für alle übrigen Rollen wird der Block hier gar nicht erst
aufgebaut, sie haben ihn auf steckbrief.html. -->
<section class="team-block" id="team-block" hidden>
<div class="team-block__kopf">
<div>
<p class="feldschild">Das Team</p>
<h2 class="team-block__titel">Wer hier mitarbeitet</h2>
</div>
<span class="team-block__zahl" id="team-zahl"></span>
</div>
<p class="team-block__text" id="team-text"></p>
<div class="team-gitter" id="team"></div>
</section>
</main>
<script src="assets/js/wahl.js?v=202609060056" defer></script>
<script src="assets/js/bereiche.js?v=202609060056" defer></script>
<script src="assets/js/kopf.js?v=202609060056" defer></script>
<script src="assets/js/glocke.js?v=202609060056" defer></script>
<script src="assets/js/steckbrief.js?v=202609060056" defer></script>
<script src="assets/js/profil.js?v=202609060056" defer></script>
</body>
</html>