Files
dogfather-universe/workspace/anruf-probe.html
T
DogFatherGitandClaude Opus 5 a02cf5c026 Reaction: Rollen sichtbar, Moderation im Live-Chat
Filipes Wunsch: „die modis, linke hand und rechte hand soll im chat
extra aussehen und auch sachen wie stummschaltungen, sperrungen,
meldunge und alles mögliche im chat machen können falls sich jemand
nicht benimmt."

WER SPRICHT
Jeder Beitrag aus dem Team trägt jetzt ein Abzeichen: „Dogi", „Team"
(beide Hände) und „Modi". Ein WORT und nicht nur eine Farbe — rund
acht Prozent der Männer unterscheiden Rot und Grün schlecht, und hier
hängt an der Unterscheidung etwas. Gedeckte Töne auf schwacher Fläche,
11,52 px (die Hausgrenze ist 11,5), weil daneben ein Video läuft.
Die Wörter sagen den RANG nicht: Filipe steht nie über seinem Team.
Eine Prüfung schlägt an, wenn dort „Chef", „Boss" oder „Leitung"
stünde.

WAS DIE MODERATION KANN
Am Namen öffnet sich ein Menü mit vier Wegen: Beitrag wegnehmen,
10 Minuten stumm, aus der Sendung — und der Verweis in den Treff, wo
längere Maßnahmen hingehören (mit Begründungspflicht und Frist in
Tagen). Die Reaction baut kein zweites Sperrsystem daneben: Wer im
Treff eine Pause hat, schreibt hier auch nicht. Neu ist nur, was der
Treff nicht hat — MINUTEN. Höchstens eine Stunde; wer länger etwas
braucht, nimmt den Treff.
Nicht gegen das Team: Wer einen Modi stummschalten könnte, hätte einen
Weg, die Moderation selbst auszuschalten, mitten in der Sendung.

MELDEN DARF JEDER
Die Moderation sieht nicht alles, wer mitliest schon. Zweimal melden
zählt einmal (sonst füllt einer allein die Liste). Bei der Moderation
erscheint im Kopf der Schiene „1 Meldung" — nur wenn etwas offen ist;
eine Zahl, die immer dasteht und meistens null ist, wird nach drei
Tagen nicht mehr gelesen.

VIER FEHLER, DIE DABEI AUFGEFALLEN SIND

1. `oeffentlich()` nahm `meldungen` und `massnahmen` NICHT aus dem
   Rundruf. Der Rundruf wird aus dem Stand dessen gebaut, der gerade
   etwas getan hat — bei einer Moderationshandlung wären der gemeldete
   Text, der Name des Gemeldeten und der Name des MELDERS an jeden im
   Saal gegangen. Wer meldet, muss sich darauf verlassen können, dass
   das niemand sieht.

2. `meldung.js` hatte zwei Schlüssel doppelt: `geschlossen` und
   `nur_leitung`. Der spätere gewinnt stillschweigend — in der Hilfe
   stand dadurch „Der Saal ist zu". Ein Wort, ein Satz; eine Prüfung
   hält das jetzt fest.

3. Wer stummgeschaltet war, bekam bei OFFENEM Chat „Der Chat ist
   gerade zu" — der Aufrufer reimte sich den Grund aus der Chat-Stufe
   zusammen. Jetzt gibt `schreibGrund()` den echten Grund zurück.

4. Wer rausgenommen wurde, merkte nichts: Das Video lief weiter, nur
   die Anwesenheitsmeldung schlug still fehl. Jetzt hält alles an und
   es steht ein Satz da, der sagt, dass es nur für heute gilt.

UND EINER, DEN NUR DAS BILDSCHIRMFOTO GEFUNDEN HAT
Das Menü lag messbar komplett im Fenster (x=1099..1315 von 1440,
y=652..840 von 900) und war trotzdem abgeschnitten: Die Chatliste
rollt, und ein rollender Vorfahre beschneidet sein Kind. „Im Fenster"
und „sichtbar" sind zwei verschiedene Fragen, und ich hatte die
falsche gemessen. Das Menü hängt jetzt fest am Fenster und klappt nach
oben oder links, wo kein Platz ist. Die Messung fasst seitdem mit
`elementFromPoint` an jeden Knopf an, statt Rechtecke zu vergleichen.

