Files
dogfather-universe/workspace/buehne.html
T
DogFatherGitandClaude Opus 5 fdadd5d573 Teilen gibt einen fertigen Discord-Beitrag -- und die zwei Seiten bekommen ein Gesicht
Filipe: "beim teilen wird auch nur der link geteilt, und ich will dass
wenn ich es teile im discord der agentur, dass ein banner und ein
kompletter fertiger text fuer die creator entsteht und nicht einfach
der link kopiert wird damit die leute drauf gehen. das ist kake."
Und: "perfektionier die zwei events kategorien. ich will es noch viel
krasser und spezieller."

EIN LINK IN EINEM DISCORD-KANAL IST EINE AUFFORDERUNG. Wer ihn nicht
anklickt -- und das sind die meisten -- weiss nicht, dass es die
Kampagne gibt. Was in Discord steht, muss die Kampagne SEIN. Der
Teilen-Knopf legt deshalb einen fertigen Beitrag in die Zwischenablage:
Titel als Ueberschrift, Zeitraum, Einleitung, die Aufgaben als Liste,
die Geschenke mit Coinpreis, "Gut zu wissen" aus Rangliste, Zeitplan
und Teilnahme. Er steht zusaetzlich sichtbar unter der Kachel, mit
Zeichenzaehler und zweitem Kopierknopf -- was man nicht gesehen hat,
fuegt man blind ein.

ZWEI DINGE SIND DABEI NICHT BELIEBIG:
  - Der Link steht GANZ AM ENDE. Discord setzt die Bannervorschau
    UNTER die Nachricht; steht er oben, schiebt das Banner den Text
    aus dem Blick.
  - Der Link steht NACKT da. Spitze Klammern unterdruecken die
    Vorschau -- und damit genau das Banner, um das es geht.

2000 ZEICHEN, UND NICHT EINS MEHR. Gekuerzt wird auf dem Server, in
fester Reihenfolge und an Abschnittsgrenzen: erst "Gut zu wissen",
dann die Einleitung auf zwei Saetze, dann die Geschenke. Titel,
Zeitraum, Aufgaben und Link bleiben IMMER. Gemessen gegen sieben
Laengen und einen 1500-Zeichen-Titel als Haertefall.

Gebaut wird der Beitrag aus `teilenDaten()` -- derselben Funktion, aus
der auch die offene Seite entsteht. Zwei Aufbauten fuer dasselbe Event
wuerden irgendwann Verschiedenes sagen, und niemand koennte entscheiden,
welcher recht hat.

DIE ZWEI SEITEN: ein gezeichnetes Wappen in der Farbe der Spalte, ein
Kopf mit Lichtkante und Verlauf, der beim Scrollen oben stehen bleibt,
und eine Lagezeile ("2 laufen - 1 kommt - 3 vorbei"). Gezaehlt mit
derselben Regel, die die Gruppen darunter bildet; was null ist,
erscheint nicht. Augenschonend bleibt es ueber Form und Tiefe, nicht
ueber Leuchtkraft.

NEBENBEFUND, BEHOBEN: Der Einlesekasten war durch Seitenwahl und
Bildweg auf 521 px gewachsen -- auf 412 px mehr als ein halber
Telefonbildschirm, bevor man die erste Kachel sieht. Er klappt jetzt zu
(82 px) und merkt sich die Wahl; ein Druck, und er bleibt offen.

BERICHTIGT, WEIL GEMESSEN:
  - Der Bindestrich wurde entwertet: "4\-woechige", "Ahorn\-Welt". In
    Discord ist "-" nur am Zeilenanfang eine Aufzaehlung.
  - Das Klappschild hatte nur eine Handy-Regel und sonst kein
    Aussehen -- auf 1400 px ein nackter Knopf mit 27 px statt 48.
  - bild-kampagne mass elementFromPoint ausserhalb des
    Sichtfensters und meldete "etwas liegt auf dem Knopf", wo nichts
    lag; und r(null) liess den ganzen Lauf abstuerzen, statt die
    Zusicherung rot zu machen.
  - EINE GEGENPROBE WAR BLIND: DISCORD_MAX von 2000 auf 99999 zu
    setzen liess die Pruefung gruen -- der Testbeitrag ist 1230
    Zeichen lang, die Grenze wurde also nie geprueft. Jetzt mit einem
    Beitrag, der ohne Kuerzung sicher zu lang waere.

