Files
dogfather-universe/workspace/steckbrief.html
T
DogFatherGitandClaude Opus 5 a43bc565ec Werbeeinblendung fuer die Reaction: Laufband, Wechsel und zwei Bilder in sechs Ecken
Filipe: „ich will dass du auch perfektionierst dass ich einen banner
durchlaufen kann, oder erscheinen lassen kann mit werbung drauf ...
und ich will auch das dogfather logo oben rechts links unten rechts
links genau wie oben unten mittig, so dass ich es wegmachen und
hinzufuegen kann."

DAS BAND
Zwei Arten: „Laufband" zieht die Botschaften von rechts nach links,
„Wechsel" blendet sie nacheinander ein. Ein Rabattcode gehoert in den
Wechsel -- wer „DOGI10" lesen will, waehrend es wandert, hat es
gesehen und nicht behalten. Die Dauer ist einstellbar (8-40 s).

Das Band ist Glas, kein Balken: ein Verlauf, unten dicht genug, dass
jede Schrift traegt, oben offen. Man sieht das Video weiter.

Das Laufband traegt die Folge ZWEIMAL. Wandert es um 50 % seiner
Breite, steht die zweite dort, wo die erste war, und der Sprung
zurueck ist unsichtbar. Ohne sie entstuende am Ende jedes Durchlaufs
eine leere Flaeche -- das sieht aus, als sei die Einblendung
abgestuerzt.

Wer weniger Bewegung eingestellt hat, bekommt den Wechsel statt des
Laufbands -- nicht „aus". Die Werbung soll auch dann wirken.

DER RABATTCODE
Ein Wort in Grossbuchstaben mit einer Ziffer darin bekommt eine
eigene Flaeche in Bernstein: „DOGI10" ja, „VANVAN" nicht. Er ist der
einzige Teil der Botschaft, den jemand ABSCHREIBEN soll.

Der Text wird NIE als HTML eingesetzt -- die Kennzeichnung baut echte
Elemente. Sonst waere ein Eingabefeld im Regiepult ein Weg, fremdes
Markup in den Stream zu bringen.

DIE ZWEI BILDER
Der Husky und der Haekelhase aus der Zusammenarbeit mit VanVan,
jeweils an einem von sechs Plaetzen: oben und unten, je links,
mittig, rechts -- oder aus. Links und rechts mittig gibt es mit
Absicht nicht: dort liegen bei jedem Videodienst die Bedienelemente.

Zwei Bilder auf denselben Platz werden abgelehnt (400 ecke_belegt) --
sie laegen uebereinander, und man saehe von beiden nichts.

Wer unten steht, weicht dem Band aus, und die Spendentafel rueckt
hoch. Beides im Stilblatt ueber `:has`, nicht im Programm: Das Band
kennt die Tafel nicht und die Tafel kennt das Band nicht.

Der Husky ist schwarz und laege auf dunklem Videobild als Silhouette
in der Nacht. Zwei weiche helle Schatten legen eine Kontur darum --
dieselbe Loesung, die jeder Sender fuer sein Wasserzeichen nimmt.

IM STREAM, NICHT NUR IM SAAL
Beides laeuft in der Buehnenquelle mit, die OBS abfilmt, mit
groesserer Schrift (24 statt 18 px) -- ein Stream wird auf einem
Handy gesehen, oft in einem Viertel des Bildes. Gemessen: die OFFENE
Quelle zieht eine Umschaltung nach, ohne dass die Szene neu geladen
werden muss.

EINE QUELLE, NICHT DREI
`werbungStand()` steht in `reaktion-tabellen.js` und wird von Saal,
Regie und Buehne aufgerufen. Erst standen dort drei Abschriften
derselben Abfrage; beim Entfernen der Datenbank-Kennung habe ich eine
davon geaendert, und die anderen lieferten sie weiter.

WAS DIE PRUEFUNGEN DABEI GEFUNDEN HABEN
- pruef-buehne: Die Botschaften trugen ihre Datenbank-Kennung in die
  OBS-Auskunft, die nur mit einem Schluessel geschuetzt ist. Die
  Feldliste geht jetzt zwei Ebenen tief -- eine abschliessende Liste,
  die nur die oberste kennt, laesst sich umgehen, indem man ein Feld
  in ein vorhandenes Objekt legt.
- pruef-reaktion: Acht Fehlerwoerter ohne deutschen Satz. Nachgetragen
  im Hausstil: was nicht geht UND was stattdessen.
- pruef-struktur: Die Suche nach totem CSS las `buehne.html` und
  `tafel.html` nicht -- eine Ausnahme, die fuer eine ganz andere
  Frage gemacht war (Startbildschirm-Symbol). Sie haette verlangt,
  `.obs-buehne` zu loeschen, also die Regel, die den Stream traegt.
- pruef-tippziele: Erkannte als Anhebung nur `min-height`/`min-width`.
  Ein `height: 44px` im Fingerblock hebt genauso -- Fehlalarm, und
  ein Fehlalarm an einer Pruefung, die nach jeder Aenderung laeuft,
  wird weggeklickt. Zwei Gegenproben dazu.
- mess-reaktion: Die Regieleiste am Handy wurde gegen die feste Zahl
  SIEBEN geprueft und meldete „zeigt nur 8 von 7". Sie zaehlt jetzt
  selbst.
