Files
dogfather-universe/workspace/content.html
T
DogFatherGitandClaude Opus 5 d2f02ba84e Spenden: Stufen gestaltbar, Bild hochladen, Größe je Stufe
Filipes Wunsch: „mach paar fertige und so dass ich auch hochladen
kann. auch so dass ich das anders gestalten kann oder die größe
verändern kann. ... auch spezielle sachen bei speziellen spenden."

WAS ES SCHON GAB, WAS FEHLTE
Drei Stufen ab Werk, fünf gezeichnete Zeichen, Farbe und Dauer je
Stufe — und sogar schon ein Feld für ein eigenes Bild. Es fehlte der
Weg, das alles zu ÄNDERN: Um eine Stufe umzubenennen, hätte jemand in
die Datenbank greifen müssen.

DIE GRÖSSE IST DAS „SPEZIELLE BEI SPEZIELLEN SPENDEN"
Je Stufe, nicht einmal für alle: Eine Rudel-Legende darf größer
dastehen als ein Danke. Eine einzige Größe für alle wäre wieder eine
Preisliste. Umgesetzt als EINE Schriftgröße, alles darin in `em` —
nicht `transform: scale()`, denn die Karte kommt schon mit
`translateX()` herein, und zwei `transform` an derselben Stelle
schließen einander aus; außerdem wird Text beim Skalieren matschig.
Nur nach oben (1 bis 2,5), und das ist eine ehrliche Grenze: Das
kleinste Wort auf der Karte steht bei 11,52 px, die Hausgrenze ist
11,5. Ein Faktor von 0,8 machte daraus 9,2 px. Kleiner geht an der
richtigen Stelle — die OBS-Tafel hat ihren eigenen Regler in der
Adresse, dort ist es eine Videoeinblendung und kein Text zum Lesen.

AUSPROBIEREN, OHNE EINE SPENDE ANZULEGEN
Der naheliegende Weg wäre gewesen: eine Spende eintragen und danach
löschen. Das ist verboten — in ein laufendes System kommen keine
Testdaten, und „gelöscht" heißt bei Geld nicht „war nie da". Die
Probe schreibt deshalb NICHTS und geht nur an den, der drückt; eine
Probe im ganzen Saal wäre eine Spende, die es nicht gab.

DREI FEHLER, DIE DIE PRÜFUNG GEFUNDEN HAT

1. `protokolliere()` wurde an 17 Stellen falsch herum gerufen —
   `(personId, aktion, detail, ip)` statt `(aktion, {…})`. JavaScript
   beschwert sich nicht: Das zweite Argument war ein Text, und einen
   Text zu zerlegen ergibt lauter `undefined`. Auf dem echten Server
   nachgemessen: 39 Protokollzeilen mit Aktionen wie „16.0", alle
   ohne Person, ohne Detail, ohne IP. Betroffen waren Material,
   Hilfe, Bühne, Reaction und Spenden — also jede Änderung an
   Dogi-Media und jede Maßnahme im Live-Chat, ausgerechnet das,
   wofür es ein Protokoll gibt. Alle 17 berichtigt, und
   pruef-struktur wacht jetzt darüber (mit Gegenprobe).

2. Beim Speichern der Leiter bekam jede Stufe eine NEUE Kennung
   (DELETE + INSERT). Ein Bild-Hochladen gegen die eben noch gültige
   Kennung antwortete mit 404 — im Alltag trifft das jeden, der einen
   zweiten Bildschirm offen hat. Jetzt werden vorhandene Zeilen
   geändert statt ersetzt; das Bild bleibt von selbst daran hängen.

3. `ab_cent` ist eindeutig. Zwei Stufen ihre Beträge tauschen zu
   lassen scheiterte mit „UNIQUE constraint failed", obwohl das
   Ergebnis in Ordnung gewesen wäre: Beim Umschreiben stößt die
   Leiter auf sich selbst. Jetzt in drei Schritten — löschen,
   geparkte Zwischenwerte, endgültige Werte —, und das ist nach
   außen nie sichtbar.

UND DREI, DIE IN MEINER MESSUNG STECKTEN
Die Messung hat eine noch laufende Karte aus dem vorigen Abschnitt
erwischt und daraus drei Fehler gemeldet, die keine waren —
darunter „die Probe läuft im ganzen Saal". Sie zählte außerdem die
versteckten Dateifelder als zu kleine Tippziele. Jetzt räumt sie
vorher auf, wartet auf die Karte MIT DER ERWARTETEN GRÖSSE (die
Karten laufen in einer Schlange — einen Knoten zu entfernen beendet
sie nicht) und lässt die Einblendung zur Ruhe kommen, bevor sie misst.
Ein Bildschirmfoto aus der Einblendphase sah aus, als stünde die
Karte links heraus; nachgemessen: links 18 px, ganz im Bild.