GEPRUEFT: 190 (Route und Teilen, +8), 183 (Kachel, +13), 69 Messungen
(Bild, +2), 67 (Agentur), 43 (Bildleser), struktur, css-klassen,
zeichen, deutsche-texte, tippziele. Sechs Gegenproben: Link nur noch
Link, Link oben statt unten, Grenze weg, Lagezeile weg, Kopf klebt
nicht, Kasten wieder offen -- alle sechs werden bemerkt, alle Dateien
byte-gleich wiederhergestellt.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-10-08 11:20:51 +02:00

70 lines
3.0 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" />
<title>Bühne – das laufende Video</title>
<!-- ======================================================================
DAS LAUFENDE VIDEO ALS BROWSER-QUELLE (28.09.2026)
Zeigt das Video, das gerade in der Reaction läuft — auf dieselbe
Sekunde wie bei allen anderen. Sonst nichts: kein Chat, keine
Kameras, keine Bedienung, kein Rand.
WARUM DIE EIGENE KAMERA HIER NICHT DRIN IST: Sie ist in OBS
direkt als Gerät verfügbar, in besserer Qualität und frei in
Größe und Lage. Den Umweg über den Browser zu nehmen hieße,
Qualität gegen nichts einzutauschen — und die Größe wäre dann
festgelegt statt frei.
Sind GÄSTE im Bild, kommen deren Kameras über eine
Direktverbindung an, und die braucht eine angemeldete Seite.
Dafür gibt es den Bühnenmodus der Reaction-Seite
(`reaktion.html?nur=buehne`), der als Fenster aufgenommen wird.
In OBS: Quelle → Browser → diese Adresse, 1920 × 1080,
„Steuerung anzeigen" aus.
====================================================================== -->
<style>
html, body {
margin: 0; padding: 0;
background: #000;
height: 100%; overflow: hidden;
font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
}
#platz { position: fixed; inset: 0; }
#platz iframe { width: 100%; height: 100%; border: 0; display: block; }
/* ==== BEI „NUR KAMERA" GEHT DAS BILD AUS ========================
Sonst läge im Stream ein stehengebliebenes YouTube-Bild unter
den Kameras — und Filipe sähe es nicht, weil er in OBS auf
seine Szene schaut und nicht auf die Quelle.
`visibility` UND NICHT `display`. Ein Spieler, den man aus dem
Seitenaufbau nimmt, hört auf zu dekodieren; beim Zurückschalten
müsste er erst wieder an die richtige Stelle springen, und das
sehen dann alle. So läuft er weiter, nur eben unsichtbar, und
ist in derselben Sekunde wieder da. */
body[data-bild="aus"] #platz { visibility: hidden; }
/* Was zu sehen ist, wenn gerade nichts läuft. Schwarz und still --
eine Beschriftung stünde im Stream. Nur bei einem falschen
Schlüssel gibt es einen Hinweis, denn den sieht man sonst nie. */
.obs-fehler {
position: fixed; left: 16px; top: 16px;
padding: 10px 14px; border-radius: 10px;
background: rgba(140, 20, 30, .9); color: #fff; font-size: 14px;
}
</style>
<!-- DIE WERBEEINBLENDUNG. Dieselbe Datei wie in der Reaction-Seite:
Zwei Fassungen altern unterschiedlich, und dann sieht der Stream
anders aus als das, worueber geredet wird. -->
<link rel="stylesheet" href="assets/css/werbung.css?v=202610081119" />
</head>
<body class="obs-buehne">
<div id="platz"></div>
<script src="assets/js/werbung.js?v=202610081119" defer></script>
<script src="assets/js/buehne.js?v=202610081119" defer></script>
</body>
</html>