GEPRUEFT
pruef-reaktion: 216 Prüfungen (vorher 156), 0 Fehler — zwei neue
Abschnitte. mess-reaktion misst die Moderation jetzt im echten
Browser: Abzeichen, Überlauf der Schiene, Menü, Stummschaltung beim
Betroffenen, Meldung bis zur Moderation, Rauswurf.
Dazu grün: pruef-meldungen, pruef-struktur, pruef-css-klassen,
pruef-tippziele, pruef-deutsche-texte, pruef-hilfe.

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

142 lines
6.3 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" data-haus="crew">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Anruf-Probe · Team Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<!-- KORRIGIERT AM 19.09.2026. Hier standen `basis.css` und `kopf.css` --
zwei Dateien, die es im Haus gar nicht gibt. Die Seite lud sie bei
jedem Aufruf ins Leere und stand damit OHNE die Hausfarben da; die
Angaben darunter (var(--text-leise) usw.) liefen ins Nichts.
Ausgerechnet auf dieser Seite faellt das nicht auf: Sie hat ihre
eigene Stilangabe im Kopf, damit sie auch dann noch etwas anzeigt,
wenn die Stilvorlagen klemmen -- und genau die hat den Mangel
verdeckt. Gefunden hat es pruef-struktur.
Richtig sind `gate.css` (die Farbwerte des Hauses) und `haus.css`. -->
<link rel="stylesheet" href="assets/css/gate.css?v=202609280931" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280931" />
<!-- Ohne diese drei nimmt ein iPhone einen Bildschirmausschnitt als
Symbol, Android zeichnet die Leiste weiss, und die Seite oeffnet
ausserhalb der App -- auf einer Seite, die genau erklaeren soll,
WARUM das Telefon nicht klingelt, ist das besonders unpassend. -->
<!-- app.webmanifest, NICHT crew.webmanifest (25.09.2026).
Hier stand crew.webmanifest fest verdrahtet. Diese Seite ist
aber fuer ALLE Rollen offen (rechte.js) und damit auf BEIDEN
Adressen erreichbar -- wer sie im Agenturhaus oeffnet und die
App installiert, bekam „DogFather Universe" mit dem
Crew-Symbol auf den Startbildschirm.
Die Adresse biegt app.webmanifest auf crew.webmanifest um
(crew-adresse.js), und zwar NUR auf der Crew-Adresse. Deshalb
schreibt jede Seite app.webmanifest -- auch die hier. -->
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280931" />
<style>
/* Bewusst in der Seite und nicht in einer eigenen Datei: Diese Seite
soll auch dann noch etwas anzeigen, wenn genau das schiefgeht,
was sie untersucht -- eine Stilvorlage, die aus dem
Zwischenspeicher kommt. */
/* DIE KOPFLEISTE WAR NIE GESTALTET (nachgetragen 19.09.2026).
Gefunden von pruef-css-klassen: `.kopfleiste`, `.kopfleiste__zurueck`,
`.kopfleiste__mitte` und `.kopfleiste__titel` stehen in KEINER
Stilvorlage des Hauses -- sie leben in start.css bzw. crew-haus.css,
und genau die lädt diese Seite absichtlich nicht.
Ergebnis war eine Leiste aus nacktem Text: der Zurück-Weg ein
blasser Link irgendwo links oben, der Titel daneben in Fließtext.
Ausgerechnet auf der Seite, die man aufruft, WEIL schon etwas nicht
funktioniert -- da sieht unfertig aus wie kaputt.
Sie stehen hier und nicht in einer Datei, aus demselben Grund wie
alles andere auf dieser Seite: Sie soll auch dann noch etwas
anzeigen, wenn genau das schiefgeht, was sie untersucht. */
.kopfleiste {
display: flex; align-items: center; gap: .6rem;
padding: .55rem .9rem;
border-bottom: 1px solid var(--rand);
background: color-mix(in srgb, var(--tinte) 92%, #ffffff 8%);
}
.kopfleiste__zurueck {
/* 44 px hoch: Das ist die Größe, die ein Daumen sicher trifft.
Auf einem Handy ist dieser Knopf der einzige Weg zurück. */
display: inline-flex; align-items: center;
min-height: 44px; padding: 0 .7rem 0 .2rem;
color: var(--text-leise); text-decoration: none;
font-size: .92rem; border-radius: .5rem;
}
.kopfleiste__zurueck:hover,
.kopfleiste__zurueck:focus-visible { color: var(--text); }
.kopfleiste__mitte { flex: 1; min-width: 0; text-align: center; }
.kopfleiste__titel {
font-size: .92rem; font-weight: 600; color: var(--text);
letter-spacing: .01em;
}
/* Gleich breit wie der Zurück-Weg, damit der Titel wirklich mittig
steht statt nur ungefähr. */
.kopfleiste__rechts { flex: 0 0 4.5rem; }
@media (max-width: 420px) {
.kopfleiste__rechts { flex-basis: 0; }
.kopfleiste__mitte { text-align: right; }
}
.probe { max-width: 46rem; margin: 0 auto; padding: 1.4rem 1rem 3rem; }
.probe h1 { margin: .2rem 0 .3rem; }
.probe__unter { color: var(--text-leise); margin: 0 0 1.4rem; }
.punkt {
display: flex; gap: .8rem; align-items: flex-start;
padding: .85rem 1rem; margin-bottom: .6rem;
border: 1px solid var(--rand); border-radius: .7rem;
background: rgba(255,255,255,.02);
}
.punkt__zeichen { font-size: 1.1rem; line-height: 1.4; flex: 0 0 1.4rem; }
.punkt__text { flex: 1; min-width: 0; }
.punkt__titel { font-weight: 600; margin: 0 0 .15rem; }
.punkt__satz { margin: 0; color: var(--text-leise); font-size: .9rem; }
.punkt[data-stand="gut"] { border-color: rgba(120, 200, 150, .4); }
.punkt[data-stand="warn"] { border-color: rgba(220, 180, 110, .45); }
.punkt[data-stand="schlecht"] { border-color: rgba(230, 140, 140, .5); }
/* 44 px auf Geraeten, die mit dem Finger bedient werden
(19.09.2026). Diese Seite laedt module.css bewusst nicht --
sie soll auch dann noch stehen, wenn Stilvorlagen klemmen.
Also gilt die Regel hier eigens. */
.probe__knopf { margin: 1.2rem 0 .4rem; }
@media (pointer: coarse) { .probe__knopf { min-height: 44px; } }
.probe__ende {
margin-top: 1.6rem; padding: 1rem;
border-radius: .7rem; border: 1px dashed var(--rand-hell);
color: var(--text-leise); font-size: .92rem;
}
</style>
</head>
<body class="haus">
<header class="kopfleiste">
<a class="kopfleiste__zurueck" id="zurueck-weg" href="start.html">‹ Zurück</a>
<div class="kopfleiste__mitte"><span class="kopfleiste__titel">Anruf-Probe</span></div>
<div class="kopfleiste__rechts"></div>
</header>
<main class="probe">
<h1>Warum klingelt es nicht?</h1>
<p class="probe__unter">
Diese Seite geht der Reihe nach durch, was ein Anruf braucht – und sagt,
an welcher Stelle es hakt. Sie ruft niemanden an.
</p>
<div id="ergebnis"></div>
<button type="button" class="knopf probe__knopf" id="ton-probe">Klingelton anhören</button>
<p class="probe__ende" id="rat"></p>
</main>
<script src="assets/js/anruf-probe.js?v=202609280931" defer></script>
<script src="assets/js/installieren.js?v=202609280931" defer></script>
</body>
</html>