DogFatherGitandClaude Opus 5
69517e090b
`pruef-chat-ausbau` stand seit dem 28.09. rot:
FEHL die Stelle bleibt stehen (0 -> 3574)
FEHL der Knopf sagt, wie viel wartet ("Zum neuesten")
FEHL er zaehlt mit ("Zum neuesten")
FEHL pruef-chat-ausbau: unbehandelter Fehler (der Knopf blieb verborgen)
WAS WIRKLICH PASSIERTE: Man liest weiter oben im Verlauf, jemand
schreibt -- und man wird ans Ende gerissen. Der Zaehler „1 neue
Nachricht" wurde dabei zurueckgesetzt, der Knopf blieb verborgen.
DIE URSACHE STAND AN DER FALSCHEN STELLE. Die Zuhoerer, die „der
Mensch hat selbst gescrollt" feststellen (Rad, Finger, Taste,
Zeiger), hingen INNERHALB des Sprung-Blocks zur Neu-Linie -- wurden
also erst angehaengt, NACHDEM einmal gesprungen worden war.
In einem ruhigen Gespraech passiert das nie: Wer alles gelesen hat,
bekommt keine Neu-Linie, der Block laeuft nicht, die Zuhoerer gibt es
nicht. Scrollt er hoch und es kommt eine Nachricht, entsteht die
Linie ZUM ERSTEN MAL -- der Block laeuft, haengt die Zuhoerer an und
springt im selben Atemzug. Das Hochscrollen von vorhin hat nie jemand
bemerkt.
Das ist der haeufigste Fall ueberhaupt: ein stiller Chat, man liest
etwas weiter oben nach, jemand schreibt.
Die Wache steht jetzt beim Aufbau, bei den uebrigen Zuhoerern des
Verlaufs. Ausdruecklich NICHT am `scroll`-Ereignis: Der Sprung
scrollt selbst, und `scroll` unterscheidet nicht, wer gescrollt hat.
Rad, Finger, Taste und Zeiger tut nur ein Mensch.
UND DIE PRUEFUNG HAT SELBST GEMOGELT. Sie schrieb `e.scrollTop = 0`
-- das setzt die Bildlaufposition zu, ohne dass ein Rad gedreht
wurde. Damit haette sie den Fehler auch nach der Behebung noch
gemeldet. Sie dreht jetzt das Rad (`mouse.wheel`) und prueft, dass
sie oben angekommen ist. Dieselbe Lehre wie bei den Fingergeraeten:
`setViewportSize` macht aus einer Maus keinen Finger, und
`scrollTop = 0` macht aus einem Programm keinen Leser.
Nachher: 70 Pruefungen, 0 Fehler (vorher 24/4).
die Stelle bleibt stehen (0 -> 0)
der Knopf sagt, wie viel wartet ("1 neue Nachricht")
er zaehlt mit ("2 neue Nachrichten")
wer unten steht, wird weiterhin mitgenommen -- ohne Knopf
Alle sieben Chatpruefungen gruen: anhaenge 123/0, aufloesen 126/0,
ausbau 70/0, kanaele 81/0, neu-stelle 63/0, neu 36/0, optik 62/0.
Co-Authored-By: Claude Opus 5 <[email protected]>
87 lines
3.2 KiB
HTML
87 lines
3.2 KiB
HTML
<!doctype html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Spendentafel</title>
|
|
<!-- ======================================================================
|
|
DIE SPENDENTAFEL FÜR OBS UND TIKTOK STUDIO (28.09.2026)
|
|
|
|
Eine Browser-Quelle, die nichts zeigt als die Spendenkarten — auf
|
|
DURCHSICHTIGEM Grund, damit sie über dem Bild liegen kann.
|
|
|
|
KEINE ANMELDUNG, SONDERN EIN SCHLÜSSEL. OBS speichert die
|
|
Anmeldung einer Browser-Quelle nicht zuverlässig; eine Quelle,
|
|
bei der man sich nach jedem Programmstart neu anmelden muss, ist
|
|
mitten in einer Sendung unbrauchbar. Ohne gültigen Schlüssel
|
|
antwortet der Server mit 404 und diese Seite bleibt leer.
|
|
|
|
SIE ZEIGT NUR, WAS OHNEHIN IM STREAM STEHT: Betrag, Name, Gruß,
|
|
Stufe. Kein Chat, keine Namen von Zusehenden, keine Bedienung.
|
|
|
|
In OBS: Quelle → Browser → diese Adresse, Breite 1920, Höhe 1080,
|
|
„Eigenes CSS" leer lassen (der Grund ist schon
|
|
durchsichtig).
|
|
====================================================================== -->
|
|
<link rel="stylesheet" href="assets/css/spendenkarte.css?v=202609301122" />
|
|
<style>
|
|
/* DURCHSICHTIG BIS AUF DIE KARTEN. OBS legt die Quelle über das
|
|
Bild; jede Fläche, die hier steht, deckt dort etwas zu. */
|
|
html, body {
|
|
margin: 0; padding: 0;
|
|
background: transparent;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
|
|
}
|
|
/* Der Kasten für die Karten füllt das Bild. Wo sie erscheinen,
|
|
entscheidet die Ausrichtung — unten links, wie im Saal. */
|
|
.obs-tafel {
|
|
position: fixed;
|
|
inset: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: flex-end;
|
|
align-items: flex-start;
|
|
gap: 14px;
|
|
padding: 48px;
|
|
pointer-events: none;
|
|
}
|
|
/* Auf der Bühne darf sie größer sein als im Saal: Hier deckt sie
|
|
nichts zu, was man lesen müsste. */
|
|
/* ALLES IN rem. Ein einziger Wert am Wurzelelement (`&g=` in der
|
|
Adresse) nimmt damit Schrift, Bild, Polsterung und Rundung
|
|
gleichmäßig mit. In Pixeln wäre das die Sorte Zahl, die man an
|
|
zwölf Stellen nachziehen muss. */
|
|
.obs-tafel .spendenkarte {
|
|
max-width: 34rem;
|
|
gap: .9rem;
|
|
padding: .85rem 1.3rem .85rem .9rem;
|
|
border-radius: 1.15rem;
|
|
}
|
|
.obs-tafel .spendenkarte__betrag { font-size: 2.1rem; }
|
|
.obs-tafel .spendenkarte__bild { width: 3.6rem; height: 3.6rem; }
|
|
.obs-tafel .spendenkarte__wer { font-size: .95rem; }
|
|
.obs-tafel .spendenkarte__stufe { font-size: .8rem; }
|
|
.obs-tafel .spendenkarte__gruss { font-size: 1rem; }
|
|
|
|
/* Steht hier gar nichts, ist das der Normalfall — keine Spende,
|
|
keine Karte. Ein Hinweis darauf wäre im Stream zu sehen. */
|
|
.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>
|
|
</head>
|
|
<body>
|
|
<div class="obs-tafel spendentafel" id="tafel" aria-live="polite"></div>
|
|
|
|
<script src="assets/js/spendenkarte.js?v=202609301122" defer></script>
|
|
<script src="assets/js/tafel.js?v=202609301122" defer></script>
|
|
</body>
|
|
</html>
|