GEMESSEN, NICHT ANGENOMMEN
Karte bei Größe 1: Schrift 16 px, Betrag 25,92 px. Bei Größe 2:
32 px und 51,84 px — Faktor exakt 2,00. Hätte eine einzige Regel noch
in `rem` gestanden, wäre die Karte ungleichmäßig gewachsen, und auf
einem Bild sieht beides nur „größer" aus.

AUCH DAS BILD IST GEPRÜFT
Es liegt am Bühnen-Router und nicht am Spenden-Router: Die
Spendentafel in OBS hat keine Anmeldung, und ein 401 als JSON in
einem `<img>` ergibt ein kaputtes Bild ohne jeden Hinweis. Ohne
Schlüssel, aber mit 128 Bit zufälligem Dateinamen — dieselbe
Größenordnung wie der Bühnenschlüssel, und es ist ein Zierbild, das
ohnehin im Stream steht. Kein Ausbruch aus dem Ordner (vier Wege
geprüft, gemessen wird die Wirkung und nicht der Statuscode).

NACHGETRAGEN AUS BLOCK 4
`reaktion_meldungen` fehlte im Löschkonzept — eine bestehende Prüfung
hat es gefunden. 30 Tage nach dem Erledigen; meistens sind sie
ohnehin früher weg, weil der Live-Chat beim Beenden gelöscht wird und
die Meldungen daran hängen. Wer meldet, muss sich darauf verlassen
können, dass daraus keine dauerhafte Liste wird.

GEPRUEFT
pruef-spenden: 95 Prüfungen (vorher 46), 0 Fehler.
pruef-reaktion 260, pruef-buehne 36, pruef-aufbewahrung 45,
pruef-struktur, pruef-meldungen, pruef-css-klassen, pruef-tippziele,
pruef-deutsche-texte, pruef-auskunft alle grün.
mess-reaktion und mess-buehne: Rückgabewert 0, kein ACHTUNG.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-28 10:14:26 +02:00