- mess-buehne: Die Konsolenmeldung zeigte dauerhaft vier
  Fehlschlaege, alle von den Pruefungen selbst bestellt. Jetzt eng
  gefiltert, benannt, mit Gegenprobe -- und ein UNERWARTETER
  Fehlschlag in der Quelle, die in den Stream geht, faellt ab sofort
  durch.

Gemessen: mess-reaktion 0, mess-buehne 0, pruef-reaktion 383/0,
pruef-buehne 38/0, pruef-tippziele 13/0, pruef-struktur 44/0,
pruef-css-klassen 0, pruef-haus-trennung 100/0, pruef-haus-seiten 38/0.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-29 17:16:26 +02:00

166 lines
7.7 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>Mein Steckbrief · Spicy & Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<!-- Die Farbe der Fensterleiste, wenn der Workspace als App laeuft.
Stand auf #0674b9 (kraeftiges Blau) und stach damit als einziger
heller Balken ueber einer durchweg dunklen Seite. Jetzt derselbe
Ton wie die Kopfleiste darunter (#06090f), damit Leiste und Seite
eine Flaeche sind statt zweier. -->
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609291714" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609291714" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609291714" />
<link rel="stylesheet" href="assets/css/start.css?v=202609291714" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609291714" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609291714" />
<link rel="stylesheet" href="assets/css/module.css?v=202609291714" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609291714" />
</head>
<body class="start">
<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> · Mein&nbsp;Steckbrief</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">Über mich</p>
<h1 class="titel">Mein Steckbrief</h1>
<p class="unterzeile">
Das hier gehört dir. Dein Bild steht danach in der Kopfleiste, in der
Personenliste und überall dort, wo dein Name auftaucht.
</p>
</div>
</section>
<!-- Der eigene Steckbrief. Steht GANZ OBEN und über allem anderen: Er
gehört jedem im Workspace, nicht nur Creatorn – ein Scout, ein
Manager und DogFather haben ihn genauso. Die Creator-Akte darunter
ist etwas anderes (die führen die Betreuer). -->
<section class="steckbrief" id="steckbrief" 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>
<!-- DAS TEAM. Wunsch vom 01.09.2026: "ich will, dass wir Manager,
Scouts, DogFather auch die Fotos, Namen und so alles sehen, alles
was die in ihrem Profil eintragen."
Bis dahin war der Steckbrief eine Einbahnstraße: Jeder pflegte
seinen, und niemand bekam ihn je zu Gesicht. Die Schnittstelle
dafür lag fertig da (GET /workspace/api/steckbrief) und wurde von
keiner einzigen Seite aufgerufen.
Wer wen sieht, entscheidet weiterhin der Server. -->
<!-- EIGENE KLASSEN, nicht die vorhandenen .block__* : Die stehen in
automation.css und wissen.css, und diese Seite lädt beide nicht.
Genau so sind hier schon zweimal Stile ins Leere gelaufen -- der
Aufbau sah richtig aus, auf dem Bildschirm stand nacktes HTML.
Alles zu .team-* steht in start.css, die jede Seite lädt. -->
<section class="team-block" id="team-block" hidden>
<div class="team-block__kopf">
<div>
<p class="feldschild">Das Team</p>
<!-- „Wer hier dabei ist" statt „Wer hier mitarbeitet" (19.09.2026).
Seit die Community einen Steckbrief hat, liest diesen Titel
auch jemand, der NICHT mitarbeitet — er schaut zu. Das Wort
hätte ihm gesagt, dass er hier eigentlich nicht gemeint ist. -->
<h2 class="team-block__titel">Wer hier dabei ist</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>
<!-- ==== WAS IST ÜBER MICH GESPEICHERT? (15.09.2026) ==============
Art. 15 DSGVO. Kein Antrag, kein Formular, kein Warten – ein
Knopf. Er steht auf den beiden Seiten, die einem Menschen selbst
gehören: dem Steckbrief und den Rudel-Regeln. Die Community hat
keinen Steckbrief; ohne die zweite Stelle hätte ausgerechnet die
Gruppe mit den wenigsten Rechten auch diesen nicht. -->
<section class="meine-daten">
<div class="meine-daten__kopf">
<h2 class="meine-daten__titel">Was ist über mich gespeichert?</h2>
<button type="button" class="knopf-still" id="auskunft-knopf">Datei herunterladen</button>
</div>
<p class="meine-daten__satz">
Alles, was dieser Workspace über dich weiß, als Datei zum Mitnehmen.
Zugangsgeheimnisse sind nicht dabei, und wo andere Menschen vorkommen,
stehen sie nicht mit Namen darin – ihre Daten gehören ihnen.
</p>
<p class="leise" id="auskunft-stand" hidden></p>
</section>
</main>
<script src="assets/js/meldung.js?v=202609291714" defer></script>
<script src="assets/js/hochladen.js?v=202609291714" defer></script>
<script src="assets/js/nachfrage.js?v=202609291714" defer></script>
<script src="assets/js/wahl.js?v=202609291714" defer></script>
<script src="assets/js/bereiche.js?v=202609291714" defer></script>
<script src="assets/js/installieren.js?v=202609291714" defer></script>
<script src="assets/js/kopf.js?v=202609291714" defer></script>
<script src="assets/js/auskunft.js?v=202609291714" defer></script>
<script src="assets/js/glocke.js?v=202609291714" defer></script>
<script src="assets/js/steckbrief.js?v=202609291714" defer></script>
</body>
</html>