DogFatherGitandClaude Opus 5
2d14907d0d
Filipe: "dan will ich auch dass man im chat auch sprachnachrichten und
gifts reinschicken kann. also nur die modis rechte linke hand und
dogfather."
Dieser Commit macht die Sprachnachrichten. Die GIFs kommen als
naechstes -- ich lese "gifts" als GIFs und sage das ausdruecklich,
statt es stillschweigend anzunehmen.
AUFNEHMEN: TIPPEN, NICHT HALTEN
-------------------------------
Gedruecktbleiben ist der bekanntere Weg und der schlechtere: Wer beim
Sprechen verrutscht, verliert die ganze Aufnahme, und mit einer Hand am
Kaffee haelt niemand neunzig Sekunden still. Einmal tippen startet, das
Haekchen schickt, das Kreuz verwirft.
Drei Minuten Hoechstdauer, danach stoppt sie von selbst -- und schickt
NICHT von selbst ab. Wer die Grenze erreicht, hat gerade mitten im Satz
aufgehoert; das ungefragt zu verschicken waere die schlechteste Sekunde
dafuer.
Unter einer Sekunde wird gar nichts geschickt: Das ist ein Versehen,
kein Inhalt.
Die Aufnahmespur wird beim Beenden UND beim Verlassen der Seite
geschlossen. Ein Mikrofon, das offen bleibt, ist ein Vertrauensbruch,
auch wenn niemand zuhoert.
DREI BEHAELTER, WEIL DIE GERAETE DREI LIEFERN
---------------------------------------------
WebM/Opus (Chrome, Android), MP4/AAC (Safari, iPhone), Ogg/Opus
(Firefox). Wer nur einen nimmt, baut eine Funktion, die bei der Haelfte
des Teams stumm bleibt -- und zwar ohne Fehlermeldung.
DER BEHAELTER ALLEIN GENUEGT NICHT: WebM und MP4 tragen genauso gut
Video. Ein Video, das als "Ton" durchginge, landete in einem
Abspielgeraet ohne Bild -- es liefe, man hoerte etwas, und niemand
wuesste, dass die Haelfte fehlt. Die Erkennung sieht deshalb auf die
KENNUNG DER SPUR: Videospur -> abgelehnt, keine Tonspur -> abgelehnt.
Kein MP3: Kein Aufnahmegeraet im Browser erzeugt MP3. Es zuzulassen
hiesse, eine Tuer fuer Musikdateien aufzumachen, nach der niemand
gefragt hat.
"ALSO NUR" IST DER PUNKT
------------------------
Fotos und PDF darf jeder schicken, auch Creator -- das war eine
Entscheidung vom 09.09. und bleibt. Ton nicht. Geprueft wird in der
Route (istTeamDogi), nicht nur im Browser: Ein ausgeblendeter Knopf ist
eine Bitte, abgelehnt wird erst am Server.
Eigene Byte-Grenze fuer Ton (4 MB statt 12). Zwoelf Megabyte sind fuer
ein Foto richtig und fuer eine Sprachnachricht sinnlos -- das waeren
rund fuenfzig Minuten am Stueck.
Die Laenge kommt vom Absender und ist damit eine BEHAUPTUNG, keine
Messung; das steht so an der Spalte. Sie dient nur der Vorschau, bis
das Abspielgeraet die wahre Laenge kennt. Was schuetzt, sind die Bytes.
"FOTO"/"PDF" STAND AN VIER STELLEN
----------------------------------
Dieselbe Aufzaehlung in Gespraechsliste, Zitat, angehefteter Nachricht
und Benachrichtigung -- jede mit ihrem eigenen Fragezeichen-Doppelpunkt.
Mit der Sprachnachricht waeren es vier Aenderungen gewesen, und die
vierte ist die, die man vergisst. Jetzt anhangWort() an einer Stelle.
DER FUND: JEDES FOTO MELDETE "KEINE VERBINDUNG"
-----------------------------------------------
Beim Anfassen derselben Funktion aufgefallen: In `anhangSchicken` stand
seit dem 19.09. `const { nachricht } = e.daten;` -- ein `e`, das es
dort nicht gibt (gemeint war `ergebnis`). Die Zeile wirft, der `catch`
daneben faengt, und der Absender liest:
"Keine Verbindung -- der Anhang wurde nicht geschickt."
Das Foto war aber da. Es kam Sekunden spaeter ueber den Ereignisstrom
in den Verlauf, mit einer roten Meldung darueber, die das Gegenteil
behauptet -- und der getippte Begleitsatz blieb im Feld stehen, also
schickt man es noch einmal.
WARUM DAS VIER TAGE UNBEMERKT BLIEB, und das ist der lehrreiche Teil:
pruef-chat-anhaenge war die ganze Zeit gruen. Sie schickt mit `fetch`
an die Route -- der bequeme Weg, und er prueft den Server gruendlich.
Sie prueft aber nicht den Weg, den ein Mensch geht. Der Fehler lag
hinter der Bueroklammer, und dort hat nie jemand hingesehen. Dazu
fuehlt er sich wie ein Netzproblem an -- und Netzprobleme sucht niemand
im Programm.
Jetzt geht ein Block durch das Dateifeld selbst und sieht auf das, was
der Mensch danach sieht: steht dort eine Meldung, und ist das Feld
leer? Gegenprobe gefahren -- mit dem alten Fehler wieder eingesetzt
werden genau diese zwei Zeilen rot, mit dem Wortlaut von oben.
Uebernommen wird eine frisch geschickte Nachricht jetzt an EINER
Stelle (nachrichtUebernehmen), fuer Anhang und Sprachnachricht. Zwei
Fassungen waeren zwei Gelegenheiten fuer denselben Fehler.
AUGENSCHONEND
-------------
Kein Blinkpunkt waehrend der Aufnahme -- der ist genau das, was die
Hausregel ausschliesst. Der Punkt atmet langsam (1,8 s, 45 bis 100 %)
und steht bei prefers-reduced-motion ganz still; die laufende Zeit
daneben traegt die Auskunft ohnehin.
Die Farben der Sprachnachricht-Blase kommen aus `--blase-leise`, der
fuer DIESE Blase ausgerechneten leisen Schrift. Eine feste Farbe waere
dieselbe Wette, die am 22.09. beim Loeschknopf 1,91:1 auf Babyblau
ergeben hat.
GEPRUEFT
--------
pruef-chat-anhaenge: 86 Pruefungen, 0 Fehler (vorher 60).
Aufgenommen wird mit MediaRecorder im echten Browser ueber den echten
Knopf, mit Chromiums erfundenem Mikrofon. Damit prueft der Abschnitt
nebenbei das, was keine gebastelte Datei pruefen koennte: ob die
Erkennung im Server versteht, was ein Browser wirklich erzeugt
(gemessen: 35 829 Bytes audio/webm, 2743 ms).
* DogFather sieht den Mikrofonknopf, der Scout nicht
* der Scout schickt dieselbe Aufnahme an der Oberflaeche vorbei:
403, und nichts davon ist gespeichert
* ein Video im Ton-Behaelter: 415
* Laenge, Vorlesewort, Bedienbarkeit, preload=metadata, Breite
* "Sprachnachricht" steht in der Gespraechsliste statt einer leeren
Zeile
pruef-chat, pruef-chat-optik: unveraendert gruen.
Co-Authored-By: Claude Opus 5 <[email protected]>
230 lines
10 KiB
HTML
230 lines
10 KiB
HTML
<!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 · 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=202609230151" />
|
||
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609230151" />
|
||
<link rel="stylesheet" href="assets/css/gate.css?v=202609230151" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609230151" />
|
||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609230151" />
|
||
<link rel="stylesheet" href="assets/css/profil.css?v=202609230151" />
|
||
<link rel="stylesheet" href="assets/css/module.css?v=202609230151" />
|
||
<!-- 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=202609230151" />
|
||
</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 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 & 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 & 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 & 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 & 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 & 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 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-Termin</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/meldung.js?v=202609230151" defer></script>
|
||
<script src="assets/js/hochladen.js?v=202609230151" defer></script>
|
||
<script src="assets/js/nachfrage.js?v=202609230151" defer></script>
|
||
|
||
<script src="assets/js/wahl.js?v=202609230151" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609230151" defer></script>
|
||
<script src="assets/js/installieren.js?v=202609230151" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609230151" defer></script>
|
||
<script src="assets/js/glocke.js?v=202609230151" defer></script>
|
||
<script src="assets/js/steckbrief.js?v=202609230151" defer></script>
|
||
<script src="assets/js/profil.js?v=202609230151" defer></script>
|
||
</body>
|
||
</html>
|