194 lines
8.6 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>Content-Ideen · 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=202609281013" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609281013" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609281013" />
<link rel="stylesheet" href="assets/css/start.css?v=202609281013" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609281013" />
<link rel="stylesheet" href="assets/css/content.css?v=202609281013" />
<link rel="stylesheet" href="assets/css/module.css?v=202609281013" />
<!-- 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=202609281013" />
</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> · Content</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 inhalt--breit">
<section class="kopf-zeile">
<div>
<p class="marke">Betreuung</p>
<h1 class="titel">Content-Ideen</h1>
<p class="unterzeile" id="unterzeile">
Von der Idee bis zum Upload – eine Strecke, kein Terminkalender.
</p>
</div>
<button type="button" class="knopf knopf--klein" id="neu-oeffnen">Video anlegen</button>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- Kennzahlen. Bewusst wenige und jede mit einer Handlung dahinter –
eine Zahl ohne Vergleich ist eine Eitelkeitszahl. -->
<!-- Die Kennzahlen-Reihe stand hier bis zum 01.09.2026 ("diese Kisten
sind jetzt ueberall zu viel, die sollen weg"). Die Strecke darunter
zeigt dieselben Zahlen an jeder Spalte. -->
<!-- Säulen-Balance: gestapelter Balken, 90 Tage, nur Veröffentlichtes. -->
<section class="balance" id="balance" hidden>
<div class="klapp-kopf">
<p class="feldschild">Womit der Kanal gefüllt wird <span class="leise" id="balance-zeit"></span></p>
<button type="button" class="knopf-still" id="saeulen-oeffnen">Säulen verwalten</button>
</div>
<div class="balance__balken" id="balance-balken" role="img" aria-label="Verteilung auf die Content-Säulen"></div>
<ul class="legende" id="balance-legende"></ul>
<p class="balance__hinweis" id="balance-hinweis"></p>
</section>
<!-- Säulen verwalten. Zugeklappt, weil man das selten anfasst. -->
<section class="saeulen-kasten" id="saeulen-kasten" hidden>
<div class="klapp-kopf">
<p class="feldschild">Content-Säulen</p>
<button type="button" class="knopf-still" id="saeulen-zu">Schließen</button>
</div>
<p class="block__frage">
Drei bis fünf Themen, aus denen der Kanal besteht. Als Richtwert gilt
<strong>70 % Wert</strong> (Unterhaltung, Hilfe), <strong>20 % Community</strong>,
<strong>10 % Eigenwerbung</strong>. Eine Säule wird erst brauchbar, wenn Formate an ihr hängen.
</p>
<div id="saeulen-liste"></div>
<form class="saeule-neu" id="saeule-neu">
<div class="feld feld--saeule-creator" id="feld-saeule-creator" hidden>
<label class="feld-schild" for="s-creator">Für</label>
<select id="s-creator"></select>
</div>
<div class="feld">
<label class="feld-schild" for="s-name">Name der Säule</label>
<input id="s-name" maxlength="40" placeholder="z. B. Tutorials" required />
</div>
<div class="feld feld--schmal">
<label class="feld-schild" for="s-ziel">Ziel-Anteil %</label>
<input id="s-ziel" type="number" min="0" max="100" step="5" placeholder="z. B. 70" />
</div>
<button type="submit" class="knopf knopf--klein">Hinzufügen</button>
</form>
</section>
<!-- Formular für ein neues Video -->
<form class="neu" id="neu" hidden>
<div class="neu__raster">
<div class="feld feld--breit">
<label class="feld-schild" for="f-titel">Worum geht es?</label>
<input id="f-titel" name="titel" maxlength="160" required
placeholder="z. B. „3 Fehler beim ersten LIVE“" />
</div>
<div class="feld feld--breit">
<label class="feld-schild" for="f-hook">
Hook <span class="leise">– die ersten Sekunden, sie entscheiden über alles</span>
</label>
<input id="f-hook" name="hook" maxlength="300"
placeholder="z. B. „Ich hab 4 Monate gebraucht, um das zu kapieren.“" />
</div>
<div class="feld" id="feld-creator" hidden>
<label class="feld-schild" for="f-creator">Creator</label>
<select id="f-creator"></select>
</div>
<div class="feld">
<label class="feld-schild" for="f-art">Stufe</label>
<select id="f-art"></select>
</div>
<div class="feld">
<label class="feld-schild" for="f-saeule">Säule</label>
<select id="f-saeule"></select>
</div>
<div class="feld">
<label class="feld-schild" for="f-format">Format</label>
<input id="f-format" maxlength="60" list="formate" placeholder="z. B. Tutorial" />
<datalist id="formate">
<option value="Talking Head"></option>
<option value="Tutorial"></option>
<option value="Story"></option>
<option value="LIVE-Ausschnitt"></option>
<option value="Vorher/Nachher"></option>
<option value="Reaktion"></option>
<option value="Behind the Scenes"></option>
</datalist>
</div>
<div class="feld">
<label class="feld-schild" for="f-geplant">Soll raus am</label>
<input id="f-geplant" type="date" />
</div>
<div class="feld feld--breit">
<label class="feld-schild" for="f-text">Ablauf, Notizen (optional)</label>
<textarea id="f-text" rows="3" maxlength="6000"></textarea>
</div>
</div>
<p class="fehler" id="neu-fehler" role="alert" aria-live="polite"></p>
<div class="neu__knoepfe">
<button type="submit" class="knopf knopf--klein" id="neu-speichern">Anlegen</button>
<button type="button" class="abmelden" id="neu-abbrechen">Abbrechen</button>
</div>
</form>
<div class="filterzeile" id="filterzeile"></div>
<!-- Die Strecke. Fünf Spalten, auf dem Handy untereinander. -->
<!-- Fertige Ideen zum Uebernehmen. Steht VOR der Strecke: Wer noch
nichts hat, soll nicht erst an leeren Spalten vorbeiscrollen. -->
<div id="vorlagen" hidden></div>
<div class="strecke" id="strecke" aria-busy="true">
<p class="leise">Wird geladen …</p>
</div>
</main>
<script src="assets/js/meldung.js?v=202609281013" defer></script>
<script src="assets/js/nachfrage.js?v=202609281013" defer></script>
<script src="assets/js/wahl.js?v=202609281013" defer></script>
<script src="assets/js/bereiche.js?v=202609281013" defer></script>
<script src="assets/js/installieren.js?v=202609281013" defer></script>
<script src="assets/js/kopf.js?v=202609281013" defer></script>
<script src="assets/js/glocke.js?v=202609281013" defer></script>
<script src="assets/js/checkliste.js?v=202609281013" defer></script>
<script src="assets/js/content.js?v=202609281013" defer></script>
</body>
</html>