DogFatherGit/dogfather-universe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Die Regie wird eine Regie -- und das Video lief bei niemandem

Browse Source 
Filipe: "perfektionier das auch mit den videoos. pefektionier auch das
aussehen und das layout von der regie. ich will dass du das viel
hochwertiger und profissioneller machst."

DAS VIDEO LIEF BEI NIEMANDEM -- AUCH NICHT BEIM HOST

Gemessen ueber ein neues Merkmal am Rahmen: `onStateChange` ist nie
ausgeloest worden, bei keinem der drei Browser. Zwei Ursachen, die
sich gegenseitig verdeckt haben:

  Ein Player mit Ton darf ohne Handlung des Menschen nicht losgehen.
  Ohne `mute: 1` greift `playVideo()` nicht -- und ein Zuschauer hat
  keine Bedienung (mit Absicht), haette also NIE eine Moeglichkeit
  gehabt, es zu starten. Eine Stunde Standbild.

  `onReady` tat `if (host) takt(); else folgen();`. Der Host hat damit
  nur GEMELDET, wo er steht, und nie selbst begonnen. Er meldete
  "laeuft nicht", und alle anderen folgten ihm brav ins Stehen.

Die Messung bricht ab jetzt ab, wenn der Player nicht bei beiden
laeuft. Ein gruener Haken ueber einem Standbild ist wertlos.

DIE WARTESCHLANGE

Vorher gab es genau EIN Videofeld. Wer zwei Sachen hintereinander
schauen wollte, tippte mitten in der Sendung eine YouTube-Adresse ein
-- vor Publikum, mit laufender Kamera, ein Tippfehler von einem
schwarzen Rechteck entfernt. Jetzt wird vorher eingeraeumt und im Live
nur weitergeschaltet: anhaengen, schieben, "Jetzt", "Naechstes".

Die Titel kommen von YouTube selbst (oEmbed, kein Schluessel, kein
Kontingent) und werden EINMAL geholt und hingelegt. Klappt der Abruf
nicht, steht dort die Kennung -- kein erfundener Name. Die Grenze ist
ueber die Umgebung veraenderbar, damit die Pruefung den vollen Fall in
Sekunden erreicht statt dreissig Videos anzuhaengen.

DIE REGIE

Vorher fuenf Kaesten untereinander in einem Bereich, der hoechstens
die halbe Bildschirmhoehe hat -- man sah fuenf halbe Dinge. Die drei
grossen Knoepfe lagen ganz unten, hinter acht Feldern und vier
Reglern. Wer mitten in der Sendung "Beenden" drueckt, drueckt es, weil
etwas passiert ist; das darf nicht hinter einer Bewegung liegen.

  Eine Leiste, die IMMER steht: Lampe, Laufzeit, Zuschauer, wie viele
  davon Bild bekommen, Gaeste, gemessener Upload -- und rechts die
  drei Knoepfe.

  Register statt Stapel: Sendung, Warteschlange, Ton, Gaeste, Bild.

  Eine Videospur mit echter Bedienung: Pause, +/-10 s, Positionsband,
  Restzeit, "Naechstes". Vorher musste man ins YouTube-Bild fassen --
  und was dort passiert, passiert nur bei einem selbst.

  PEGEL an den Reglern, aus einer echten Messung (AnalyserNode). Sie
  beantworten die Frage, die man sich sonst erst nach der Sendung
  stellt: "War mein Mikro ueberhaupt an?" Ein Regler auf 100 sagt
  darueber nichts. Beim YouTube-Regler steht dabei, dass dort nichts
  zu messen ist -- Ton aus einem fremden Rahmen laesst sich nicht
  abgreifen, und ein erfundener Ausschlag waere schlimmer als keiner.

  Der Upload wird an der Verbindung gemessen (`getStats`), nicht aus
  "zwoelf mal 350 kbit/s" gerechnet.

  Tastaturkuerzel -- und die Legende steht darunter. Ein Kuerzel, das
  niemand kennt, ist keins.

VIER FEHLER, DIE NUR DIE MESSUNG GEZEIGT HAT

1. `.tafel` WAR SCHON VERGEBEN. Die Anmeldeseite hat diese Klasse und
   setzt sie `position: absolute`; reaktion.html laedt beide
   Stilvorlagen. Die Register-Tafel trug damit NICHTS zur Hoehe bei
   (114 px Raster, 294 px Inhalt) und malte quer ueber Register und
   Kuerzel -- 197 Pixel, um die die Seite ueberlief. Auf dem Bild sah
   es aus wie ein Anzeigefehler; es war ein Namensstreit. Dritter
   Fall dieser Art nach .knopf-still und .schalter, deshalb steht er
   ab jetzt in einer Pruefung: keine Klasse aus reaktion.css darf in
   gate/start/module/haus.css vorkommen.

2. `node:sqlite` kennt kein `.transaction()`. Von Hand geklammert.

3. Das Schild war auf dem Handy 10,24 px gross -- unter der
   Hausgrenze von 11,5 px. Gefunden von `pruef-handy`, das die
   GEZEICHNETE Groesse misst; die Stilvorlagen-Pruefung haette die
   Zeile in der Medienabfrage durchgelassen.

4. Die Messung klickte blind auf den Griff des Pults ("umschalten")
   und machte es damit ZU, seit es aufgeklappt startet. Sie stellt
   den Zustand jetzt her, statt ihn umzuschalten.

UND DIE HARTNAECKIGSTE: DAS BILD DES GASTES KAM BEIM HOST NICHT AN

Erst in einem von drei Laeufen, dann in drei von drei -- und zwar
SCHLIMMER, nachdem ich einen Wachhund dagegen gebaut hatte. Vier
Ursachen, hintereinander gemessen statt geraten:

  a) `kameraHolen()` wurde beim Host FUENFMAL betreten. Die Wache
     `if (meinStrom) return` wirkt erst, wenn die Kamera DA ist --
     solange die erste Anfrage laeuft, geht jede weitere als zweite
     Anfrage an dasselbe Geraet. Eine blieb liegen, und mit ihr der
     Anruf, der darauf wartete. Der Platz in `ruftGerade` blieb
     belegt, und damit kam nie wieder eine Leitung zustande. Jetzt
     bekommen alle dasselbe Versprechen zurueck.

  b) Der Wachhund riss Leitungen ab, die gerade verhandelt wurden --
     zwischen "Leitung angelegt" und "Angebot abgeschickt" liegen
     drei await.

  c) "Ruf mich an" brach dasselbe ab: Der Bittende weiss nicht, dass
     es schon laeuft, und fragt alle drei Sekunden weiter.

  d) Meine Reparatur von (b) und (c) war "signalingState !== stable
     heisst: in Arbeit" -- ohne Uhr. Damit war eine Leitung, deren
     Antwort nie ankommt, vor BEIDEN Aufraeumwegen sicher, dauerhaft.
     Der Zuschauer bekam daraufhin gar nichts mehr; ich hatte den
     Fehler nur von einer Seite auf die andere geschoben. "Wird
     verhandelt" ist ein Zustand MIT DAUER und steht jetzt an genau
     einer Stelle.

Dazu ein eigener Fehler beim Aufraeumen: Mit der Messspur ist
`ruftGerade` mit herausgefallen. Vier Laeufe ohne jedes Bild -- und
`node --check` sieht das nicht, eine fehlende Variable ist
syntaktisch tadellos.

GEMESSEN

  mess-reaktion   fuenf Laeufe hintereinander ohne Beanstandung;
                  beide Kameras 640 px bei Host UND Zuschauerin,
                  Video laeuft bei beiden, Upload 0,9 Mbit/s,
                  Warteschlange 2 Zeilen mit Vorschaubildern,
                  kein Ueberlauf (4 px statt 197)
  pruef-reaktion  132 Punkte, 0 Fehler (vorher 88)
  pruef-handy     180 Punkte, 0 Fehler
  dazu gruen      css-klassen 33, struktur 35, tippziele 11,
                  meldungen 8, kamera-richtlinie 10

SCHEMA: neue Tabelle `reaktion_liste`, neue Spalte
`reaktion.video_titel` (ALTER TABLE, keine Abschrift der Spalten).
This commit is contained in:
DogFatherGit
2026-09-28 03:45:15 +02:00
parent 85101176d2
commit 711a5470ab
50 changed files with 2744 additions and 860 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/mess-reaktion.mjs
+149 -2
View File
@@ -123,6 +123,17 @@ await roh("/workspace/api/reaktion", {
},
});
/* ZWEI STUECKE IN DIE WARTESCHLANGE. Eine leere Liste sieht auf
einem Bildschirmfoto genauso aus wie eine kaputte -- beides ist
ein Kasten ohne Zeilen. Zwei echte Eintraege zeigen, ob Titel,
Vorschaubild und die vier Knoepfe je Zeile wirklich ankommen. */
for (const adresse of ["https://youtu.be/9bZkp7q19f0",
"https://www.youtube.com/watch?v=kJQP7kiw5Fk"]) {
await roh("/workspace/api/reaktion/liste", {
method: "POST", keks: k.admin, rumpf: { video: adresse },
});
}
const REDEN = [
["gast", "Bin schon daaa 🐺"],
["gast2", "Ich auch! Hab extra Popcorn geholt"],
@@ -301,6 +312,17 @@ for (const [name, m] of Object.entries(beiZuschauer)) {
/* AUCH DER HOST MUSS SEINEN GAST SEHEN. Wenn nur die Zuschauer
etwas sehen, redet der Host gegen eine schwarze Kachel -- und
merkt nicht, wenn beim Gast die Kamera aus ist. */
/* LAEUFT DAS VIDEO UEBERHAUPT? Dieselbe Falle wie bei den Kameras:
Etwas, das Ton macht, darf nicht von allein losgehen. */
let videoLaeuft = 0;
for (const [wer, w] of [["Host", host.seite], ["Zuschauerin", zuschauer.seite]]) {
const v = await w.evaluate(() => ({
stand: document.getElementById("video-platz")?.dataset.spieler || "(nichts)",
rahmen: !!document.querySelector("#video-platz iframe"),
}));
console.log(` Video bei ${wer.padEnd(12)} Rahmen=${v.rahmen} Zustand=${v.stand}`);
if (v.stand === "laeuft" || v.stand === "puffert") videoLaeuft++;
}
const beimHost = await bildBreiten(host.seite);
for (const [name, m] of Object.entries(beimHost)) {
console.log(` Host sieht ${name.padEnd(12)} `
@@ -319,6 +341,13 @@ console.log(` -> ${zaehlt} von ${Object.keys(beiZuschauer).length} Kameras kom
ein Video mit Ton nicht von allein startet. Beide Male sahen die
Bildschirmfotos plausibel aus. */
let ausgang = 0;
/* LAEUFT DAS VIDEO? Ein Zuschauer hat keine Bedienung -- startet es
nicht von selbst, sitzt er eine Stunde vor einem Standbild und
kann nichts dagegen tun. Gemessen war genau das der Fall. */
if (videoLaeuft < 2) {
console.log(` ACHTUNG: Das Video laeuft nur bei ${videoLaeuft} von 2.`);
ausgang = 1;
}
const beimHostAn = Object.values(beimHost).filter((m) => m.breite > 0).length;
if (beimHostAn < Object.keys(beimHost).length) {
console.log(" ACHTUNG: Der Host sieht nicht alle Kameras.");
@@ -336,10 +365,128 @@ if (stehen) {
ausgang = 1;
}
await host.seite.click("#pult-griff").catch(() => {});
await host.seite.waitForTimeout(700);
/* ---- Die Regie ---------------------------------------------------
NICHT UMSCHALTEN, SONDERN HERSTELLEN. Ein Klick auf „Griff" heisst
„das Gegenteil von dem, was gerade ist" -- und setzt damit voraus,
dass die Messung den Zustand vorher kennt. Genau daran ist sie
einmal gescheitert: Seit das Pult aufgeklappt startet, hat der
Klick es ZUgemacht, und auf dem Bild war von der Regie nichts zu
sehen. */
console.log("");
console.log(" --- Die Regie ---");
await host.seite.evaluate(() => {
const p = document.getElementById("pult");
if (p && p.dataset.auf !== "ja") document.getElementById("pult-griff")?.click();
});
await host.seite.waitForTimeout(900);
const regie = await host.seite.evaluate(() => {
const t = (id) => document.getElementById(id)?.textContent?.trim() || "";
const sicht = (w) => {
const e = document.querySelector(w);
if (!e) return false;
const r = e.getBoundingClientRect();
return r.width > 0 && r.height > 0;
};
return {
auf: document.getElementById("pult")?.dataset.auf,
lampe: t("pult-wort"),
uhr: t("pult-zeit"),
dabei: t("z-dabei"),
sicht_zahl: t("z-sicht"),
last: t("z-last"),
spur: t("spur-titel"),
zeit: t("v-zeit"),
reiter: document.querySelectorAll("#reiter .reiter__knopf").length,
tafel_sichtbar: [...document.querySelectorAll(".pult-tafel")].filter((e) => !e.hidden).length,
regler: document.querySelectorAll("#regler .regler").length,
pegel: document.querySelectorAll("#regler .pegel").length,
knoepfe_sichtbar: ["p-vorbereiten", "p-starten", "p-beenden"]
.filter((id) => sicht("#" + id)).length,
/* WOHER KOMMT EIN UEBERLAUF? Die blosse Zahl „197 Pixel zum
Scrollen" schickt einen ins Raten. Die Hoehen daneben zeigen
in einer Zeile, welcher Kasten zu gross ist. */
hoehen: (() => {
const h = (w) => {
const e = document.querySelector(w);
return e ? Math.round(e.getBoundingClientRect().height) : -1;
};
return `fenster ${window.innerHeight} · saal ${h("#saal")}`
+ ` · kino ${h("#teil-live")} · pult ${h("#pult")}`
+ ` (leiste ${h(".pult__leiste")} + innen ${h("#pult-innen")})`
+ ` · tafeln sichtbar ${[...document.querySelectorAll(".pult-tafel")]
.filter((e) => e.getBoundingClientRect().height > 0).length}`
+ ` · innen rollt ${document.getElementById("pult-innen").scrollHeight}`;
})(),
kinder: [...document.getElementById("pult-innen").children].map((e) => {
const r = e.getBoundingClientRect();
const c = getComputedStyle(e);
return `${e.className || e.tagName}:${Math.round(r.top)}+${Math.round(r.height)}`
+ `/${c.display}/${c.position}`;
}).join(" "),
};
});
console.log(" " + regie.hoehen);
console.log(" " + regie.kinder);
console.log(` Lampe „${regie.lampe}" Uhr ${regie.uhr} `
+ `Sehen zu ${regie.dabei} mit Bild ${regie.sicht_zahl} Upload ${regie.last}`);
console.log(` Spur: „${regie.spur}" ${regie.zeit}`);
console.log(` ${regie.reiter} Register, ${regie.tafel_sichtbar} Tafel offen, `
+ `${regie.regler} Regler mit ${regie.pegel} Pegeln, `
+ `${regie.knoepfe_sichtbar}/3 grosse Knoepfe sichtbar`);
/* JEDE DIESER ZAHLEN KANN STILL FALSCH SEIN -- und genau dann sieht
ein Bildschirmfoto trotzdem gut aus. Deshalb werden sie geprueft
und nicht nur ausgegeben. */
if (regie.auf !== "ja") {
console.log(" ACHTUNG: Die Regie liess sich nicht aufklappen.");
ausgang = 1;
}
if (!/^\d+:\d\d/.test(regie.uhr) || regie.uhr === "0:00") {
console.log(` ACHTUNG: Die Laufzeit steht still (${regie.uhr}).`);
ausgang = 1;
}
if (!/kbit\/s|Mbit\/s/.test(regie.last)) {
console.log(` ACHTUNG: Der Upload wird nicht gemessen (${regie.last}).`);
ausgang = 1;
}
if (regie.reiter !== 5 || regie.tafel_sichtbar !== 1) {
console.log(` ACHTUNG: Die Register stimmen nicht (${regie.reiter} Reiter, `
+ `${regie.tafel_sichtbar} offen).`);
ausgang = 1;
}
if (regie.regler !== 4 || regie.pegel !== 4 || regie.knoepfe_sichtbar !== 3) {
console.log(" ACHTUNG: Regler, Pegel oder die grossen Knoepfe fehlen.");
ausgang = 1;
}
await vermessen(host.seite, "Host am Rechner");
await bild(host.seite, "3-live-host");
/* Und einmal die Warteschlange -- das ist der Teil, den Filipe
vorher benutzt, nicht waehrend der Sendung. */
await host.seite.click('#reiter .reiter__knopf[data-tafel="liste"]').catch(() => {});
await host.seite.waitForTimeout(600);
const warte = await host.seite.evaluate(() => ({
zeilen: document.querySelectorAll("#warteliste .warte-zeile").length,
bilder: [...document.querySelectorAll(".warte-zeile__bild")]
.filter((b) => b.naturalWidth > 0).length,
titel: [...document.querySelectorAll(".warte-zeile__titel")]
.map((e) => e.textContent.trim()).join(" | "),
naechstes: document.getElementById("v-naechstes")?.disabled,
}));
console.log(` Warteschlange: ${warte.zeilen} Zeilen, `
+ `${warte.bilder} Vorschaubilder geladen, „Naechstes" `
+ `${warte.naechstes ? "grau" : "nutzbar"}`);
console.log(` ${warte.titel}`);
if (warte.zeilen !== 2 || warte.naechstes) {
console.log(" ACHTUNG: Die Warteschlange kommt nicht an.");
ausgang = 1;
}
await bild(host.seite, "7-live-regie-liste");
await host.seite.click('#reiter .reiter__knopf[data-tafel="ton"]').catch(() => {});
await host.seite.waitForTimeout(500);
await bild(host.seite, "8-live-regie-ton");
if (host.konsole.length) console.log(" KONSOLE:", host.konsole.slice(0, 4).join(" | "));
await vermessen(zuschauer.seite, "Zuschauerin am Rechner");
server/pruef-reaktion.mjs
+256 -3
View File
@@ -40,6 +40,11 @@ const PORT = await eigenerPort(import.meta, "die Reaction-Pruefung");
process.env.PORT = `${PORT}`;
process.env.SITE_ACCESS_SECRET = "lokaler-test";
process.env.SITE_PUBLIC_LAUNCH_AT = "2020-01-01T00:00:00+01:00";
/* DREI STATT DREISSIG. Sonst muesste die Pruefung dreissig Videos
anhaengen, um den vollen Fall zu erreichen -- und ein Grenzfall,
den niemand prueft, weil das Pruefen zu lange dauert, ist ein
ungeprueftes Verhalten. */
process.env.REAKTION_LISTE_MAX = "3";
const express = (await import("express")).default;
const ec = express.response.cookie;
@@ -627,10 +632,258 @@ melde("=== 10. Was um die Seite herum stimmen muss ===");
}
/* =======================================================================
11. KEIN WEG HEISST ZWEIMAL GLEICH
11. DIE WARTESCHLANGE
Vorher gab es genau EIN Videofeld. Wer zwei Sachen hintereinander
schauen wollte, tippte mitten in der Sendung eine Adresse ein --
vor Publikum, mit laufender Kamera. Ein Tippfehler war ein
schwarzes Rechteck.
======================================================================= */
melde("");
melde("=== 11. Keine doppelten Wege ===");
melde("=== 11. Die Warteschlange ===");
{
await roh(CREW, "/workspace/api/reaktion/stand", {
method: "POST", keks: k.admin, rumpf: { stand: "zu" },
});
/* ERFUNDENE KENNUNGEN, mit Absicht. Elf erlaubte Zeichen -- die
Form stimmt, das Video gibt es nicht. Damit laeuft nebenbei der
Fall mit, in dem YouTube keinen Titel herausrueckt: Der Eintrag
muss trotzdem entstehen, und im Titel muss ein LEERER Text
stehen, keine Erfindung. */
const A = "aaaaaaaaaaa", B = "bbbbbbbbbbb", C = "ccccccccccc", D = "ddddddddddd";
const haengen = (rolle, video) => roh(CREW, "/workspace/api/reaktion/liste", {
method: "POST", keks: k[rolle], rumpf: { video },
});
for (const rolle of ["linke", "modi", "gast"]) {
const a = await haengen(rolle, A);
ok(a.code === 403, `${rolle}: haengt nichts an (${a.code})`);
}
const mist = await haengen("admin", "das ist keine adresse");
ok(mist.code === 400 && mist.j?.fehler === "video_unklar",
`eine kaputte Adresse wird abgelehnt (${mist.code}/${mist.j?.fehler})`);
const eins = await roh(CREW, "/workspace/api/reaktion/liste", {
method: "POST", keks: k.admin,
rumpf: { video: `https://www.youtube.com/watch?v=${A}` },
});
ok(eins.code === 200 && eins.j?.liste?.length === 1,
`aus der Adresse wird ein Eintrag (${eins.code}, ${eins.j?.liste?.length})`);
ok(eins.j?.liste?.[0]?.video === A,
`und die Kennung stimmt (${eins.j?.liste?.[0]?.video})`);
ok(typeof eins.j?.liste?.[0]?.titel === "string",
"der Titel ist IMMER ein Text -- auch wenn YouTube nichts hergab "
+ `(hier: „${eins.j?.liste?.[0]?.titel}")`);
const doppelt = await haengen("admin", A);
ok(doppelt.code === 409 && doppelt.j?.fehler === "liste_doppelt",
`dasselbe Video nicht zweimal (${doppelt.code}/${doppelt.j?.fehler})`);
/* Die rechte Hand raeumt genauso ein -- beide bereiten vor. */
const zwei = await haengen("hand", B);
ok(zwei.code === 200 && zwei.j?.liste?.length === 2,
`die rechte Hand raeumt auch ein (${zwei.code})`);
const drei = await haengen("admin", C);
ok(drei.j?.liste?.map((z) => z.video).join(",") === [A, B, C].join(","),
`die Reihenfolge ist die des Anhaengens (${drei.j?.liste?.map((z) => z.video).join(",")})`);
const voll = await haengen("admin", D);
ok(voll.code === 409 && voll.j?.fehler === "liste_voll",
`ueber der Grenze ist Schluss (${voll.code}/${voll.j?.fehler})`);
/* ---- Schieben ---- */
const idB = drei.j.liste[1].id;
const hoch = await roh(CREW, `/workspace/api/reaktion/liste/${idB}/schieben`, {
method: "POST", keks: k.hand, rumpf: { richtung: "hoch" },
});
ok(hoch.j?.liste?.map((z) => z.video).join(",") === [B, A, C].join(","),
`hoch tauscht mit dem Nachbarn (${hoch.j?.liste?.map((z) => z.video).join(",")})`);
const nochmal = await roh(CREW, `/workspace/api/reaktion/liste/${idB}/schieben`, {
method: "POST", keks: k.admin, rumpf: { richtung: "hoch" },
});
ok(nochmal.code === 200
&& nochmal.j?.liste?.map((z) => z.video).join(",") === [B, A, C].join(","),
"ganz oben noch einmal hoch aendert nichts und ist kein Fehler");
const runter = await roh(CREW, `/workspace/api/reaktion/liste/${idB}/schieben`, {
method: "POST", keks: k.admin, rumpf: { richtung: "runter" },
});
ok(runter.j?.liste?.map((z) => z.video).join(",") === [A, B, C].join(","),
`und runter wieder zurueck (${runter.j?.liste?.map((z) => z.video).join(",")})`);
/* ---- Wer die Liste sieht ---- */
const h = await roh(CREW, "/workspace/api/reaktion", { keks: k.hand });
ok(Array.isArray(h.j?.liste) && h.j.liste.length === 3,
`die zwei sehen die ganze Liste (${h.j?.liste?.length})`);
for (const rolle of ["linke", "modi", "gast"]) {
const z = await roh(CREW, "/workspace/api/reaktion", { keks: k[rolle] });
ok(z.j?.liste === null, `${rolle}: bekommt die Warteschlange NICHT`);
ok(z.j?.naechstes === A,
`${rolle}: was als Naechstes kommt, darf er wissen (${z.j?.naechstes})`);
}
/* ---- Weiterschalten ---- */
const w = await roh(CREW, "/workspace/api/reaktion/weiter", {
method: "POST", keks: k.admin, rumpf: {},
});
ok(w.code === 200 && w.j?.video === A,
`„Naechstes" holt das oberste ins Bild (${w.j?.video})`);
ok(w.j?.liste?.length === 2 && !w.j.liste.some((z) => z.video === A),
"und nimmt es aus der Liste heraus");
ok(w.j?.laeuft === true && w.j?.sekunde === 0,
`es beginnt von vorn und laeuft (laeuft=${w.j?.laeuft}, sekunde=${w.j?.sekunde})`);
const gezielt = await roh(CREW, "/workspace/api/reaktion/weiter", {
method: "POST", keks: k.hand, rumpf: { id: w.j.liste[1].id },
});
ok(gezielt.j?.video === C,
`„Jetzt" holt genau das gewaehlte, nicht das oberste (${gezielt.j?.video})`);
const nurEins = await roh(CREW, "/workspace/api/reaktion/weiter", {
method: "POST", keks: k.gast, rumpf: {},
});
ok(nurEins.code === 403, `ein Zuschauer schaltet nicht weiter (${nurEins.code})`);
await roh(CREW, "/workspace/api/reaktion/weiter", { method: "POST", keks: k.admin, rumpf: {} });
const leer = await roh(CREW, "/workspace/api/reaktion/weiter", {
method: "POST", keks: k.admin, rumpf: {},
});
ok(leer.code === 409 && leer.j?.fehler === "liste_leer",
`eine leere Liste sagt das auch (${leer.code}/${leer.j?.fehler})`);
/* Und der Titel des laufenden Videos steht in der Lage -- auch
dann, wenn er leer ist. Ein fehlendes Feld waere `undefined`
und wuerde in der Oberflaeche zu „undefined". */
const jetzt = await roh(CREW, "/workspace/api/reaktion", { keks: k.gast });
ok(typeof jetzt.j?.video_titel === "string",
`der Titel des laufenden Videos ist immer ein Text („${jetzt.j?.video_titel}")`);
}
/* =======================================================================
12. DIE REGIE
Hier wird nicht das Aussehen geprueft -- das kann eine Maschine
nicht -- sondern zweierlei, das man beim Umbauen still kaputt
macht:
A) JEDES `$('id')`, das die Oberflaeche anfasst, muss es in der
Seite auch GEBEN. Ein Tippfehler ergibt sonst `null`, und der
Fehler faellt erst auf, wenn jemand den Knopf drueckt --
mitten in einer Sendung.
B) Die drei grossen Knoepfe muessen AUSSERHALB des
einklappbaren Teils liegen. Wer mitten in der Sendung
„Beenden" drueckt, drueckt es, weil etwas passiert ist. Das
darf nicht hinter einer Bewegung liegen.
======================================================================= */
melde("");
melde("=== 12. Die Regie ===");
{
const html = readFileSync(join(HIER, "..", "workspace", "reaktion.html"), "utf8");
const js = readFileSync(join(HIER, "..", "workspace", "assets", "js", "reaktion.js"), "utf8");
const vorhanden = new Set([...html.matchAll(/\bid="([^"]+)"/g)].map((m) => m[1]));
/* Kommentare erst weg -- sonst zaehlt ein Beispiel im Fliesstext
als Zugriff. */
const ohneNotiz = js.replace(/\/\*[\s\S]*?\*\//g, "").replace(/(^|[^:])\/\/.*$/gm, "$1");
const gesucht = [...new Set([...ohneNotiz.matchAll(/\$\('([a-z0-9-]+)'\)/g)].map((m) => m[1]))];
const fehlend = gesucht.filter((n) => !vorhanden.has(n));
ok(gesucht.length > 30 && fehlend.length === 0,
fehlend.length
? `FEHLT in der Seite: ${fehlend.join(", ")}`
: `alle ${gesucht.length} angefassten Kennungen gibt es in der Seite`);
/* GEGENPROBE: Kann diese Pruefung ueberhaupt „nein" sagen? Eine,
die immer bestaetigt, bestaetigt nichts. */
ok(!vorhanden.has("gibt-es-nicht")
&& ["p-starten", "gibt-es-nicht"].filter((n) => !vorhanden.has(n)).length === 1,
"Gegenprobe: eine erfundene Kennung wuerde auffallen");
/* Auch die Register muessen zusammenpassen. */
/* Die Reihenfolge der Merkmale im Text ist beliebig -- gesucht
wird deshalb erst die Zeile mit `role="tab"` und darin das
Merkmal. Ein Muster, das eine bestimmte Reihenfolge erwartet,
bricht beim naechsten Umformatieren. */
const reiter = [...html.matchAll(/<button[^>]*role="tab"[^>]*>/g)]
.map((m) => (m[0].match(/data-tafel="([a-z]+)"/) || [])[1])
.filter(Boolean);
const tafeln = [...html.matchAll(/class="pult-tafel" data-tafel="([a-z]+)"/g)].map((m) => m[1]);
ok(reiter.length === 5 && reiter.every((r) => tafeln.includes(r)),
`zu jedem der ${reiter.length} Register gibt es eine Tafel (${reiter.join(", ")})`);
const steuert = [...html.matchAll(/aria-controls="([^"]+)"/g)].map((m) => m[1]);
ok(steuert.length > 0 && steuert.every((n) => vorhanden.has(n)),
`alle ${steuert.length} Verweise mit aria-controls zeigen auf etwas Vorhandenes`);
/* B) Die grossen Knoepfe liegen ausserhalb des Klappteils. */
const woLeiste = html.indexOf('class="pult__leiste"');
const woInnen = html.indexOf('id="pult-innen"');
const woBeenden = html.indexOf('id="p-beenden"');
ok(woLeiste > 0 && woInnen > woLeiste,
"die Leiste steht vor dem einklappbaren Teil");
ok(woBeenden > woLeiste && woBeenden < woInnen,
"der Beenden-Knopf liegt in der Leiste -- also auch dann erreichbar, "
+ "wenn die Regie zugeklappt ist");
/* Und die Kuerzel, die das Programm bindet, stehen auch dabei.
Ein Kuerzel, das niemand kennt, ist keins. */
const legende = (html.match(/<p class="kuerzel">[\s\S]*?<\/p>/) || [""])[0];
for (const [taste, wort] of [["Leertaste", "Leertaste"], ["M", "M"], ["N", "N"]]) {
ok(legende.includes(`<kbd>${wort}</kbd>`), `das Kuerzel ${taste} steht in der Legende`);
}
ok(/taste === 'm' \|\| taste === 'M'/.test(js) && /taste === 'n' \|\| taste === 'N'/.test(js),
"und das Programm hoert auch darauf");
ok(/closest\('input, textarea, select/.test(js),
"wer in einem Feld tippt, tippt -- die Leertaste gehoert dann dem Text");
/* ==== KEIN KLASSENNAME ZWEIMAL ================================
reaktion.html laedt FUENF Stilvorlagen: gate.css, start.css,
reaktion.css, module.css, haus.css. Wer hier eine Klasse
erfindet, die es dort schon gibt, erbt deren Regeln -- lautlos.
Gemessen am 28.09.2026: `.tafel` gehoert seit je der
Anmeldeseite und steht dort `position: absolute`. Die
Register-Tafel der Regie trug damit NICHTS zur Hoehe des Pults
bei (114 Pixel Raster, 294 Pixel Inhalt) und malte quer ueber
Register und Kuerzel hinaus. Auf dem Bildschirmfoto sah es aus
wie ein Anzeigefehler; in Wahrheit war es ein Namensstreit.
Derselbe Fehler wie im August bei .knopf-still und .schalter --
deshalb steht er ab jetzt in einer Pruefung und nicht in einem
Kommentar. */
const klassenAus = (datei) => {
const text = readFileSync(join(HIER, "..", "workspace", "assets", "css", datei), "utf8")
.replace(/\/\*[\s\S]*?\*\//g, "");
return new Set([...text.matchAll(/(^|[\s,>+~(])\.(-?[a-zA-Z_][a-zA-Z0-9_-]*)/g)]
.map((m) => m[2]));
};
const meine = klassenAus("reaktion.css");
const streit = [];
for (const fremd of ["gate.css", "start.css", "module.css", "haus.css"]) {
for (const name of klassenAus(fremd)) if (meine.has(name)) streit.push(`${name} (${fremd})`);
}
ok(meine.size > 40 && streit.length === 0,
streit.length
? `Namensstreit: ${streit.join(", ")}`
: `alle ${meine.size} Klassen aus reaktion.css sind nur dort vergeben`);
ok(klassenAus("gate.css").has("tafel"),
"Gegenprobe: der Sucher findet die Klasse, an der es lag (.tafel in gate.css)");
/* Der Pegel wird gemessen und nicht gemalt. */
ok(/createAnalyser\(\)/.test(js) && /getByteTimeDomainData/.test(js),
"die Pegel kommen aus einer echten Messung");
ok(/schluessel === 'video'/.test(js) && /eingestellte Lautstaerke|eingestellte Lautstärke/.test(js),
"beim YouTube-Regler steht dabei, dass dort nichts gemessen werden kann");
ok(/getStats\(\)/.test(js),
"der Upload wird an der Verbindung gemessen, nicht geschaetzt");
}
/* =======================================================================
13. KEIN WEG HEISST ZWEIMAL GLEICH
======================================================================= */
melde("");
melde("=== 13. Keine doppelten Wege ===");
{
/* Beim Notizblock hat genau das eine Stunde gekostet:
`DELETE /workspace/api/notizen/:id` gab es schon woanders, und
@@ -654,7 +907,7 @@ melde("=== 11. Keine doppelten Wege ===");
ok(doppelt.length === 0,
doppelt.length ? `DOPPELT: ${[...new Set(doppelt)].join(", ")}` : "kein Weg kommt zweimal vor");
const reaktionswege = wege.filter((x) => x.includes("/api/reaktion")).length;
ok(reaktionswege >= 11, `die Reaction bringt ${reaktionswege} eigene Wege mit`);
ok(reaktionswege >= 15, `die Reaction bringt ${reaktionswege} eigene Wege mit`);
}
melde("");
server/reaktion-tabellen.js
+57
View File
@@ -83,6 +83,18 @@ export const STAENDE = ["zu", "vorbereitung", "live"];
/** Die Anordnungen des Bildes. */
export const LAYOUTS = ["kino", "gleich", "kamera"];
/** Hoechstens so viele Videos duerfen in der Warteschlange stehen.
*
* Die Zahl ist keine technische Grenze, sondern eine Ansage: Wer
* dreissig Videos einraeumt, plant keinen Abend mehr, sondern legt
* ein Archiv an -- und dafuer ist die Liste nicht gebaut. Sie waere
* danach zu lang, um sie im Pult zu ueberblicken. */
/* Ueber die Umgebung veraenderbar -- damit die Pruefung den vollen
Fall in Sekunden erreicht und nicht dreissig Videos anhaengen muss.
Ein Grenzfall, den niemand prueft, weil das Pruefen zu lange
dauert, ist ein ungeprueftes Verhalten. */
export const LISTE_MAX = Number(process.env.REAKTION_LISTE_MAX || 30);
export function reaktionTabellen(d) {
d.exec(`
/* Genau EINE Zeile. Die Sperre steht in der Tabelle und nicht im
@@ -152,6 +164,33 @@ export function reaktionTabellen(d) {
beitraege INTEGER NOT NULL DEFAULT 0
);
/* ==== DIE WARTESCHLANGE ======================================
Was als Naechstes laeuft. Eine Zeile je Video, die Spalte „platz“ gibt
die Reihenfolge.
SIE IST NICHT DASSELBE WIE DER VERLAUF. Der Verlauf sagt, was
gelaufen IST -- die Warteschlange, was laufen SOLL. Beides in
eine Tabelle zu legen waere sparsam und falsch: Ein Eintrag
muesste dann „schon gelaufen ja/nein" tragen, und jede Abfrage
im Haus muesste diese Frage mitstellen. Vergisst sie eine,
steht ein Video zweimal im Abend.
DER TITEL STEHT HIER MIT DRIN und wird nicht jedes Mal neu bei
YouTube erfragt. Sonst haengt die Anzeige der Liste an einem
fremden Dienst: Ist er langsam, laedt das Pult langsam; ist er
weg, steht dort nichts. Einmal holen, hinlegen, fertig. */
CREATE TABLE IF NOT EXISTS reaktion_liste (
id INTEGER PRIMARY KEY AUTOINCREMENT,
video TEXT NOT NULL,
titel TEXT NOT NULL DEFAULT '',
platz INTEGER NOT NULL DEFAULT 0,
von_id INTEGER REFERENCES personen(id) ON DELETE SET NULL,
gesetzt_am TEXT NOT NULL
);
CREATE INDEX IF NOT EXISTS idx_reaktion_liste_platz
ON reaktion_liste (platz, id);
CREATE INDEX IF NOT EXISTS idx_reaktion_chat_zeit
ON reaktion_chat (weg_am, id);
CREATE INDEX IF NOT EXISTS idx_reaktion_dabei_gesehen
@@ -166,4 +205,22 @@ export function reaktionTabellen(d) {
d.prepare(`INSERT OR IGNORE INTO reaktion
(id, stand, stand_seit, geaendert) VALUES (1, 'zu', ?, ?)`)
.run(new Date().toISOString(), new Date().toISOString());
/* ==== NACHGEWACHSENE SPALTEN ====================================
`ALTER TABLE ... ADD COLUMN` und NICHT „Tabelle neu bauen und
umkopieren". Am 11.09.2026 hat genau dieses Umkopieren an
anderer Stelle drei Spalten mit Inhalt verschluckt, ohne
Fehlermeldung und bei unveraenderter Zeilenzahl -- weil die
Spaltenliste von Hand abgeschrieben war. Eine Liste, die
niemand pflegt, kann nicht veralten; `ADD COLUMN` braucht gar
keine. */
const da = new Set(d.prepare("PRAGMA table_info(reaktion)").all().map((z) => z.name));
if (!da.has("video_titel")) {
/* Der Name des laufenden Videos, einmal bei YouTube geholt.
Ohne ihn stuende im Pult und auf der Wartetafel nur die
elfstellige Kennung -- die sagt niemandem etwas. */
d.exec("ALTER TABLE reaktion ADD COLUMN video_titel TEXT NOT NULL DEFAULT ''");
console.log("[reaktion] Spalte video_titel angelegt.");
}
}
server/workspace-reaktion.js
+218 -6
View File
@@ -47,7 +47,7 @@ import { einstellung } from "./workspace.js";
import { mitZugangsdaten, wegeAusfaechern } from "./workspace-turn.js";
import {
SICHT_PLAETZE, GAESTE_MAX, TEXT_MAX, SCHREIB_BREMSE, STAENDE, LAYOUTS,
VERLAUF_TAGE,
VERLAUF_TAGE, LISTE_MAX,
} from "./reaktion-tabellen.js";
export const reaktionRouter = express.Router();
@@ -135,6 +135,67 @@ function zuSchnell(personId) {
const sendung = () => db().prepare("SELECT * FROM reaktion WHERE id = 1").get();
/** Wie heisst das Video? — einmal bei YouTube nachfragen.
*
* UEBER oEmbed, NICHT UEBER DIE DATEN-API. oEmbed braucht keinen
* Schluessel, kein Konto und kein Kontingent; es ist genau dafuer
* da, dass eine fremde Seite einen Titel anzeigen darf.
*
* DREI AUSGAENGE, NICHT ZWEI. Geht der Abruf schief -- kein Netz,
* YouTube langsam, Video nicht oeffentlich --, kommt ein LEERER
* Titel zurueck, und die Oberflaeche zeigt dann die Kennung. Sie
* erfindet keinen Namen und behauptet auch nicht, es gaebe keinen.
* „Konnte nicht nachsehen" ist eine eigene Antwort.
*
* VIER SEKUNDEN UND DANN SCHLUSS. Das Anhaengen eines Videos darf
* nicht daran haengen, ob ein fremder Dienst gerade Zeit hat. Ohne
* Frist stuende Filipe vor einem Knopf, der sich dreht, und wuesste
* nicht, ob er noch einmal druecken soll. */
async function videoTitel(kennung) {
if (!kennung) return "";
try {
const adresse = "https://www.youtube.com/oembed?format=json&url="
+ encodeURIComponent("https://www.youtube.com/watch?v=" + kennung);
const a = await fetch(adresse, { signal: AbortSignal.timeout(4000) });
if (!a.ok) return "";
const j = await a.json();
return String(j?.title || "").trim().slice(0, 160);
} catch (fehler) {
console.warn("[reaktion] Titel von YouTube:", fehler?.message);
return "";
}
}
/** Die Warteschlange, in ihrer Reihenfolge. */
function listeHolen() {
return db().prepare("SELECT id, video, titel, platz FROM reaktion_liste"
+ " ORDER BY platz, id").all();
}
/** Das naechste Video aus der Liste ins Bild holen.
*
* EINE STELLE FUER ZWEI KNOEPFE. „Naechstes" und „Jetzt spielen"
* tun dasselbe, nur mit unterschiedlicher Zeile -- zwei Kopien
* desselben Ablaufs waeren zwei Stellen, an denen man spaeter das
* Zuruecksetzen der Sekunde vergessen kann. */
function weiterZu(zeile, personId) {
db().prepare("UPDATE reaktion SET video = ?, video_titel = ?, laeuft = 1,"
+ " sekunde = 0, geaendert = ? WHERE id = 1")
.run(zeile.video, zeile.titel, jetzt());
db().prepare("DELETE FROM reaktion_liste WHERE id = ?").run(zeile.id);
protokolliere(personId, "reaktion_weiter", zeile.video, "");
const s = sendung();
/* ZWEI MELDUNGEN, UND BEIDE WERDEN GEBRAUCHT.
„video" bringt jeden Player auf das neue Stueck -- das ist die
eilige. „reaktion" bringt die Liste und den Titel nach; sie
betrifft nur die Anzeige und darf einen Wimpernschlag spaeter
kommen. Nur die erste zu schicken hiesse: Das Video wechselt,
und im Pult steht weiter der alte Name. */
melden("reaktion", { was: "video", video: s.video, laeuft: true, sekunde: 0, gesendet: Date.now() });
return s;
}
function gaesteListe() {
return db().prepare(`
SELECT g.person_id AS id, g.stumm, g.platz, p.name, p.rolle
@@ -176,6 +237,7 @@ function lage(person) {
stand: s.stand,
titel: s.titel,
video: s.video,
video_titel: s.video_titel || "",
vorschau: s.vorschau,
beginnt_am: s.beginnt_am,
layout: s.layout,
@@ -219,6 +281,20 @@ function lage(person) {
moderiert: MODERIERT.has(person.rolle),
sicht: !!(dabei.find((d) => d.id === person.id)?.sicht),
},
/* DIE WARTESCHLANGE SEHEN NUR DIE ZWEI. Sie ist Teil der
Vorbereitung, und Filipe hat dazu gesagt: „nur die zwei sollen
alles sehen, vorbereiten und einschakten koennen." */
liste: istHost ? listeHolen() : null,
/* WAS ALS NAECHSTES KOMMT, DARF JEDER WISSEN -- und nur das.
Auf der Wartetafel steht damit etwas, das Lust macht, ohne den
ganzen Abend zu verraten. */
naechstes: (() => {
const n = db().prepare("SELECT titel, video FROM reaktion_liste"
+ " ORDER BY platz, id LIMIT 1").get();
return n ? (n.titel || n.video) : null;
})(),
liste_zahl: db().prepare("SELECT COUNT(*) AS n FROM reaktion_liste").get()?.n || 0,
liste_max: LISTE_MAX,
plaetze: SICHT_PLAETZE,
gaeste_max: GAESTE_MAX,
text_max: TEXT_MAX,
@@ -246,7 +322,7 @@ reaktionRouter.get("/workspace/api/reaktion", (req, res) => {
/** Der Host stellt ein: Titel, Video, Vorschaubild, Beginn. */
reaktionRouter.put("/workspace/api/reaktion", nurHost, express.json({ limit: "32kb" }),
(req, res) => {
async (req, res) => {
try {
const titel = String(req.body?.titel ?? "").trim().slice(0, 120);
const video = videoKennung(String(req.body?.video ?? ""));
@@ -276,9 +352,16 @@ reaktionRouter.put("/workspace/api/reaktion", nurHost, express.json({ limit: "32
(siehe /stand). Hier wird nur der leere Platz gefuellt, damit
die Ankuendigung „Als Naechstes" jemanden nennen kann. */
const bisher = sendung();
db().prepare(`UPDATE reaktion SET titel = ?, video = ?, vorschau = ?,
beginnt_am = ?, host_id = ?, geaendert = ? WHERE id = 1`)
.run(titel, video, vorschau, beginn,
/* DEN NAMEN DES VIDEOS NUR HOLEN, WENN ES EIN ANDERES IST.
Sonst faende bei jedem „Uebernehmen" -- auch wenn nur der
Beginn verschoben wurde -- eine Abfrage bei YouTube statt,
und das Speichern haengt an einem fremden Dienst. */
const videoTitelNeu = (video && video !== bisher.video)
? await videoTitel(video)
: (video ? (bisher.video_titel || "") : "");
db().prepare(`UPDATE reaktion SET titel = ?, video = ?, video_titel = ?,
vorschau = ?, beginnt_am = ?, host_id = ?, geaendert = ? WHERE id = 1`)
.run(titel, video, videoTitelNeu, vorschau, beginn,
bisher.host_id || req.person.id, jetzt());
const l = lage(req.person);
@@ -517,9 +600,21 @@ reaktionRouter.post("/workspace/api/reaktion/video", nurHost, express.json({ lim
if (req.body?.video !== undefined && !video) {
return res.status(400).json({ fehler: "video_unklar" });
}
const s0 = sendung();
if (video) {
db().prepare("UPDATE reaktion SET video = ?, laeuft = ?, sekunde = ?, geaendert = ? WHERE id = 1")
.run(video, laeuft, sekunde, jetzt());
/* Der Name wird NACHGEREICHT und nicht abgewartet: Diese
Route laeuft waehrend der Sendung im Sekundentakt. Sie
darf unter keinen Umstaenden auf YouTube warten. */
if (video !== s0.video) {
videoTitel(video).then((t) => {
try {
db().prepare("UPDATE reaktion SET video_titel = ? WHERE id = 1 AND video = ?")
.run(t, video);
} catch { /* dann steht dort die Kennung, und das ist ehrlich */ }
});
}
} else {
db().prepare("UPDATE reaktion SET laeuft = ?, sekunde = ? WHERE id = 1")
.run(laeuft, sekunde);
@@ -540,6 +635,123 @@ reaktionRouter.post("/workspace/api/reaktion/video", nurHost, express.json({ lim
}
});
/* ---------- Die Warteschlange ------------------------------------------
Vorher einraeumen, waehrend der Sendung nur weiterschalten.
WARUM DAS EINE EIGENE SACHE IST UND NICHT „NOCH EIN TEXTFELD":
Bisher gab es genau ein Video. Wer zwei Sachen hintereinander
schauen wollte, musste mitten in der Sendung eine YouTube-Adresse
in ein Feld tippen -- vor Publikum, mit laufender Kamera, mit dem
Risiko eines Tippfehlers und damit eines schwarzen Rechtecks.
Jetzt ist das eine Vorbereitung und kein Handgriff im Live. */
reaktionRouter.post("/workspace/api/reaktion/liste", nurHost, express.json({ limit: "8kb" }),
async (req, res) => {
try {
const video = videoKennung(String(req.body?.video ?? ""));
if (!video) return res.status(400).json({ fehler: "video_unklar" });
const wie_viele = db().prepare("SELECT COUNT(*) AS n FROM reaktion_liste").get()?.n || 0;
if (wie_viele >= LISTE_MAX) return res.status(409).json({ fehler: "liste_voll" });
/* DASSELBE VIDEO NICHT ZWEIMAL. Nicht aus Ordnungsliebe: Wer
es zweimal anhaengt, hat es schlicht vergessen -- und merkt
es erst, wenn es zum zweiten Mal laeuft und alle es schon
kennen. */
const schon = db().prepare("SELECT id FROM reaktion_liste WHERE video = ?").get(video);
if (schon) return res.status(409).json({ fehler: "liste_doppelt" });
const titel = await videoTitel(video);
const letzter = db().prepare("SELECT MAX(platz) AS p FROM reaktion_liste").get()?.p || 0;
db().prepare("INSERT INTO reaktion_liste (video, titel, platz, von_id, gesetzt_am)"
+ " VALUES (?,?,?,?,?)")
.run(video, titel, letzter + 1, req.person.id, jetzt());
const l = lage(req.person);
melden("reaktion", { was: "liste", lage: oeffentlich(l) });
res.json(l);
} catch (fehler) {
console.error("[reaktion] Liste anhaengen:", fehler?.message);
res.status(503).json({ fehler: "nicht_verfuegbar" });
}
});
reaktionRouter.delete("/workspace/api/reaktion/liste/:id", nurHost, (req, res) => {
try {
db().prepare("DELETE FROM reaktion_liste WHERE id = ?").run(Number(req.params.id) || 0);
const l = lage(req.person);
melden("reaktion", { was: "liste", lage: oeffentlich(l) });
res.json(l);
} catch (fehler) {
console.error("[reaktion] Liste weg:", fehler?.message);
res.status(503).json({ fehler: "nicht_verfuegbar" });
}
});
/** Eins hoch oder runter.
*
* GETAUSCHT WIRD MIT DEM NACHBARN, nicht neu durchnummeriert. Beim
* Durchnummerieren schreibt ein Klick jede Zeile der Liste neu;
* zwei Klicks gleichzeitig -- Filipe am Rechner, VanVan am Handy --
* ergeben dann eine Reihenfolge, die keiner von beiden wollte. Ein
* Tausch beruehrt zwei Zeilen und ist in sich abgeschlossen. */
reaktionRouter.post("/workspace/api/reaktion/liste/:id/schieben", nurHost,
express.json({ limit: "2kb" }), (req, res) => {
try {
const id = Number(req.params.id) || 0;
const hoch = String(req.body?.richtung ?? "hoch") === "hoch";
const alle = listeHolen();
const wo = alle.findIndex((z) => z.id === id);
if (wo < 0) return res.status(404).json({ fehler: "nicht_in_der_liste" });
const nachbar = alle[hoch ? wo - 1 : wo + 1];
if (!nachbar) return res.json(lage(req.person)); // schon ganz oben/unten
/* `node:sqlite` kennt kein `.transaction()` -- das gibt es nur
in better-sqlite3. Hier wird von Hand geklammert, so wie im
ganzen Haus. Ohne Klammer koennte zwischen den beiden
Schreibvorgaengen gelesen werden, und dann haetten zwei
Zeilen kurz denselben Platz. */
db().exec("BEGIN IMMEDIATE");
try {
db().prepare("UPDATE reaktion_liste SET platz = ? WHERE id = ?")
.run(nachbar.platz, alle[wo].id);
db().prepare("UPDATE reaktion_liste SET platz = ? WHERE id = ?")
.run(alle[wo].platz, nachbar.id);
db().exec("COMMIT");
} catch (schief) {
try { db().exec("ROLLBACK"); } catch { /* war schon zurueck */ }
throw schief;
}
const l = lage(req.person);
melden("reaktion", { was: "liste", lage: oeffentlich(l) });
res.json(l);
} catch (fehler) {
console.error("[reaktion] Liste schieben:", fehler?.message);
res.status(503).json({ fehler: "nicht_verfuegbar" });
}
});
/** Dieses hier jetzt -- oder schlicht das naechste. */
reaktionRouter.post("/workspace/api/reaktion/weiter", nurHost, express.json({ limit: "2kb" }),
(req, res) => {
try {
const id = Number(req.body?.id) || 0;
const zeile = id
? db().prepare("SELECT * FROM reaktion_liste WHERE id = ?").get(id)
: db().prepare("SELECT * FROM reaktion_liste ORDER BY platz, id LIMIT 1").get();
if (!zeile) return res.status(409).json({ fehler: "liste_leer" });
weiterZu(zeile, req.person.id);
const l = lage(req.person);
melden("reaktion", { was: "liste", lage: oeffentlich(l) });
res.json(l);
} catch (fehler) {
console.error("[reaktion] Weiter:", fehler?.message);
res.status(503).json({ fehler: "nicht_verfuegbar" });
}
});
reaktionRouter.post("/workspace/api/reaktion/layout", nurHost, express.json({ limit: "2kb" }),
(req, res) => {
try {
@@ -686,7 +898,7 @@ export function videoKennung(roh) {
* ohne dass es jemandem auffaellt, weil die Oberflaeche sie ja
* nicht anzeigt. */
function oeffentlich(l) {
const { zuschauer, ich, ...rest } = l;
const { zuschauer, ich, liste, ...rest } = l;
return rest;
}
workspace/anruf-probe.html
+5 -5
View File
@@ -16,8 +16,8 @@
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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
<!-- 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,
@@ -33,7 +33,7 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<style>
/* Bewusst in der Seite und nicht in einer eigenen Datei: Diese Seite
soll auch dann noch etwas anzeigen, wenn genau das schiefgeht,
@@ -135,7 +135,7 @@
<script src="assets/js/anruf-probe.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/anruf-probe.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
</body>
</html>
workspace/app.webmanifest
+4 -4
View File
@@ -23,25 +23,25 @@
},
"icons": [
{
"src": "/assets/img/app-symbole/workspace-192.png?v=202609280201",
"src": "/assets/img/app-symbole/workspace-192.png?v=202609280344",
"sizes": "192x192",
"type": "image/png",
"purpose": "any"
},
{
"src": "/assets/img/app-symbole/workspace-512.png?v=202609280201",
"src": "/assets/img/app-symbole/workspace-512.png?v=202609280344",
"sizes": "512x512",
"type": "image/png",
"purpose": "any"
},
{
"src": "/assets/img/app-symbole/workspace-192-maskable.png?v=202609280201",
"src": "/assets/img/app-symbole/workspace-192-maskable.png?v=202609280344",
"sizes": "192x192",
"type": "image/png",
"purpose": "maskable"
},
{
"src": "/assets/img/app-symbole/workspace-512-maskable.png?v=202609280201",
"src": "/assets/img/app-symbole/workspace-512-maskable.png?v=202609280344",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
workspace/assets/css/reaktion.css
+526 -109
View File
@@ -213,6 +213,20 @@
text-wrap: balance;
}
.warte__satz { margin: 14px 0 0; color: var(--schrift-leise); font-size: .92rem; }
/* Was nach dem ersten Stück kommt. Eine Zeile, kein Programmheft --
der Abend soll nicht vorher im Netz stehen. */
.warte__danach {
margin: 12px 0 0;
display: inline-block;
padding: 6px 13px;
border-radius: 999px;
background: rgba(255, 255, 255, .05);
border: 1px solid var(--rand);
color: var(--schrift-leise);
font-size: .78rem;
max-width: 100%;
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.countdown {
display: inline-flex; align-items: baseline; gap: 10px;
@@ -461,7 +475,25 @@
/* =====================================================================
DAS REGIEPULT
DIE REGIE
Sie ist nach dem Vorbild eines echten Regieplatzes gebaut und
nicht nach dem eines Formulars. Drei Dinge machen den Unterschied:
1. EINE LEISTE, DIE IMMER STEHT. Lampe, Laufzeit, Zahlen und die
drei grossen Knoepfe liegen ausserhalb des einklappbaren
Teils. Wer mitten in der Sendung „Beenden" drueckt, drueckt es,
weil etwas passiert ist -- das darf nicht hinter einer
Bewegung liegen.
2. REGISTER STATT STAPEL. Vorher lagen fuenf Kaesten untereinander
in einem Bereich, der hoechstens die halbe Bildschirmhoehe hat.
Man sah fuenf halbe Dinge. Jetzt eines ganz.
3. RUHIGE FLAECHEN. Ein Regieplatz, der selbst leuchtet, kaempft
mit dem Bild um die Aufmerksamkeit. Farbe gibt es nur dort, wo
sie etwas SAGT: rot heisst auf Sendung, bernstein heisst
gleich, alles andere ist grau.
===================================================================== */
/* ==== DAS PULT SCHIEBT, ES DECKT NICHT ZU =========================
(28.09.2026, gefunden im ersten Bild.)
@@ -475,150 +507,486 @@
mit `1fr auto`; klappt das Pult auf, wird der Kinosaal darueber
von selbst kleiner. Nichts wird verdeckt, und niemand muss eine
Hoehe ausrechnen, die spaeter nicht mehr stimmt. */
.saal { grid-template-rows: 1fr auto; }
/* 197 PIXEL ZUM SCROLLEN -- gemessen am 28.09.2026, sobald die Regie
aufgeklappt war.
`1fr` heisst nicht „nimm, was uebrig ist", sondern
`minmax(auto, 1fr)`: Die Zeile darf nie kleiner werden als ihr
Inhalt. Der Kinosaal hat aber einen Mindestinhalt, und mit
aufgeklapptem Pult passte beides nicht mehr in die Hoehe -- also
wuchs die Seite nach unten. Wer sendet, scrollte dann mitten in
der Sendung, um an das Bild oder an die Knoepfe zu kommen.
`minmax(0, 1fr)` erlaubt der Zeile zu schrumpfen. Der Kinosaal
wird kleiner, der Chat rollt in sich -- was er ohnehin tut. */
.saal { grid-template-rows: minmax(0, 1fr) auto; }
.pult {
z-index: 60;
background: rgba(7, 6, 13, .94);
background:
linear-gradient(180deg, rgba(255, 255, 255, .045), transparent 90px),
rgba(7, 6, 13, .95);
backdrop-filter: blur(18px) saturate(1.2);
-webkit-backdrop-filter: blur(18px) saturate(1.2);
border-top: 1px solid var(--rand-hell);
box-shadow: 0 -30px 70px -40px #000;
}
.pult__griff {
width: 100%;
appearance: none; border: 0; background: none;
display: flex; align-items: center; justify-content: center; gap: 10px;
padding: 9px 0 8px;
min-height: 44px;
cursor: pointer;
color: var(--schrift-leise);
/* ---- Die Leiste, die immer steht ------------------------------------- */
.pult__leiste {
display: flex; align-items: center; flex-wrap: wrap;
gap: 10px 16px;
padding: 11px 16px;
border-bottom: 1px solid var(--rand);
}
/* Die Lampe. In jedem Studio haengt sie ueber der Tuer, und sie ist
dort das Erste, was man sieht -- deshalb steht sie hier ganz
links und ist das Einzige, was Farbe traegt. */
.lampe {
display: inline-flex; align-items: center; gap: 9px;
padding: 7px 14px 7px 12px;
border-radius: 999px;
border: 1px solid var(--rand-hell);
background: rgba(255, 255, 255, .04);
font-size: .74rem; font-weight: 800;
letter-spacing: .2em; text-transform: uppercase;
letter-spacing: .14em; text-transform: uppercase;
color: var(--zu);
white-space: nowrap;
}
.pult__griff-strich {
width: 34px; height: 3px; border-radius: 3px;
background: var(--rand-hell);
.lampe__punkt {
width: 9px; height: 9px; border-radius: 50%;
background: currentColor;
flex: none;
}
.pult[data-stand="vorbereitung"] .lampe {
color: color-mix(in srgb, var(--gleich) 26%, #ffffff);
border-color: color-mix(in srgb, var(--gleich) 44%, transparent);
background: color-mix(in srgb, var(--gleich) 10%, transparent);
}
.pult[data-stand="live"] .lampe {
color: #ffe2e4;
border-color: color-mix(in srgb, var(--an) 62%, transparent);
background: color-mix(in srgb, var(--an) 22%, transparent);
box-shadow: 0 0 26px -12px var(--an);
}
.pult[data-stand="live"] .lampe__punkt {
background: var(--an-hell);
box-shadow: 0 0 10px 1px var(--an);
animation: lampe-puls 4s ease-in-out infinite;
}
/* Vier Sekunden, und nur zwischen zwei nahen Werten. Ein schnelles
Blinken waere auf einem dunklen Bild ein Stroboskop. */
@keyframes lampe-puls {
0%, 100% { opacity: 1; }
50% { opacity: .45; }
}
/* Die Laufzeit. Der Grund, warum in Regieraeumen ueberall Uhren
haengen: Ohne sie verschaetzt man sich um Viertelstunden. */
.laufzeit { display: flex; align-items: baseline; gap: 7px; }
.laufzeit__zahl {
/* Tabellenziffern -- sonst wackelt die Zeile bei jeder Sekunde. */
font-variant-numeric: tabular-nums;
font-size: 1.06rem; font-weight: 800;
letter-spacing: .01em;
color: var(--schrift);
}
.laufzeit__wort {
font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
color: var(--schrift-leise);
}
/* Die Zahlen. Vier Werte, jeder in zwei Zeilen -- Wort klein
darueber, Zahl gross darunter. So liest man sie im Vorbeisehen. */
.messwerte {
display: flex; flex-wrap: wrap; gap: 4px 18px;
margin: 0;
}
.messwerte__paar { display: grid; gap: 1px; }
.messwerte dt {
font-size: .72rem; letter-spacing: .06em;
color: var(--schrift-leise);
white-space: nowrap;
}
.messwerte dd {
margin: 0;
font-size: .95rem; font-weight: 800;
font-variant-numeric: tabular-nums;
color: var(--schrift);
}
/* Wenn die Kameraplaetze voll sind, ist das keine Warnung, sondern
eine Tatsache -- aber eine, die man sehen muss, bevor jemand
fragt, warum er kein Bild hat. */
.messwerte dd[data-eng="ja"] { color: color-mix(in srgb, var(--gleich) 22%, #ffffff); }
.messwerte dd[data-eng="voll"] { color: var(--an-hell); }
/* Die drei Knoepfe. Sie stehen rechts und wachsen in die Luecke --
auf einem breiten Schirm liegen sie damit am rechten Rand, auf
einem schmalen in einer eigenen Zeile. Keine Schwelle noetig:
`flex-wrap` misst, statt zu rechnen. */
.pult__tun { display: flex; gap: 9px; margin-left: auto; flex-wrap: wrap; }
.tun {
appearance: none; cursor: pointer;
min-height: 44px; padding: 0 18px;
border-radius: 12px;
border: 1px solid var(--rand-hell);
background: rgba(255, 255, 255, .05);
color: var(--schrift);
font-size: .86rem; font-weight: 800;
letter-spacing: .01em;
white-space: nowrap;
}
.tun--vor {
border-color: color-mix(in srgb, var(--gleich) 44%, transparent);
background: color-mix(in srgb, var(--gleich) 13%, transparent);
color: color-mix(in srgb, var(--gleich) 24%, #ffffff);
}
.tun--live {
border-color: color-mix(in srgb, var(--an) 56%, transparent);
background: linear-gradient(180deg,
color-mix(in srgb, var(--an) 74%, #000),
color-mix(in srgb, var(--an) 46%, #000));
color: #fff3f3;
box-shadow: 0 14px 30px -20px var(--an);
}
.tun--aus { color: var(--schrift-leise); }
.tun[disabled] { opacity: .38; cursor: default; box-shadow: none; }
.pult__klapp {
appearance: none; cursor: pointer;
width: 44px; height: 44px;
display: grid; place-items: center;
border-radius: 12px;
border: 1px solid var(--rand);
background: rgba(255, 255, 255, .03);
color: var(--schrift-leise);
}
.pult__klapp svg {
width: 20px; height: 20px;
fill: none; stroke: currentColor; stroke-width: 2;
stroke-linecap: round; stroke-linejoin: round;
transition: transform .18s ease;
}
.pult[data-auf="ja"] .pult__klapp svg { transform: rotate(180deg); }
/* ---- Der einklappbare Teil ------------------------------------------- */
.pult__innen {
display: none;
gap: 18px;
padding: 4px 18px 18px;
gap: 14px;
padding: 13px 16px 16px;
/* Hoechstens die halbe Hoehe -- darueber bleibt vom Saal nichts
mehr uebrig, und wer sendet, schaut auf das Bild und nicht auf
die Knoepfe. Was nicht hineinpasst, rollt. */
max-height: min(46dvh, 26rem);
/* KLEINER ALS DAS BILD. Gemessen mit 46dvh: Kinosaal 372 Pixel,
Regie 459 -- die Knoepfe waren groesser als das, worum es geht.
Mit 19rem bleibt das Bild der groessere Teil, und die
Sendungs-Tafel (264 Pixel) passt trotzdem ohne Rollen hinein. */
max-height: min(40dvh, 19rem);
overflow-y: auto;
}
.pult[data-auf="ja"] .pult__innen { display: grid; }
.pult__block {
display: grid; gap: 10px;
padding: 14px 15px 15px;
border-radius: 14px;
background: rgba(255, 255, 255, .03);
/* ---- Die Register ----------------------------------------------------- */
.reiter {
display: flex; gap: 4px; flex-wrap: wrap;
padding: 4px;
border-radius: 13px;
background: rgba(0, 0, 0, .35);
border: 1px solid var(--rand);
}
.pult__ueber {
margin: 0;
font-size: .74rem; font-weight: 800;
letter-spacing: .2em; text-transform: uppercase;
.reiter__knopf {
appearance: none; cursor: pointer;
display: inline-flex; align-items: center; gap: 7px;
min-height: 38px; padding: 0 14px;
border: 0; border-radius: 10px;
background: none;
color: var(--schrift-leise);
display: flex; align-items: baseline; gap: 10px;
font-size: .82rem; font-weight: 700;
}
.pult__klein { font-size: .72rem; letter-spacing: .04em; text-transform: none; opacity: .8; }
.pult__zeile { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.pult__feld { display: grid; gap: 5px; flex: 1 1 14rem; min-width: 0; }
.pult__feld--kurz { flex: 0 1 12rem; }
.pult__feld > span {
font-size: .72rem; font-weight: 700;
color: var(--schrift-leise); letter-spacing: .04em;
.reiter__knopf[aria-selected="true"] {
background: rgba(255, 255, 255, .08);
color: var(--schrift);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
}
.pult__feld input, .pult__wahl {
appearance: none;
padding: 10px 12px; min-height: 44px;
.reiter__zahl {
min-width: 20px; padding: 1px 6px;
border-radius: 999px;
background: rgba(255, 255, 255, .09);
font-size: .72rem; font-variant-numeric: tabular-nums;
text-align: center;
}
.reiter__zahl[data-leer="ja"] { opacity: .45; }
.pult-tafel { display: grid; gap: 12px; align-content: start; }
/* AUSDRUECKLICH. `display: grid` auf einer Klasse schlaegt die
eingebaute Regel `[hidden] { display: none }` des Browsers --
je nach Browser und Reihenfolge. Genau so ist in dieser Datei
schon einmal eine Chatschiene aufgegangen, die zu sein sollte.
Eine Zeile ist billiger als die Frage, wer gewinnt. */
.pult-tafel[hidden] { display: none; }
/* ---- Die Videospur ----------------------------------------------------
Vorher gab es fuer das laufende Video im Pult ueberhaupt keine
Bedienung. Wer spulen wollte, musste in das YouTube-Bild fassen --
und was dort passiert, passiert nur bei einem selbst, waehrend
alle anderen weiterlaufen.
--------------------------------------------------------------------- */
.spur {
display: grid; gap: 11px;
padding: 13px 14px 14px;
border-radius: 14px;
background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .02));
border: 1px solid var(--rand);
}
.spur__kopf { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.spur__marke {
flex: none;
padding: 3px 9px;
border-radius: 7px;
border: 1px solid var(--rand);
background: rgba(255, 255, 255, .05);
font-size: .72rem; font-weight: 800;
letter-spacing: .1em; text-transform: uppercase;
color: var(--schrift-leise);
}
.spur[data-laeuft="ja"] .spur__marke {
color: #ffe2e4;
border-color: color-mix(in srgb, var(--an) 50%, transparent);
background: color-mix(in srgb, var(--an) 18%, transparent);
}
.spur__titel {
min-width: 0;
font-size: .94rem; font-weight: 700;
color: var(--schrift);
/* Ein Videotitel kann sehr lang sein. Eine Zeile mit Auslassung
ist hier richtig: Die Spur soll nicht wachsen, nur weil jemand
ein Video mit langem Namen eingetragen hat. */
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.spur__titel[data-roh="ja"] {
color: var(--schrift-leise);
font-family: ui-monospace, "Cascadia Mono", Menlo, monospace;
font-size: .82rem;
}
.spur__band { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.spur__knopf {
appearance: none; cursor: pointer;
min-height: 40px; min-width: 44px; padding: 0 12px;
border-radius: 11px;
border: 1px solid var(--rand);
background: rgba(255, 255, 255, .04);
color: var(--schrift); font: inherit; font-size: .88rem;
min-width: 0;
background: rgba(255, 255, 255, .05);
color: var(--schrift);
font-size: .8rem; font-weight: 700;
font-variant-numeric: tabular-nums;
display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.spur__knopf--gross {
min-width: 52px;
background: rgba(255, 255, 255, .1);
}
.spur__knopf--gross svg { width: 18px; height: 18px; fill: currentColor; }
.spur__knopf--weiter {
border-color: rgba(154, 183, 255, .34);
background: rgba(154, 183, 255, .12);
color: #cfe0ff;
}
.spur__knopf[disabled] { opacity: .35; cursor: default; }
.spur__zeit {
font-size: .78rem; font-variant-numeric: tabular-nums;
color: var(--schrift-leise);
white-space: nowrap;
}
.spur__schiene {
appearance: none; -webkit-appearance: none;
flex: 1 1 10rem; min-width: 8rem;
height: 30px; background: none; cursor: pointer;
}
.spur__schiene::-webkit-slider-runnable-track {
height: 5px; border-radius: 3px;
background: linear-gradient(90deg, var(--an) var(--fortschritt, 0%),
rgba(255, 255, 255, .12) var(--fortschritt, 0%));
}
.spur__schiene::-webkit-slider-thumb {
-webkit-appearance: none;
width: 15px; height: 15px; margin-top: -5px;
border-radius: 50%;
background: #f4f1fb;
border: 1px solid rgba(0, 0, 0, .4);
}
.spur__schiene::-moz-range-track {
height: 5px; border-radius: 3px;
background: rgba(255, 255, 255, .12);
}
.spur__schiene::-moz-range-progress {
height: 5px; border-radius: 3px; background: var(--an);
}
.spur__schiene::-moz-range-thumb {
width: 15px; height: 15px; border-radius: 50%;
background: #f4f1fb; border: 1px solid rgba(0, 0, 0, .4);
}
.pult__wahl { flex: 1 1 12rem; }
/* ---- Die Regler ------------------------------------------------------
Vier Tonquellen nebeneinander: Host, Gast 1, Gast 2, YouTube. Sie
stehen SENKRECHT wie an einem Mischpult und nicht waagerecht wie
ein Formularregler -- vier waagerechte Regler untereinander liest
man als Liste, vier senkrechte nebeneinander sieht man auf einen
Blick.
--------------------------------------------------------------------- */
.regler-reihe { display: flex; gap: 12px; flex-wrap: wrap; }
.regler {
display: grid; justify-items: center; gap: 8px;
padding: 12px 10px 10px;
/* ---- Die Warteschlange ------------------------------------------------ */
.warteliste { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.warte-zeile {
display: flex; align-items: center; gap: 10px;
padding: 7px 9px 7px 7px;
border-radius: 12px;
background: rgba(0, 0, 0, .3);
border: 1px solid var(--rand);
min-width: 5.4rem;
background: rgba(255, 255, 255, .03);
}
.warte-zeile__nr {
flex: none;
width: 22px; text-align: center;
font-size: .78rem; font-weight: 800;
font-variant-numeric: tabular-nums;
color: var(--schrift-leise);
}
/* Das Vorschaubild kommt von YouTube selbst -- ohne es sind zehn
Zeilen Text kaum auseinanderzuhalten. */
.warte-zeile__bild {
flex: none;
width: 68px; aspect-ratio: 16 / 9;
border-radius: 7px; object-fit: cover;
background: #12101a;
border: 1px solid var(--rand);
}
.warte-zeile__titel {
flex: 1 1 8rem; min-width: 0;
font-size: .84rem; color: var(--schrift);
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.warte-zeile__titel[data-roh="ja"] {
color: var(--schrift-leise);
font-family: ui-monospace, "Cascadia Mono", Menlo, monospace;
font-size: .78rem;
}
.warte-zeile__knoepfe { display: flex; gap: 5px; flex: none; }
.warte-zeile__knoepfe button {
appearance: none; cursor: pointer;
min-height: 34px; min-width: 34px; padding: 0 9px;
border-radius: 9px;
border: 1px solid var(--rand);
background: rgba(255, 255, 255, .04);
color: var(--schrift-leise);
font-size: .78rem; font-weight: 700;
}
.warte-zeile__knoepfe button[data-was="jetzt"] {
border-color: rgba(154, 183, 255, .34);
color: #cfe0ff;
}
.warte-zeile__knoepfe button[disabled] { opacity: .3; cursor: default; }
.warte-leer {
margin: 0; padding: 14px 4px;
font-size: .82rem; color: var(--schrift-leise);
}
/* ---- Die Regler -------------------------------------------------------
Senkrecht, nebeneinander, mit Pegel daneben. Ein Mischpult sieht
so aus, und das ist kein Zitat: Vier waagerechte Regler
untereinander liest man als Formular, vier senkrechte nebeneinander
als EINEN Zustand.
DER PEGEL IST DAS EIGENTLICHE. Er beantwortet die Frage, die man
sich sonst erst nach der Sendung stellt: „War mein Mikro
ueberhaupt an?" Ein Regler auf 100 sagt darueber nichts.
--------------------------------------------------------------------- */
.regler-reihe { display: flex; gap: 10px; flex-wrap: wrap; }
.regler {
display: grid;
grid-template-columns: auto auto;
grid-template-areas: "wort wort" "schieber pegel" "zahl zahl" "stumm stumm";
justify-items: center; align-items: center;
gap: 7px 6px;
padding: 11px 11px 10px;
border-radius: 13px;
border: 1px solid var(--rand);
background: rgba(255, 255, 255, .03);
}
.regler__wort {
font-size: .74rem; font-weight: 800;
letter-spacing: .08em; text-transform: uppercase;
grid-area: wort;
font-size: .72rem; font-weight: 800;
letter-spacing: .05em;
color: var(--schrift-leise);
max-width: 5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
white-space: nowrap;
}
.regler input[type="range"] {
grid-area: schieber;
appearance: none; -webkit-appearance: none;
writing-mode: vertical-lr;
direction: rtl;
width: 26px; height: 104px;
background: none;
writing-mode: vertical-lr; direction: rtl;
width: 26px; height: 92px;
background: none; cursor: pointer;
}
/* DER FADER IST GRAU, DER PEGEL IST FARBIG -- so herum, und nicht
umgekehrt. Ein roter Fader steht bei jedem auf 100 und schreit
dauerhaft „Achtung", ohne etwas zu sagen. Die Farbe gehoert
dorthin, wo sie eine Auskunft ist: an den gemessenen Ausschlag. */
.regler input[type="range"]::-webkit-slider-runnable-track {
width: 6px; border-radius: 6px;
background: linear-gradient(180deg, var(--an), #3a3550);
width: 5px; border-radius: 3px;
background: linear-gradient(180deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, .08));
}
.regler input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
width: 22px; height: 14px; border-radius: 4px;
background: #e9e6f2;
border: 1px solid #0b0a12;
box-shadow: 0 2px 8px -2px #000;
margin-left: -8px;
width: 22px; height: 13px; margin-left: -9px;
border-radius: 4px;
background: linear-gradient(180deg, #f6f3fc, #b9b3cc);
border: 1px solid rgba(0, 0, 0, .45);
}
.regler input[type="range"]::-moz-range-track {
width: 6px; border-radius: 6px;
background: linear-gradient(180deg, var(--an), #3a3550);
width: 5px; border-radius: 3px;
background: linear-gradient(180deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, .08));
}
.regler input[type="range"]::-moz-range-thumb {
width: 22px; height: 14px; border-radius: 4px;
background: #e9e6f2; border: 1px solid #0b0a12;
width: 22px; height: 13px; border-radius: 4px;
background: linear-gradient(180deg, #f6f3fc, #b9b3cc);
border: 1px solid rgba(0, 0, 0, .45);
}
/* Der Pegel. Er waechst von unten und faellt langsam zurueck --
ein Balken, der sofort abfaellt, flackert und ist unlesbar. */
.pegel {
grid-area: pegel;
position: relative;
width: 7px; height: 92px;
border-radius: 4px;
background: rgba(255, 255, 255, .07);
overflow: hidden;
}
.pegel i {
position: absolute; left: 0; right: 0; bottom: 0;
height: var(--stand, 0%);
border-radius: 4px;
background: linear-gradient(0deg, #4fb27a 0%, #4fb27a 62%, var(--gleich) 84%, var(--an) 100%);
transition: height .09s linear;
}
.pegel[data-still="ja"] i { background: rgba(255, 255, 255, .16); }
.regler__zahl {
font-size: .72rem; font-variant-numeric: tabular-nums;
grid-area: zahl;
font-size: .74rem; font-variant-numeric: tabular-nums;
color: var(--schrift-leise);
}
.regler__stumm {
grid-area: stumm;
appearance: none; cursor: pointer;
min-height: 30px; padding: 4px 10px;
border-radius: 8px;
width: 100%; min-height: 32px; padding: 0 9px;
border-radius: 9px;
border: 1px solid var(--rand);
background: rgba(255, 255, 255, .04);
color: var(--schrift-leise);
font-size: .72rem; font-weight: 700;
font-size: .74rem; font-weight: 700;
}
.regler[data-stumm="ja"] .regler__stumm {
background: color-mix(in srgb, var(--an) 30%, transparent);
border-color: color-mix(in srgb, var(--an) 50%, transparent);
color: #ffd9db;
color: #ffe2e4;
}
/* ---- Gäste ----------------------------------------------------------- */
.gast-reihe { display: flex; flex-wrap: wrap; gap: 9px; }
.gast-karte {
display: flex; align-items: center; gap: 9px;
padding: 8px 10px 8px 12px;
border-radius: 999px;
padding: 8px 9px 8px 12px;
border-radius: 12px;
background: rgba(255, 255, 255, .04);
border: 1px solid var(--rand);
font-size: .82rem; color: var(--schrift);
@@ -629,14 +997,14 @@
}
.gast-karte button {
appearance: none; cursor: pointer;
min-width: 34px; min-height: 34px;
border-radius: 999px;
min-height: 32px; padding: 0 10px;
border-radius: 9px;
border: 1px solid var(--rand);
background: rgba(255, 255, 255, .05);
background: rgba(255, 255, 255, .04);
color: var(--schrift-leise);
font-size: .72rem; font-weight: 700;
font-size: .74rem; font-weight: 700;
}
.gast-leer { font-size: .8rem; color: var(--schrift-leise); }
.gast-leer { font-size: .8rem; color: var(--schrift-leise); margin: 0; }
/* ---- Anordnung ------------------------------------------------------- */
.layout-reihe { display: flex; gap: 9px; flex-wrap: wrap; }
@@ -655,35 +1023,55 @@
color: #cfe0ff;
}
/* ---- Die drei großen Knöpfe ------------------------------------------ */
.pult__block--tun {
display: flex; flex-wrap: wrap; gap: 10px;
background: none; border: 0; padding: 0;
/* ---- Die Kürzel ------------------------------------------------------- */
.kuerzel {
margin: 0;
display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center;
font-size: .72rem; color: var(--schrift-leise);
}
.tun {
appearance: none; cursor: pointer;
flex: 1 1 10rem;
min-height: 52px;
border-radius: 14px;
.kuerzel kbd {
display: inline-block;
padding: 1px 6px; margin-right: 2px;
border-radius: 6px;
border: 1px solid var(--rand-hell);
border-bottom-width: 2px;
background: rgba(255, 255, 255, .05);
font-family: inherit; font-size: .72rem; font-weight: 700;
color: var(--schrift);
font-size: .94rem; font-weight: 800;
letter-spacing: .01em;
}
.tun--vor {
border-color: color-mix(in srgb, var(--gleich) 44%, transparent);
background: color-mix(in srgb, var(--gleich) 14%, transparent);
color: color-mix(in srgb, var(--gleich) 24%, #ffffff);
/* ---- Felder im Pult --------------------------------------------------- */
.pult__block {
display: grid; gap: 10px;
padding: 13px 14px 14px;
border-radius: 14px;
background: rgba(255, 255, 255, .03);
border: 1px solid var(--rand);
}
.tun--live {
border-color: color-mix(in srgb, var(--an) 56%, transparent);
background: linear-gradient(180deg, color-mix(in srgb, var(--an) 74%, #000), color-mix(in srgb, var(--an) 46%, #000));
color: #fff3f3;
box-shadow: 0 16px 34px -20px var(--an);
.pult__ueber {
margin: 0;
display: flex; align-items: baseline; gap: 9px;
font-size: .74rem; font-weight: 800;
letter-spacing: .12em; text-transform: uppercase;
color: var(--schrift-leise);
}
.tun--aus { color: var(--schrift-leise); }
.tun[disabled] { opacity: .4; cursor: default; }
.pult__klein { margin: 0; font-size: .72rem; letter-spacing: .02em; text-transform: none; opacity: .85; }
.pult__zeile { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.pult__feld { display: grid; gap: 5px; flex: 1 1 14rem; min-width: 0; }
.pult__feld--kurz { flex: 0 1 12rem; }
.pult__feld > span {
font-size: .72rem; font-weight: 700;
color: var(--schrift-leise); letter-spacing: .04em;
}
.pult__feld input, .pult__wahl {
min-height: 44px; padding: 0 12px;
border-radius: 11px;
border: 1px solid var(--rand);
background: rgba(0, 0, 0, .34);
color: var(--schrift); font: inherit; font-size: .88rem;
min-width: 0;
}
.pult__wahl { flex: 1 1 12rem; }
/* =====================================================================
DAS HANDY
@@ -740,7 +1128,13 @@
.buehne-schild {
top: 8px;
padding: 5px 11px 6px;
font-size: .64rem;
/* NICHT KLEINER ALS .72rem -- das sind 11,52 px, die Untergrenze
des Hauses. Gemessen wurden hier .64rem = 10,24 px. Den Platz
holt sich die engere Sperrung zurueck: Bei Grossbuchstaben
kostet .14em Abstand mehr Breite als die zwei fehlenden
Zehntel Schriftgroesse. */
font-size: .72rem;
letter-spacing: .06em;
gap: 7px;
white-space: nowrap;
}
@@ -758,12 +1152,35 @@
.warte__buehne { gap: 18px; }
.pult__innen { max-height: 62dvh; }
/* ==== DIE REGIE AM HANDY ======================================
Die Leiste bleibt -- sie ist der Teil, den man im Notfall
braucht. Sie wird nur kleiner und legt die Knöpfe in eine
eigene Zeile, sobald es eng wird. Das macht `flex-wrap` von
selbst; hier steht nur, was dabei schrumpfen darf. */
.pult__leiste { gap: 8px 12px; padding: 9px 12px; }
.messwerte { gap: 3px 13px; }
.messwerte dd { font-size: .88rem; }
.laufzeit__zahl { font-size: .98rem; }
.tun { padding: 0 13px; font-size: .8rem; }
.pult__innen { padding: 11px 12px 14px; }
/* Die Register rollen waagerecht statt umzubrechen: Fünf Reiter in
zwei Zeilen sehen aus wie zehn Knöpfe. */
.reiter { flex-wrap: nowrap; overflow-x: auto; }
.reiter__knopf { white-space: nowrap; }
.regler-reihe { gap: 8px; }
.regler { padding: 9px 9px 8px; }
.regler input[type="range"], .pegel { height: 76px; }
.warte-zeile__bild { width: 54px; }
}
/* Wer weniger Bewegung eingestellt hat, bekommt keinen Puls. Die
Aussage bleibt -- der Punkt steht dann einfach da. */
@media (prefers-reduced-motion: reduce) {
.buehne-schild__punkt { animation: none !important; }
.buehne-schild__punkt,
.lampe__punkt { animation: none !important; }
.pult__klapp svg,
.pegel i { transition: none !important; }
}
/* ---- Der Ton-Knopf ---------------------------------------------------
workspace/assets/js/meldung.js
+11
View File
@@ -207,6 +207,17 @@
'Es sind schon zwei Gäste dabei. Nimm erst jemanden heraus.',
layout_unbekannt:
'Diese Anordnung gibt es nicht.',
liste_voll:
'Die Warteschlange ist voll. Nimm erst etwas heraus – '
+ 'mehr überblickt im Live sowieso niemand.',
liste_doppelt:
'Dieses Video steht schon in der Warteschlange.',
liste_leer:
'Die Warteschlange ist leer. Häng erst etwas an, '
+ 'dann gibt es ein Nächstes.',
nicht_in_der_liste:
'Dieser Eintrag steht nicht mehr in der Warteschlange – '
+ 'vielleicht hat ihn jemand anderes gerade genommen.',
zu_schnell:
'Das war viel auf einmal. Warte eine Minute – danach geht es weiter.',
nicht_dabei:
workspace/assets/js/reaktion.js
+720 -45
View File
@@ -115,7 +115,21 @@
saal.dataset.stand = lage.stand;
document.body.dataset.stand = lage.stand;
meineId = lage.ich.id;
const warSender = binSender;
binSender = lage.ich.host || lage.ich.gast;
/* WER GERADE ZUM SENDER GEWORDEN IST, BAUT SEINE LEITUNGEN NEU AUF.
Solange ich Zuschauer war, sind meine Verbindungen OHNE Spur
entstanden -- ich hatte ja nichts zu senden. Eine bestehende
Verbindung nachträglich zu füllen ginge nur mit einer neuen
Verhandlung; sie wegzuwerfen ist kürzer und sicher.
Ohne das blieb das Bild eines frisch dazugeholten Gastes beim
Host für immer schwarz, ohne eine einzige Fehlermeldung. */
if (binSender && !warSender && drähte.size) {
console.info('[reaktion] Ich sende jetzt -- Leitungen neu aufbauen.');
leitungenNeu();
}
/* ---- Das Schild ---- */
const worte = { zu: 'Geschlossen', vorbereitung: 'Gleich', live: 'Auf Sendung' };
@@ -151,6 +165,15 @@
|| (lage.video ? `https://i.ytimg.com/vi/${lage.video}/maxresdefault.jpg` : '');
bild.style.backgroundImage = quelle ? `url("${quelle}")` : '';
/* WAS ALS NÄCHSTES KOMMT, steht auf der Wartetafel -- für alle.
Nicht die ganze Liste: Der Abend soll nicht vorher im Netz
stehen. Aber etwas, das Lust macht, gehört dorthin. */
const gleich = $('warte-naechstes');
if (gleich) {
gleich.hidden = !(lage.naechstes && lage.stand !== 'zu');
if (!gleich.hidden) gleich.textContent = 'Danach: ' + lage.naechstes;
}
/* ---- Live ---- */
const kino = $('teil-live');
kino.dataset.layout = lage.layout || 'kino';
@@ -233,6 +256,21 @@
v.muted = false;
v.play().catch(() => { /* dann eben beim nächsten Tippen */ });
}
/* DER PLAYER GEHÖRT DAZU. Ein Knopf, der die Kameras laut macht
und das Video stumm lässt, ist schlimmer als keiner: Man drückt
ihn, etwas passiert, und trotzdem hört man den Film nicht. */
if (spielerBereit) {
try {
spieler.unMute();
spieler.setVolume(staende.video);
spieler.playVideo();
} catch { /* der nächste Takt richtet es */ }
}
/* DER KLANGRAUM AUCH. Ein AudioContext startet angehalten und
darf erst nach einer Handlung des Menschen laufen -- dieselbe
Regel wie beim Ton. Ohne das stehen die Pegel bei null, und
der Host denkt, sein Mikro sei tot. */
try { klangRaumHolen()?.resume(); } catch { /* dann eben nicht */ }
const knopf = $('ton-an');
if (knopf) knopf.hidden = true;
}
@@ -324,6 +362,13 @@
host: 'https://www.youtube-nocookie.com',
playerVars: {
rel: 0, modestbranding: 1, playsinline: 1,
/* STUMM STARTEN -- sonst startet es gar nicht.
Ein Player mit Ton darf ohne Handlung des Menschen nicht
losgehen. Gemessen: `onStateChange` ist nie ausgelöst
worden, bei niemandem. Für einen Zuschauer wäre das eine
Sackgasse gewesen -- er hat keine Bedienung und hätte nie
eine Möglichkeit gehabt, es zu starten. */
mute: 1,
/* Der Host steuert. Alle anderen sehen keine Bedienung --
wer mitten in einer gemeinsamen Sendung zurückspult,
spult nur für sich zurück und wundert sich dann. */
@@ -334,10 +379,30 @@
onReady: () => {
spielerBereit = true;
$('video-warte').hidden = true;
/* JEDER RICHTET SICH ZUERST NACH DEM STAND -- auch der Host.
Vorher stand hier `if (host) takt(); else folgen()`. Der
Host hat damit nur GEMELDET, wo er steht, und nie selbst
begonnen. Sein Player blieb unangetastet, `getPlayerState()`
gab „nicht gestartet", er meldete „laeuft nicht" -- und
alle anderen folgten ihm brav ins Stehen. Gemessen: bei
niemandem lief etwas, nicht eine Sekunde.
Und es ist auch fuer sich richtig: Laedt der Host mitten
in der Sendung neu, soll er dort weitermachen, wo die
Sendung steht, und nicht bei null. */
folgen(lage);
if (lage.ich.host) hostTakt();
else folgen(lage);
},
onStateChange: () => { if (lage && lage.ich.host) hostMelden(); },
onStateChange: (e) => {
/* Der Zustand steht am Element -- ablesbar von aussen, ohne
in den fremden Rahmen greifen zu muessen. Genau das
braucht die Messung, um zu sagen: Es LAEUFT wirklich. */
const worte = { '-1': 'unklar', 0: 'ende', 1: 'laeuft', 2: 'pause',
3: 'puffert', 5: 'bereit' };
$('video-platz').dataset.spieler = worte[String(e.data)] || String(e.data);
if (lage && lage.ich.host) hostMelden();
},
},
});
}
@@ -411,8 +476,27 @@
return meineId < anderer;
}
/* WER ALS ERSTER FRAGT, FRAGT FUER ALLE.
Die Wache `if (meinStrom)` wirkt erst, wenn die Kamera DA ist.
Solange die erste Anfrage laeuft, ist `meinStrom` noch null --
und jeder weitere Anruf stellte eine zweite Anfrage an dasselbe
Geraet. Gemessen: fuenf Anfragen beim Host. Der Browser gibt ein
Geraet nicht beliebig oft gleichzeitig heraus; eine davon blieb
liegen, und mit ihr der Anruf, der darauf wartete. Der Platz in
`ruftGerade` blieb belegt, und zwischen Host und Gast kam nie
wieder eine Leitung zustande.
Jetzt bekommen alle DASSELBE Versprechen zurueck. */
let kameraLaeuft = null;
async function kameraHolen() {
if (meinStrom) return meinStrom;
if (kameraLaeuft) return kameraLaeuft;
kameraLaeuft = kameraWirklichHolen();
try { return await kameraLaeuft; } finally { kameraLaeuft = null; }
}
async function kameraWirklichHolen() {
try {
meinStrom = await navigator.mediaDevices.getUserMedia({
/* 360p reicht für ein Fenster von 200 Pixeln Breite -- und es
@@ -435,7 +519,10 @@
let d = drähte.get(anderer);
if (d) return d;
const pc = new RTCPeerConnection({ iceServers: eisAdressen });
d = { pc, strom: null };
/* WANN DIESER DRAHT ENTSTANDEN IST. Ohne den Zeitpunkt lässt
sich „steht seit zehn Sekunden und liefert nichts" nicht von
„ist gerade erst losgegangen" unterscheiden. */
d = { pc, strom: null, seit: Date.now() };
drähte.set(anderer, d);
pc.onicecandidate = (e) => {
@@ -480,11 +567,38 @@
}
}
/** Wird an dieser Leitung gerade gearbeitet?
*
* ZWEI DINGE MUESSEN GELTEN, und das zweite ist das wichtigere:
* Der Browser steht nicht auf `stable` (Angebot und Antwort sind
* noch nicht beide da) UND es ist noch nicht lange her.
*
* Ohne die Uhr wird aus „wird verhandelt" ein Dauerzustand: Eine
* Leitung, deren Antwort nie ankommt, waere vor dem Wachhund UND
* vor der Bitte um einen Anruf sicher -- fuer immer. Genau das
* ist passiert, und es hat den Fehler nur von einer Seite auf die
* andere geschoben. */
const VERHANDLUNG_MS = 5000;
function verhandeltNoch(d) {
return d.pc.signalingState !== 'stable'
&& Date.now() - d.seit < VERHANDLUNG_MS;
}
/* Ein Anruf, der nie zurueckkommt, sperrt den Platz fuer immer --
`draehteNachziehen()` ueberspringt jeden, der in `ruftGerade`
steht. Zwanzig Sekunden sind fuer Angebot und Absenden reichlich;
was laenger braucht, ist haengengeblieben. */
const RUF_FRIST = 20000;
async function anrufen(anderer) {
if (!ichRufeAn(anderer)) return;
/* Der Platz wird belegt, BEVOR irgendetwas wartet. */
if (drähte.has(anderer) || ruftGerade.has(anderer)) return;
ruftGerade.add(anderer);
const notbremse = setTimeout(() => {
if (ruftGerade.delete(anderer)) {
console.warn('[reaktion] Anruf an', anderer, 'blieb haengen -- Platz freigegeben.');
}
}, RUF_FRIST);
try {
if (!meinStrom) await kameraHolen();
const d = draht(anderer);
@@ -506,6 +620,7 @@
const d = drähte.get(anderer);
if (d) { try { d.pc.close(); } catch { /* egal */ } drähte.delete(anderer); }
} finally {
clearTimeout(notbremse);
ruftGerade.delete(anderer);
}
}
@@ -519,10 +634,18 @@
zwei Anrufer und genau das Durcheinander zurueck, das die
Regel verhindert. */
if (!binSender || !ichRufeAn(von)) return;
/* ES LAEUFT SCHON. Der Bittende weiss das nicht -- er hat ja
noch nichts -- und fragt deshalb alle drei Sekunden weiter.
Wer hier weitermacht, wirft seine eigene, halbfertige
Verhandlung weg und fängt ewig von vorn an. */
if (ruftGerade.has(von)) return;
const alt = drähte.get(von);
if (alt && verhandeltNoch(alt)) return;
if (alt) {
/* Eine halbfertige Verbindung wegwerfen: Der andere hat
gerade gesagt, dass er nichts bekommen hat. */
/* Jetzt ist es wirklich eine Leiche: fertig verhandelt und
trotzdem ohne Bild. Weg damit. */
try { alt.pc.close(); } catch { /* egal */ }
drähte.delete(von);
}
@@ -530,6 +653,21 @@
return;
}
if (daten.typ === 'angebot') {
/* ==== ERST NACHSEHEN, DANN ANTWORTEN ====================
Halte ich mich fuer einen Zuschauer, kann das eine Sekunde
alt sein: Wer gerade als Gast dazugeholt wurde, bekommt
den Anruf des Hosts oft frueher als seine eigene neue
Lage. Er baute dann eine Verbindung OHNE Spur, antwortete
freundlich -- und beim Host blieb das Fenster schwarz.
Eine Anfrage in genau dem Moment, in dem ohnehin etwas
Neues passiert. Die Alternative waere, sechs Sekunden auf
den Wachhund zu warten; den behalten wir als Netz, aber
er soll nicht der Normalfall sein. */
if (!binSender && lage && lage.stand === 'live') {
await standHolen().catch(() => { /* dann eben mit dem alten Stand */ });
}
if (binSender && !meinStrom) await kameraHolen();
const d = draht(von);
await d.pc.setRemoteDescription(daten.sdp);
@@ -580,16 +718,74 @@
for (const g of lage.gaeste) sollen.add(g.id);
}
for (const id of sollen) {
if (drähte.has(id) || ruftGerade.has(id)) continue;
if (ichRufeAn(id)) anrufen(id);
else bitten(id);
}
/* ERST AUFRAEUMEN, DANN ANRUFEN -- und nicht umgekehrt.
Stand die Reihenfolge andersherum, merkte der Aufräumer eine
tote Leitung zwar, aber der Anrufer war schon vorbei: Neu
angerufen wurde erst im nächsten Durchgang, zweieinhalb
Sekunden später. Jemand sieht in dieser Zeit ein schwarzes
Fenster und weiß nicht, ob es noch kommt. */
for (const [id, d] of [...drähte]) {
if (!sollen.has(id)) {
try { d.pc.close(); } catch { /* egal */ }
drähte.delete(id);
continue;
}
/* ==== DIE STILLE LEITUNG ====================================
Von einem SENDER erwarte ich ein Bild. Kommt nach neun
Sekunden keins, ist der Draht tot -- auch wenn der Browser
ihn „connecting" nennt. Er wird weggeworfen, und der
nächste Durchgang ruft neu an.
WARUM NEUN SEKUNDEN: Ein Verbindungsaufbau über STUN
braucht im eigenen Netz unter einer Sekunde, über TURN
selten mehr als drei. Neun ist reichlich und trotzdem kurz
genug, dass es niemandem auffällt.
WARUM NUR BEI SENDERN: Ein Zuschauer schickt nichts. Bei
ihm ist „kein Bild" der Normalfall und kein Befund. */
/* ==== WER NOCH VERHANDELT, WIRD IN RUHE GELASSEN =========
Zwei Zeichen dafuer, und beide muessen gelten:
`ruftGerade` -- ein Angebot ist unterwegs. Zwischen dem
Anlegen der Leitung und dem Absenden liegen drei await;
genau darin hat der Wachhund zugeschlagen.
`signalingState !== 'stable'` -- Angebot und Antwort sind
noch nicht beide da. Eine Leitung ohne Bild ist in diesem
Zustand kein Befund, sondern der Normalfall. */
if (ruftGerade.has(id) || verhandeltNoch(d)) continue;
const erwarteBild = istSender(id);
const zustand = d.pc.connectionState;
/* SECHS SEKUNDEN. Ein Aufbau über STUN braucht im eigenen Netz
unter einer Sekunde, über TURN selten mehr als drei. Sechs
ist reichlich -- und kurz genug, dass niemand anfängt, an
seinem Browser zu zweifeln. */
const langGenug = Date.now() - d.seit > 6000;
const tot = (erwarteBild && !d.strom && langGenug)
|| (zustand === 'disconnected' && langGenug)
/* Steckengeblieben: nicht mehr in Verhandlung (die Uhr ist
abgelaufen) und trotzdem nicht fertig. Ohne diese Zeile
bleibt so eine Leitung ewig stehen und blockiert den
Platz. */
|| d.pc.signalingState !== 'stable';
if (tot) {
console.warn('[reaktion] Stille Leitung zu', id, '(' + zustand + ') -- neu aufbauen.');
try { d.pc.close(); } catch { /* egal */ }
drähte.delete(id);
/* Auch die Bremse lösen: Sonst wartet die nächste Bitte
noch drei Sekunden, obwohl gerade etwas kaputtging. */
zuletztGebeten.delete(id);
}
}
for (const id of sollen) {
if (drähte.has(id) || ruftGerade.has(id)) continue;
if (ichRufeAn(id)) anrufen(id);
else bitten(id);
}
kamerasZeichnen();
}
@@ -604,6 +800,19 @@
signalSenden(anderer, { typ: 'bitte-anrufen' });
}
/** Alle Leitungen weg, die Kamera bleibt.
*
* Unterschied zu `draehteWeg()`: Dort endet die Sendung, hier
* fängt sie für mich erst an. Die Kamera noch einmal freigeben zu
* lassen wäre eine zweite Abfrage im Browser -- und die kommt
* mitten in der Sendung. */
function leitungenNeu() {
for (const [, d] of drähte) { try { d.pc.close(); } catch { /* egal */ } }
drähte.clear();
ruftGerade.clear();
zuletztGebeten.clear();
}
function draehteWeg() {
for (const [, d] of drähte) { try { d.pc.close(); } catch { /* egal */ } }
drähte.clear();
@@ -674,7 +883,20 @@
}
/* =================================================================
DAS REGIEPULT
DIE REGIE
Sie ist nach dem Vorbild eines Regieplatzes gebaut, nicht nach
dem eines Formulars. Vier Dinge machen den Unterschied:
1. Eine Leiste, die IMMER steht -- Lampe, Laufzeit, Zahlen und
die drei grossen Knoepfe liegen ausserhalb des
einklappbaren Teils.
2. Register statt Stapel.
3. Eine Videospur mit echter Bedienung.
4. PEGEL an den Reglern. Sie beantworten die Frage, die man
sich sonst erst nach der Sendung stellt: „War mein Mikro
ueberhaupt an?" Ein Regler auf 100 sagt darueber nichts --
er sagt nur, wo der Knopf steht.
================================================================= */
const REGLER = [
{ schluessel: 'mikro', wort: 'Mein Mikro' },
@@ -682,9 +904,166 @@
{ schluessel: 'gast2', wort: 'Gast 2' },
{ schluessel: 'video', wort: 'YouTube' },
];
/* Die Regler-Staende. Sie stehen HIER und nicht im Pult: Der
YouTube-Regler gilt auch fuer jemanden, der gar kein Pult hat --
`tonAn()` setzt damit die Lautstaerke des Players. */
const staende = { mikro: 100, gast1: 100, gast2: 100, video: 100 };
/* Solange jemand am Positionsband zieht, wird es NICHT von der Uhr
ueberschrieben -- sonst rutscht der Griff unter dem Finger weg. */
let bandZieht = false;
/* ---- Die Pegel ---------------------------------------------------
Gemessen wird mit der Klanganalyse des Browsers: Ein
`AnalyserNode` je Quelle, alle 90 ms der lauteste Ausschlag.
DER YOUTUBE-REGLER HAT KEINEN ECHTEN PEGEL, und das steht auch
dabei. Der Ton kommt aus einem fremden Rahmen; ihn zu messen
hiesse, in eine fremde Seite zu greifen, und das laesst kein
Browser zu. Dort zeigt der Balken deshalb grau die EINGESTELLTE
Lautstaerke. Einen erfundenen Ausschlag zu zeichnen waere
schlimmer als keiner -- man wuerde ihm glauben. */
let klangRaum = null;
const pegelQuellen = new Map(); // schluessel -> { analyse, feld, spitze }
function klangRaumHolen() {
if (klangRaum) return klangRaum;
const Bau = window.AudioContext || window.webkitAudioContext;
if (!Bau) return null;
try { klangRaum = new Bau(); } catch { return null; }
return klangRaum;
}
function pegelAnschliessen(schluessel, strom) {
if (!strom || !strom.getAudioTracks || !strom.getAudioTracks().length) return;
const raum = klangRaumHolen();
if (!raum) return;
const vorher = pegelQuellen.get(schluessel);
if (vorher && vorher.strom === strom) return;
try {
const quelle = raum.createMediaStreamSource(strom);
const analyse = raum.createAnalyser();
analyse.fftSize = 512;
analyse.smoothingTimeConstant = .5;
quelle.connect(analyse);
/* NICHT an den Lautsprecher weiterreichen. Der Ton laeuft
ueber das Videoelement; ein zweiter Weg hiesse, alles
doppelt zu hoeren. */
pegelQuellen.set(schluessel, {
strom, analyse, feld: new Uint8Array(analyse.frequencyBinCount), spitze: 0,
});
} catch { /* dann bleibt der Balken dunkel, und das ist ehrlich */ }
}
function pegelTakt() {
for (const r of REGLER) {
const kasten = document.querySelector(`.regler[data-was="${r.schluessel}"]`);
if (!kasten) continue;
const balken = kasten.querySelector('.pegel');
if (!balken) continue;
if (r.schluessel === 'video') {
/* KEIN MESSWERT -- die eingestellte Lautstärke, und zwar
GRAU. Im ersten Bild stand hier ein grün-gelb-roter
Vollausschlag, und der sah aus wie ein Signal. Genau das
sollte er nie: Einen erfundenen Pegel zu zeichnen ist
schlimmer als keiner, weil man ihm glaubt. */
const aus = kasten.dataset.stumm === 'ja';
balken.dataset.still = 'ja';
balken.style.setProperty('--stand', (aus ? 0 : staende.video) + '%');
continue;
}
const q = pegelQuellen.get(r.schluessel);
if (!q) { balken.style.setProperty('--stand', '0%'); continue; }
q.analyse.getByteTimeDomainData(q.feld);
let summe = 0;
for (let i = 0; i < q.feld.length; i++) {
const w = (q.feld[i] - 128) / 128;
summe += w * w;
}
const mittel = Math.sqrt(summe / q.feld.length);
/* Auf eine Skala, die dem Ohr entspricht: leise Sprache soll
sichtbar ausschlagen, nicht erst Geschrei. */
const hoch = Math.min(100, Math.round(Math.sqrt(mittel) * 165));
/* Schnell hoch, langsam runter -- ein Balken, der sofort
abfaellt, flackert und ist unlesbar. */
q.spitze = hoch > q.spitze ? hoch : Math.max(hoch, q.spitze - 7);
balken.style.setProperty('--stand', q.spitze + '%');
balken.dataset.still = kasten.dataset.stumm === 'ja' ? 'ja' : 'nein';
}
}
/** Woher kommt der Ton fuer welchen Regler? */
function pegelNachziehen() {
if (meinStrom) pegelAnschliessen('mikro', meinStrom);
const fremde = [...document.querySelectorAll('#kameras .kamera')]
.filter((k) => k.dataset.wer !== String(meineId));
fremde.forEach((k, i) => {
if (i > 1) return;
const v = k.querySelector('video');
if (v && v.srcObject) pegelAnschliessen(i === 0 ? 'gast1' : 'gast2', v.srcObject);
});
}
/* ---- Was die eigene Leitung traegt --------------------------------
GEMESSEN, NICHT GERECHNET. „Zwoelf mal 350 kbit/s" ist eine
Schaetzung aus der Planung; was wirklich hinausgeht, weiss nur
die Verbindung selbst. Der Unterschied zwischen „es ruckelt bei
euch?" und „ich sehe, dass es zu viel wird" sind genau diese
zwei Zeilen. */
let letzteBytes = 0;
let letzteZeit = 0;
async function lastMessen() {
if (!drähte.size) {
letzteBytes = 0; letzteZeit = 0;
const f = $('z-last'); if (f) f.textContent = '–';
return;
}
let bytes = 0;
for (const { pc } of drähte.values()) {
try {
const bericht = await pc.getStats();
bericht.forEach((e) => {
if (e.type === 'outbound-rtp' && !e.isRemote) bytes += e.bytesSent || 0;
});
} catch { /* eine Verbindung im Aufbau hat noch keine Zahlen */ }
}
const jetzt = Date.now();
if (letzteZeit && jetzt > letzteZeit && bytes >= letzteBytes) {
const bit = (bytes - letzteBytes) * 8 / ((jetzt - letzteZeit) / 1000);
const f = $('z-last');
if (f) {
f.textContent = bit > 900_000
? (bit / 1_000_000).toFixed(1).replace('.', ',') + ' Mbit/s'
: Math.round(bit / 1000) + ' kbit/s';
}
}
letzteBytes = bytes; letzteZeit = jetzt;
}
/* ---- Zeiten in Worte --------------------------------------------- */
function alsZeit(sekunden) {
const s = Math.max(0, Math.floor(sekunden || 0));
const st = Math.floor(s / 3600);
const m = Math.floor((s % 3600) / 60);
const r = s % 60;
const zwei = (n) => String(n).padStart(2, '0');
return st ? `${st}:${zwei(m)}:${zwei(r)}` : `${m}:${zwei(r)}`;
}
/* =================================================================
DAS PULT AUFBAUEN -- einmal, beim ersten Zeichnen
================================================================= */
function pultAufbauen() {
const pult = $('pult');
pult.dataset.auf = 'ja';
/* ---- Die Register ---- */
for (const knopf of $('reiter').children) {
knopf.addEventListener('click', () => reiterWechseln(knopf.dataset.tafel));
}
/* ---- Die Regler ---- */
const reihe = $('regler');
reihe.textContent = '';
@@ -692,6 +1071,7 @@
const kasten = el('div', 'regler');
kasten.dataset.was = r.schluessel;
kasten.append(el('span', 'regler__wort', r.wort));
const schieber = document.createElement('input');
schieber.type = 'range';
schieber.min = '0'; schieber.max = '100'; schieber.value = '100';
@@ -703,29 +1083,23 @@
tonNachziehen();
});
kasten.append(schieber);
const balken = el('div', 'pegel');
balken.append(el('i'));
kasten.append(balken);
kasten.append(zahl);
const stumm = el('button', 'regler__stumm', 'stumm');
stumm.type = 'button';
stumm.addEventListener('click', () => {
const jetztStumm = kasten.dataset.stumm !== 'ja';
kasten.dataset.stumm = jetztStumm ? 'ja' : 'nein';
tonNachziehen();
/* Beim eigenen Mikro gilt das für ALLE -- die Spur wird
abgeschaltet, und dann kommt beim Empfänger nichts mehr an.
Bei den Gästen gilt es nur hier; für alle stummschalten
geht über den Knopf an der Gastkarte. */
if (r.schluessel === 'mikro' && meinStrom) {
for (const s of meinStrom.getAudioTracks()) s.enabled = !jetztStumm;
}
});
stumm.addEventListener('click', () => stummSchalten(r.schluessel));
kasten.append(stumm);
reihe.append(kasten);
}
const hinweis = el('p', 'pult__klein',
'Die Regler gelten für das, was DU hörst. Nur „Mein Mikro" und '
+ 'der Stummschalter an einem Gast gelten für alle.');
reihe.parentElement.append(hinweis);
$('ton-hinweis').textContent =
'Die Regler gelten für das, was DU hörst. Nur „Mein Mikro" und der '
+ 'Stummschalter an einer Gastkarte gelten für alle. Der Balken zeigt '
+ 'den gemessenen Pegel — beim YouTube-Regler die eingestellte '
+ 'Lautstärke, denn Ton aus einem fremden Rahmen lässt sich nicht messen.';
/* ---- Anordnung ---- */
const layouts = [
@@ -739,18 +1113,39 @@
const k = el('button', 'layout-knopf', wort);
k.type = 'button';
k.dataset.layout = schluessel;
k.addEventListener('click', async () => {
const a = await hole('/workspace/api/reaktion/layout', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ layout: schluessel }),
});
if (!a.ok) melde(await a.json().catch(() => null), 'Die Anordnung ging nicht.');
});
k.addEventListener('click', () => layoutSetzen(schluessel));
lreihe.append(k);
}
/* ---- Die Knöpfe ---- */
/* ---- Die Videospur ---- */
$('v-spiel').addEventListener('click', spielPause);
$('v-zurueck').addEventListener('click', () => springen(-10));
$('v-vor').addEventListener('click', () => springen(10));
$('v-naechstes').addEventListener('click', () => weiterSchalten(0));
const band = $('v-band');
band.addEventListener('pointerdown', () => { bandZieht = true; });
band.addEventListener('input', () => {
bandZieht = true;
if (!spielerBereit) return;
const dauer = spieler.getDuration() || 0;
$('v-zeit').textContent = `${alsZeit(dauer * band.value / 1000)} / ${alsZeit(dauer)}`;
band.style.setProperty('--fortschritt', (band.value / 10) + '%');
});
band.addEventListener('change', () => {
bandZieht = false;
if (!spielerBereit) return;
const dauer = spieler.getDuration() || 0;
spieler.seekTo(dauer * band.value / 1000, true);
hostMelden();
});
/* ---- Die Warteschlange ---- */
$('l-anhaengen').addEventListener('click', anhaengen);
$('l-neu').addEventListener('keydown', (e) => {
if (e.key === 'Enter') { e.preventDefault(); anhaengen(); }
});
/* ---- Die grossen Knoepfe ---- */
$('p-sichern').addEventListener('click', einstellen);
$('p-vorbereiten').addEventListener('click', () => standSetzen('vorbereitung'));
$('p-starten').addEventListener('click', () => standSetzen('live'));
@@ -768,17 +1163,166 @@
$('p-holen').addEventListener('click', gastHolen);
$('pult-griff').addEventListener('click', () => {
const pult = $('pult');
const auf = pult.dataset.auf !== 'ja';
pult.dataset.auf = auf ? 'ja' : 'nein';
$('pult-griff').setAttribute('aria-expanded', String(auf));
});
tastaturAnhaengen();
/* Drei Takte, drei Geschwindigkeiten -- jeder so schnell, wie er
sein muss, und keiner schneller. */
setInterval(pegelTakt, 90); // Pegel: das Auge sieht darunter nichts mehr
setInterval(leisteTakt, 500); // Uhr und Positionsband
setInterval(() => { pegelNachziehen(); lastMessen(); }, 2500);
}
function reiterWechseln(name) {
for (const knopf of $('reiter').children) {
knopf.setAttribute('aria-selected', String(knopf.dataset.tafel === name));
}
for (const tafel of document.querySelectorAll('.pult-tafel')) {
tafel.hidden = tafel.dataset.tafel !== name;
}
}
function stummSchalten(schluessel) {
const kasten = document.querySelector(`.regler[data-was="${schluessel}"]`);
if (!kasten) return;
const jetztStumm = kasten.dataset.stumm !== 'ja';
kasten.dataset.stumm = jetztStumm ? 'ja' : 'nein';
tonNachziehen();
/* Beim eigenen Mikro gilt das für ALLE -- die Spur wird
abgeschaltet, und dann kommt beim Empfänger nichts mehr an.
Bei den Gästen gilt es nur hier; für alle stummschalten geht
über den Knopf an der Gastkarte. */
if (schluessel === 'mikro' && meinStrom) {
for (const s of meinStrom.getAudioTracks()) s.enabled = !jetztStumm;
}
}
async function layoutSetzen(schluessel) {
const a = await hole('/workspace/api/reaktion/layout', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ layout: schluessel }),
});
if (!a.ok) melde(await a.json().catch(() => null), 'Die Anordnung ging nicht.');
}
/* ---- Die Videospur bedienen -------------------------------------- */
function spielPause() {
if (!spielerBereit) return;
if (spieler.getPlayerState() === 1) spieler.pauseVideo();
else spieler.playVideo();
hostMelden();
}
function springen(um) {
if (!spielerBereit) return;
spieler.seekTo(Math.max(0, spieler.getCurrentTime() + um), true);
hostMelden();
}
async function weiterSchalten(id) {
const a = await hole('/workspace/api/reaktion/weiter', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ id: id || 0 }),
});
if (!a.ok) { melde(await a.json().catch(() => null), 'Das ging nicht.'); return; }
lage = { ...(await a.json()) };
zeichnen();
}
async function anhaengen() {
const feld = $('l-neu');
const roh = feld.value.trim();
if (!roh) { sagFehler('Erst eine YouTube-Adresse einfügen.'); return; }
$('l-anhaengen').disabled = true;
try {
const a = await hole('/workspace/api/reaktion/liste', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ video: roh }),
});
if (!a.ok) { melde(await a.json().catch(() => null), 'Das ging nicht.'); return; }
lage = { ...(await a.json()) };
feld.value = '';
zeichnen();
} catch { sagFehler('Das ging gerade nicht.'); }
finally { $('l-anhaengen').disabled = false; }
}
async function listeRuf(pfad, einstellungen) {
const a = await hole(pfad, einstellungen);
if (!a.ok) { melde(await a.json().catch(() => null), 'Das ging nicht.'); return; }
lage = { ...(await a.json()) };
zeichnen();
}
/* ---- Die Tastatur -------------------------------------------------
EIN KUERZEL, DAS NIEMAND KENNT, IST KEINS -- deshalb steht die
Legende unter dem Pult und nicht in einer Hilfe.
UND: Wer in einem Feld tippt, tippt. Die Leertaste gehoert dann
dem Text und nicht dem Video. Ohne diese Abfrage waere das
Titelfeld unbenutzbar, und zwar auf eine Art, die man sich nicht
erklaeren kann. */
function tastaturAnhaengen() {
document.addEventListener('keydown', (e) => {
if (!lage || !lage.ich.host) return;
if (e.metaKey || e.ctrlKey || e.altKey) return;
if (e.target && e.target.closest('input, textarea, select, [contenteditable="true"]')) return;
const taste = e.key;
if (taste === ' ' || taste === 'Spacebar') { e.preventDefault(); spielPause(); return; }
if (taste === 'ArrowLeft') { e.preventDefault(); springen(-10); return; }
if (taste === 'ArrowRight') { e.preventDefault(); springen(10); return; }
if (taste === 'm' || taste === 'M') { e.preventDefault(); stummSchalten('mikro'); return; }
if (taste === 'n' || taste === 'N') { e.preventDefault(); weiterSchalten(0); return; }
if (taste === '1') { e.preventDefault(); layoutSetzen('kino'); return; }
if (taste === '2') { e.preventDefault(); layoutSetzen('gleich'); return; }
if (taste === '3') { e.preventDefault(); layoutSetzen('kamera'); }
});
}
/* ---- Der halbsekündliche Takt: Uhr und Positionsband -------------- */
function leisteTakt() {
if (!lage || !lage.ich.host) return;
/* Die Laufzeit */
const uhr = $('pult-uhr');
if (lage.stand === 'live' && lage.gestartet_am) {
const seit = Date.parse(lage.gestartet_am);
uhr.hidden = !Number.isFinite(seit);
if (!uhr.hidden) $('pult-zeit').textContent = alsZeit((Date.now() - seit) / 1000);
} else {
uhr.hidden = true;
}
/* Das Positionsband */
if (!spielerBereit) return;
const laeuft = spieler.getPlayerState() === 1;
$('spur').dataset.laeuft = laeuft ? 'ja' : 'nein';
$('spur-marke').textContent = laeuft ? 'Läuft' : 'Pause';
$('v-spiel-bild').innerHTML = laeuft
? '<path d="M8 5h3v14H8zm5 0h3v14h-3z" />'
: '<path d="M8 5l11 7-11 7z" />';
$('v-spiel').title = laeuft ? 'Pause (Leertaste)' : 'Abspielen (Leertaste)';
if (bandZieht) return;
const dauer = spieler.getDuration() || 0;
const jetzt = spieler.getCurrentTime() || 0;
$('v-zeit').textContent = `${alsZeit(jetzt)} / ${alsZeit(dauer)}`;
const band = $('v-band');
const anteil = dauer ? Math.min(1000, Math.round(jetzt / dauer * 1000)) : 0;
band.value = String(anteil);
band.style.setProperty('--fortschritt', (anteil / 10) + '%');
}
function tonNachziehen() {
/* YouTube */
if (spielerBereit) {
const aus = $('regler').querySelector('.regler[data-was="video"]')?.dataset.stumm === 'ja';
const aus = document.querySelector('.regler[data-was="video"]')?.dataset.stumm === 'ja';
spieler.setVolume(aus ? 0 : staende.video);
}
/* Die Gäste: das erste und zweite Kamerafenster, das nicht mir gehört. */
@@ -786,15 +1330,54 @@
.filter((k) => k.dataset.wer !== String(meineId));
fremde.forEach((k, i) => {
const schluessel = i === 0 ? 'gast1' : 'gast2';
const kasten = $('regler').querySelector(`.regler[data-was="${schluessel}"]`);
const kasten = document.querySelector(`.regler[data-was="${schluessel}"]`);
const aus = kasten && kasten.dataset.stumm === 'ja';
const v = k.querySelector('video');
if (v) v.volume = aus ? 0 : (staende[schluessel] / 100);
});
}
/* =================================================================
DAS PULT FUELLEN -- bei jeder Aenderung
================================================================= */
function pultFuellen() {
$('p-titel').value = lage.titel || '';
const pult = $('pult');
pult.dataset.stand = lage.stand;
/* ---- Die Leiste ---- */
const worte = { zu: 'Geschlossen', vorbereitung: 'Gleich', live: 'Auf Sendung' };
$('pult-wort').textContent = worte[lage.stand] || '…';
$('z-dabei').textContent = String(lage.dabei);
const mitBild = (lage.zuschauer || []).filter((z) => z.sicht).length;
const sichtFeld = $('z-sicht');
sichtFeld.textContent = `${mitBild} / ${lage.plaetze}`;
sichtFeld.dataset.eng = mitBild >= lage.plaetze ? 'voll'
: (mitBild >= lage.plaetze - 2 ? 'ja' : 'nein');
$('z-gaeste').textContent = `${lage.gaeste.length} / ${lage.gaeste_max}`;
/* ---- Die Videospur ---- */
const titel = $('spur-titel');
if (lage.video) {
titel.textContent = lage.video_titel || lage.video;
titel.dataset.roh = lage.video_titel ? 'nein' : 'ja';
titel.title = lage.video_titel
? lage.video_titel
: 'YouTube hat den Namen nicht herausgerückt — hier steht die Kennung.';
} else {
titel.textContent = 'Noch kein Video eingetragen';
titel.dataset.roh = 'nein';
titel.title = '';
}
for (const id of ['v-spiel', 'v-zurueck', 'v-vor', 'v-band']) {
$(id).disabled = !lage.video || lage.stand !== 'live';
}
$('v-naechstes').disabled = !(lage.liste && lage.liste.length);
/* ---- Die Warteschlange ---- */
listeZeichnen();
/* ---- Die Felder ---- */
if (document.activeElement !== $('p-titel')) $('p-titel').value = lage.titel || '';
if (document.activeElement !== $('p-video')) $('p-video').value = lage.video || '';
if (document.activeElement !== $('p-vorschau')) $('p-vorschau').value = lage.vorschau || '';
if (lage.beginnt_am && document.activeElement !== $('p-beginn')) {
@@ -819,7 +1402,7 @@
k.setAttribute('aria-pressed', String(k.dataset.layout === (lage.layout || 'kino')));
}
/* Gäste */
/* ---- Gäste ---- */
$('gast-zahl').textContent = `${lage.gaeste.length} von ${lage.gaeste_max}`;
const greihe = $('gast-reihe');
greihe.textContent = '';
@@ -871,6 +1454,82 @@
if (vorher) wahl.value = vorher;
}
function listeZeichnen() {
const liste = lage.liste || [];
const zahl = $('reiter-liste-zahl');
zahl.textContent = String(liste.length);
zahl.dataset.leer = liste.length ? 'nein' : 'ja';
const kasten = $('warteliste');
kasten.textContent = '';
if (!liste.length) {
const leer = el('li');
leer.append(el('p', 'warte-leer',
'Nichts vorbereitet. Häng oben eine YouTube-Adresse an — dann '
+ 'reicht im Live ein Druck auf „Nächstes".'));
kasten.append(leer);
return;
}
liste.forEach((z, i) => {
const zeile = el('li', 'warte-zeile');
zeile.append(el('span', 'warte-zeile__nr', String(i + 1)));
const bild = document.createElement('img');
bild.className = 'warte-zeile__bild';
bild.src = `https://i.ytimg.com/vi/${z.video}/mqdefault.jpg`;
bild.alt = '';
bild.loading = 'lazy';
bild.decoding = 'async';
zeile.append(bild);
const name = el('span', 'warte-zeile__titel', z.titel || z.video);
name.dataset.roh = z.titel ? 'nein' : 'ja';
name.title = z.titel || ('Kennung ' + z.video);
zeile.append(name);
const knoepfe = el('div', 'warte-zeile__knoepfe');
const jetzt = el('button', null, 'Jetzt');
jetzt.type = 'button';
jetzt.dataset.was = 'jetzt';
jetzt.title = 'Sofort dieses Video spielen';
jetzt.addEventListener('click', () => weiterSchalten(z.id));
const hoch = el('button', null, '↑');
hoch.type = 'button';
hoch.title = 'Nach oben';
hoch.disabled = i === 0;
hoch.addEventListener('click', () => listeRuf(
`/workspace/api/reaktion/liste/${z.id}/schieben`,
{
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ richtung: 'hoch' }),
}));
const runter = el('button', null, '↓');
runter.type = 'button';
runter.title = 'Nach unten';
runter.disabled = i === liste.length - 1;
runter.addEventListener('click', () => listeRuf(
`/workspace/api/reaktion/liste/${z.id}/schieben`,
{
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ richtung: 'runter' }),
}));
const weg = el('button', null, '×');
weg.type = 'button';
weg.title = 'Aus der Warteschlange nehmen';
weg.addEventListener('click', () => listeRuf(
'/workspace/api/reaktion/liste/' + z.id, { method: 'DELETE' }));
knoepfe.append(jetzt, hoch, runter, weg);
zeile.append(knoepfe);
kasten.append(zeile);
});
}
async function einstellen() {
try {
const beginn = $('p-beginn').value
@@ -937,13 +1596,24 @@
beides gehört nur dem Empfänger. Was hier ankommt, wird
daher ÜBER den eigenen Stand gelegt, nicht an seine
Stelle gesetzt. */
lage = { ...lage, ...d.lage, ich: lage.ich, zuschauer: lage.zuschauer };
/* `ich`, `zuschauer` und `liste` stehen NICHT im Rundruf --
sie gehen nur an den, der sie sehen darf (siehe
`oeffentlich()` im Server). Würden sie hier nicht
hinübergerettet, verlöre die Regie bei jeder fremden
Änderung ihre Warteschlange und ihre Namensliste. */
lage = {
...lage, ...d.lage,
ich: lage.ich, zuschauer: lage.zuschauer, liste: lage.liste,
};
zeichnen();
anschliessen();
/* Die eigene Rolle kann sich geändert haben (dazugeholt oder
entlassen). Das steht nur im eigenen Stand. */
if (d.was === 'du_bist_gast' || d.was === 'du_bist_kein_gast') standHolen();
if (d.was === 'dabei' || d.was === 'weg') { if (lage.ich.host) standHolen(); }
/* Hat die andere Regie etwas an der Warteschlange geändert,
muss ich sie neu holen -- im Rundruf steht sie nicht. */
if (d.was === 'liste' && lage.ich.host) standHolen();
}
} catch { /* eine kaputte Meldung darf die Seite nicht kippen */ }
});
@@ -1086,11 +1756,16 @@
/* Der Knopf steht nur da, solange er gebraucht wird -- und nur,
wenn überhaupt jemand sendet. */
/* DER KNOPF HÄNGT AN DER SENDUNG, NICHT AN DEN KAMERAS.
Vorher fragte er „gibt es fremde Kamerafenster?". Läuft eine
Sendung, in der noch niemand die Kamera an hat, wäre der Ton
des Videos stumm geblieben -- ohne dass irgendwo ein Knopf
gestanden hätte. */
setInterval(() => {
const knopf = $('ton-an');
if (!knopf) return;
const stumme = document.querySelectorAll('#kameras video[data-fremd="ja"]').length;
knopf.hidden = tonFrei || !stumme || !lage || lage.stand !== 'live';
knopf.hidden = tonFrei || !lage || lage.stand !== 'live';
}, 1200);
/* KEINE LADE MEHR AM HANDY (28.09.2026). Der Chat steht dort
workspace/aufgaben.html
+19 -19
View File
@@ -12,19 +12,19 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -391,22 +391,22 @@
<!-- TEXTFORM ZUERST (21.09.2026): Die Seite fragt beim Zeichnen nach
`window.Textform`. Kaeme sie spaeter, waere der erste Eintrag ohne
Gestaltung. Kein `defer`, damit sie wirklich vorher dasteht. -->
<script src="assets/js/textform.js?v=202609280201"></script>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/hochladen.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/textform.js?v=202609280344"></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/hochladen.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/zuteilung.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/zuteilung.js?v=202609280344" defer></script>
<!-- Der Vorlagenkatalog stand bis zum 23.09.2026 mitten in
aufgaben.js. Er bedient jetzt zwei Seiten und hat deshalb eine
eigene Datei; hier zeigt er den Creator-Katalog.
Vor aufgaben.js, weil die Seite ihn beim Start einrichtet. -->
<script src="assets/js/vorlagenbrett.js?v=202609280201" defer></script>
<script src="assets/js/aufgaben.js?v=202609280201" defer></script>
<script src="assets/js/vorlagenbrett.js?v=202609280344" defer></script>
<script src="assets/js/aufgaben.js?v=202609280344" defer></script>
</body>
</html>
workspace/automation.html
+16 -16
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/automation.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/automation.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -168,15 +168,15 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/automation.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/automation.js?v=202609280344" defer></script>
</body>
</html>
workspace/befinden.html
+17 -17
View File
@@ -7,14 +7,14 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -197,16 +197,16 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/holen.js?v=202609280201" defer></script>
<script src="assets/js/befinden.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/holen.js?v=202609280344" defer></script>
<script src="assets/js/befinden.js?v=202609280344" defer></script>
</body>
</html>
workspace/bereich.html
+22 -22
View File
@@ -12,24 +12,24 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609280344" />
<!-- Wegen des Blocks „Willst du dazugehoeren?" auf dem Brett
„Mitmachen". Eine eigene Kopie der Regel hier waere die zweite
Stelle, an der dieselbe Sache anders aussieht. -->
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -304,19 +304,19 @@
<!-- TEXTFORM ZUERST (21.09.2026): Die Seite fragt beim Zeichnen nach
`window.Textform`. Kaeme sie spaeter, waere der erste Eintrag ohne
Gestaltung. Kein `defer`, damit sie wirklich vorher dasteht. -->
<script src="assets/js/textform.js?v=202609280201"></script>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/textform.js?v=202609280344"></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/checkliste.js?v=202609280201" defer></script>
<script src="assets/js/ampel.js?v=202609280201" defer></script>
<script src="assets/js/schulung.js?v=202609280201" defer></script>
<script src="assets/js/holen.js?v=202609280201" defer></script>
<script src="assets/js/bereich.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/checkliste.js?v=202609280344" defer></script>
<script src="assets/js/ampel.js?v=202609280344" defer></script>
<script src="assets/js/schulung.js?v=202609280344" defer></script>
<script src="assets/js/holen.js?v=202609280344" defer></script>
<script src="assets/js/bereich.js?v=202609280344" defer></script>
</body>
</html>
workspace/bewerben.html
+19 -19
View File
@@ -7,17 +7,17 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- haus.css MUSS die letzte Stilvorlage sein - siehe treff-regeln.html. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -108,15 +108,15 @@
</main>
<!-- Der Fuß gehört zu jeder Seite - siehe pruef-css-klassen. -->
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/auskunft.js?v=202609280201" defer></script>
<script src="assets/js/bewerben.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/auskunft.js?v=202609280344" defer></script>
<script src="assets/js/bewerben.js?v=202609280344" defer></script>
</body>
</html>
workspace/bewerbungen.html
+18 -18
View File
@@ -7,16 +7,16 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- haus.css MUSS die letzte Stilvorlage sein - siehe treff-regeln.html. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -80,16 +80,16 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/auskunft.js?v=202609280201" defer></script>
<script src="assets/js/bewerbungen.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/auskunft.js?v=202609280344" defer></script>
<script src="assets/js/bewerbungen.js?v=202609280344" defer></script>
</body>
</html>
workspace/calls.html
+17 -17
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/calls.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/calls.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -89,15 +89,15 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/ki.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/calls.js?v=202609280201" defer></script>
<script src="assets/js/ki.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/calls.js?v=202609280344" defer></script>
</body>
</html>
workspace/chat.html
+20 -20
View File
@@ -12,26 +12,26 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<!-- aufgaben.css bringt die Dialog- und Formularstile mit (.dialog,
.neu__zeile, .dialog__knoepfe). Sie stehen dort seit dem
Aufgabenbrett; sie hierher zu kopieren hiesse, sie an zwei Stellen
zu pflegen. Dieselbe Lösung nutzen kalender.html und content.html.
Gemeldet von pruef-css-klassen.mjs, bevor jemand einen ungestylten
Dialog zu sehen bekam. -->
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/chat.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/chat.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -739,24 +739,24 @@
</form>
</dialog>
<script src="assets/js/bereiche.js?v=202609280201"></script>
<script src="assets/js/bereiche.js?v=202609280344"></script>
<!-- TEXTFORM VOR ALLEM ANDEREN (21.09.2026): chat.js und bereich.js
fragen beim Zeichnen nach `window.Textform`. Kaeme sie spaeter,
waere die erste gezeichnete Nachricht ohne Gestaltung -- und das
faellt nur dem auf, der genau hinsieht. KEIN `defer`, damit sie
wirklich vor den anderen dasteht. -->
<script src="assets/js/textform.js?v=202609280201"></script>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/hochladen.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201"></script>
<script src="assets/js/glocke.js?v=202609280201"></script>
<script src="assets/js/textform.js?v=202609280344"></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/hochladen.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344"></script>
<script src="assets/js/glocke.js?v=202609280344"></script>
<!-- ANRUF VOR CHAT (18.09.2026): anruf.js stellt `window.anrufStarten`
bereit, und chat.js baut die Knoepfe nur, wenn es das gibt.
Andersherum waere die Reihenfolge eine stille Abhaengigkeit --
die Knoepfe fehlten, und niemand wuesste warum. -->
<script src="assets/js/anruf.js?v=202609280201"></script>
<script src="assets/js/anruf.js?v=202609280344"></script>
<!-- DIE BILDSCHAU (25.09.2026). Eigene Datei, weil sie nichts vom
Chat weiss: Sie bekommt einen Weg und einen Namen und zeigt ein
Bild. Jede andere Seite mit Fotos kann sie ebenso benutzen, ohne
@@ -767,8 +767,8 @@
sie beim ersten Foto noch nicht da -- und der erste Klick ginge
wie frueher in den Tab. Ein Fehler, der nur beim ERSTEN Mal
auftritt, ist der, den man nie nachstellen kann. -->
<script src="assets/js/bildschau.js?v=202609280201"></script>
<script src="assets/js/chat.js?v=202609280201"></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/bildschau.js?v=202609280344"></script>
<script src="assets/js/chat.js?v=202609280344"></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
</body>
</html>
workspace/content.html
+17 -17
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/content.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/content.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -179,15 +179,15 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/checkliste.js?v=202609280201" defer></script>
<script src="assets/js/content.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/checkliste.js?v=202609280344" defer></script>
<script src="assets/js/content.js?v=202609280344" defer></script>
</body>
</html>
workspace/crew-index.html
+6 -6
View File
@@ -36,15 +36,15 @@
<link rel="preload" as="image" href="assets/img/buehne/crew-gate-hoch-580.webp"
type="image/webp" media="(max-width: 899px)" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/crew-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/crew-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/crew-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/crew-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<!-- Diese Wand steht NUR auf der Adresse von Team Dogi (ueberall sonst
404, siehe crewWeiche). Sie darf das Haus deshalb direkt nennen
statt ueber den Platzhalter haus.css zu gehen -- und sie MUSS es:
Eine Zugangswand, die sich erst nach dem Umbiegen faerbt, waere
die eine Seite, auf der man das Umfaerben sieht. -->
<link rel="stylesheet" href="assets/css/crew-haus.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/crew-haus.css?v=202609280344" />
</head>
<body class="gate gate--crew">
@@ -459,7 +459,7 @@
<script src="assets/js/gate.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/gate.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
</body>
</html>
workspace/crew.webmanifest
+4 -4
View File
@@ -23,25 +23,25 @@
},
"icons": [
{
"src": "/assets/img/app-symbole/crew-192.png?v=202609280201",
"src": "/assets/img/app-symbole/crew-192.png?v=202609280344",
"sizes": "192x192",
"type": "image/png",
"purpose": "any"
},
{
"src": "/assets/img/app-symbole/crew-512.png?v=202609280201",
"src": "/assets/img/app-symbole/crew-512.png?v=202609280344",
"sizes": "512x512",
"type": "image/png",
"purpose": "any"
},
{
"src": "/assets/img/app-symbole/crew-192-maskable.png?v=202609280201",
"src": "/assets/img/app-symbole/crew-192-maskable.png?v=202609280344",
"sizes": "192x192",
"type": "image/png",
"purpose": "maskable"
},
{
"src": "/assets/img/app-symbole/crew-512-maskable.png?v=202609280201",
"src": "/assets/img/app-symbole/crew-512-maskable.png?v=202609280344",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
workspace/dateien.html
+17 -17
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/dateien.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/dateien.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -108,15 +108,15 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/hochladen.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/hochladen.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/dateien.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/dateien.js?v=202609280344" defer></script>
</body>
</html>
workspace/entwicklung.html
+18 -18
View File
@@ -7,14 +7,14 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -297,20 +297,20 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/holen.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/holen.js?v=202609280344" defer></script>
<!-- VOR entwicklung.js: Die Seite richtet den Katalog beim Start ein,
also muss es ihn zu dem Zeitpunkt geben. Mit "defer" laufen beide
in Dokumentreihenfolge. -->
<script src="assets/js/vorlagenbrett.js?v=202609280201" defer></script>
<script src="assets/js/entwicklung.js?v=202609280201" defer></script>
<script src="assets/js/vorlagenbrett.js?v=202609280344" defer></script>
<script src="assets/js/entwicklung.js?v=202609280344" defer></script>
</body>
</html>
workspace/hilfe.html
+15 -15
View File
@@ -7,13 +7,13 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/hilfe.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/hilfe.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -146,14 +146,14 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/hilfe.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/hilfe.js?v=202609280344" defer></script>
</body>
</html>
workspace/index.html
+5 -5
View File
@@ -30,9 +30,9 @@
<link rel="preload" as="image" href="assets/img/buehne/gate-hoch-580.webp"
type="image/webp" media="(max-width: 899px)" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
</head>
<body class="gate">
@@ -427,7 +427,7 @@
<script src="assets/js/gate.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/gate.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
</body>
</html>
workspace/kalender.html
+17 -17
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/kalender.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/kalender.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -383,15 +383,15 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/kalender.js?v=202609280201" defer></script>
<script src="assets/js/kalender-abo.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/kalender.js?v=202609280344" defer></script>
<script src="assets/js/kalender-abo.js?v=202609280344" defer></script>
</body>
</html>
workspace/leistung.html
+16 -16
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/leistung.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/leistung.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -444,13 +444,13 @@
</form>
</dialog>
<script src="assets/js/meldung.js?v=202609280201"></script>
<script src="assets/js/nachfrage.js?v=202609280201"></script>
<script src="assets/js/wahl.js?v=202609280201"></script>
<script src="assets/js/bereiche.js?v=202609280201"></script>
<script src="assets/js/kopf.js?v=202609280201"></script>
<script src="assets/js/glocke.js?v=202609280201"></script>
<script src="assets/js/leistung.js?v=202609280201"></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344"></script>
<script src="assets/js/nachfrage.js?v=202609280344"></script>
<script src="assets/js/wahl.js?v=202609280344"></script>
<script src="assets/js/bereiche.js?v=202609280344"></script>
<script src="assets/js/kopf.js?v=202609280344"></script>
<script src="assets/js/glocke.js?v=202609280344"></script>
<script src="assets/js/leistung.js?v=202609280344"></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
</body>
</html>
workspace/material.html
+16 -16
View File
@@ -12,13 +12,13 @@
vergessen wird. -->
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/material.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/material.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start" data-ton="42" data-buehne="studio">
@@ -138,14 +138,14 @@
<p class="m-laedt" id="laedt">Einen Moment …</p>
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/hochladen.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/material.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/hochladen.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/material.js?v=202609280344" defer></script>
</body>
</html>
workspace/notizen.html
+14 -14
View File
@@ -7,13 +7,13 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/notizen.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/notizen.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start" data-ton="46">
@@ -181,12 +181,12 @@
<!-- bereiche.js VOR kopf.js: Dort steht `window.Bereiche`, und kopf.js
liest daraus die Leitungsrollen. -->
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/notizen.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/notizen.js?v=202609280344" defer></script>
</body>
</html>
workspace/personen.html
+16 -16
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/personen.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/personen.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -453,14 +453,14 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/personen.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/personen.js?v=202609280344" defer></script>
</body>
</html>
workspace/profil.html
+18 -18
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -214,16 +214,16 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/hochladen.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/hochladen.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/steckbrief.js?v=202609280201" defer></script>
<script src="assets/js/profil.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/steckbrief.js?v=202609280344" defer></script>
<script src="assets/js/profil.js?v=202609280344" defer></script>
</body>
</html>
workspace/reaktion.html
+162 -50
View File
@@ -7,13 +7,13 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/reaktion.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/reaktion.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start reaktion-seite" data-stand="laedt">
@@ -109,6 +109,7 @@
<span class="countdown__zahl" id="countdown-zahl">–</span>
<span class="countdown__wort" id="countdown-wort">bis zum Start</span>
</div>
<p class="warte__danach" id="warte-naechstes" hidden></p>
<p class="warte__satz">
Der Chat ist schon offen. Schreib schon mal, wer da ist.
</p>
@@ -180,30 +181,116 @@
</section>
<!-- ============ DAS REGIEPULT ===================================
Nur für DogFather. Es liegt UNTEN und nicht oben: Beim Senden
schaut man auf das Bild, nicht auf die Knöpfe -- und was man
nicht ansieht, greift man mit dem Daumen, und der ist unten.
<!-- ============ DIE REGIE =====================================
Nur für DogFather und die rechte Hand.
Es ist bewusst als PULT gebaut und nicht als Formular: Regler
für vier Tonquellen nebeneinander, darüber eine Reihe Schalter,
daneben der große Knopf, der die Sendung startet und beendet.
Wer einmal an einem Mischpult gestanden hat, findet sich hier
ohne Erklärung zurecht. -->
SIE LIEGT UNTEN, weil man beim Senden auf das Bild schaut und
nicht auf die Knöpfe — und was man nicht ansieht, greift man
mit dem Daumen.
SIE IST ZWEIGETEILT, und das ist der wichtigste Teil des
Umbaus: Oben eine Leiste, die IMMER steht — Lampe, Laufzeit,
Zahlen, die drei großen Knöpfe. Darunter die Register mit
allem, was man vorbereitet. Wer mitten in der Sendung
„Beenden" drückt, drückt es, weil etwas passiert ist. Das
darf nicht hinter einer Bewegung liegen.
========================================================== -->
<section class="pult" id="pult" hidden aria-label="Regie">
<button type="button" class="pult__griff" id="pult-griff" aria-expanded="false">
<span class="pult__griff-strich" aria-hidden="true"></span>
<span class="pult__griff-wort">Regie</span>
</button>
<!-- ---- Die Leiste: immer sichtbar ------------------------- -->
<div class="pult__leiste">
<div class="lampe" id="pult-lampe">
<span class="lampe__punkt" aria-hidden="true"></span>
<span class="lampe__wort" id="pult-wort">Geschlossen</span>
</div>
<!-- Die Laufzeit. Sie ist der Grund, warum in Regieräumen
überall Uhren hängen: Ohne sie verschätzt man sich um
Viertelstunden. -->
<div class="laufzeit" id="pult-uhr" hidden>
<span class="laufzeit__zahl" id="pult-zeit">0:00</span>
<span class="laufzeit__wort">Laufzeit</span>
</div>
<dl class="messwerte">
<div class="messwerte__paar">
<dt>Sehen zu</dt><dd id="z-dabei">0</dd>
</div>
<div class="messwerte__paar">
<dt>Mit Bild</dt><dd id="z-sicht">0</dd>
</div>
<div class="messwerte__paar">
<dt>Gäste</dt><dd id="z-gaeste">0</dd>
</div>
<!-- WAS DIE EIGENE LEITUNG TRÄGT. Jede Kamera geht direkt zu
einem Menschen, und jede kostet Upload. Diese Zahl ist
der Unterschied zwischen „es ruckelt bei euch?" und
„ich sehe, dass es zu viel wird". -->
<div class="messwerte__paar">
<dt>Upload</dt><dd id="z-last">–</dd>
</div>
</dl>
<div class="pult__tun">
<button type="button" class="tun tun--vor" id="p-vorbereiten">Vorbereiten</button>
<button type="button" class="tun tun--live" id="p-starten">Auf Sendung</button>
<button type="button" class="tun tun--aus" id="p-beenden">Beenden</button>
</div>
<button type="button" class="pult__klapp" id="pult-griff"
aria-expanded="true" aria-controls="pult-innen"
aria-label="Regie ein- oder ausklappen">
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M6 15l6-6 6 6" /></svg>
</button>
</div>
<!-- ---- Die Register --------------------------------------- -->
<div class="pult__innen" id="pult-innen">
<div class="reiter" id="reiter" role="tablist" aria-label="Regie-Bereiche">
<button type="button" class="reiter__knopf" role="tab" data-tafel="sendung"
id="reiter-sendung" aria-controls="tafel-sendung" aria-selected="true">Sendung</button>
<button type="button" class="reiter__knopf" role="tab" data-tafel="liste"
id="reiter-liste" aria-controls="tafel-liste" aria-selected="false">
Warteschlange <span class="reiter__zahl" id="reiter-liste-zahl">0</span>
</button>
<button type="button" class="reiter__knopf" role="tab" data-tafel="ton"
id="reiter-ton" aria-controls="tafel-ton" aria-selected="false">Ton</button>
<button type="button" class="reiter__knopf" role="tab" data-tafel="gaeste"
id="reiter-gaeste" aria-controls="tafel-gaeste" aria-selected="false">Gäste</button>
<button type="button" class="reiter__knopf" role="tab" data-tafel="bild"
id="reiter-bild" aria-controls="tafel-bild" aria-selected="false">Bild</button>
</div>
<!-- ==== Sendung ======================================== -->
<section class="pult-tafel" data-tafel="sendung" role="tabpanel"
id="tafel-sendung" aria-labelledby="reiter-sendung">
<!-- DIE VIDEOSPUR. Vorher gab es für das laufende Video im
Pult überhaupt keine Bedienung — wer spulen wollte,
musste in das YouTube-Bild fassen, und was dort passiert,
passiert nur bei einem selbst. -->
<div class="spur" id="spur">
<div class="spur__kopf">
<span class="spur__marke" id="spur-marke">Läuft</span>
<strong class="spur__titel" id="spur-titel">Noch kein Video eingetragen</strong>
</div>
<div class="spur__band">
<button type="button" class="spur__knopf" id="v-zurueck" title="10 Sekunden zurück">−10</button>
<button type="button" class="spur__knopf spur__knopf--gross" id="v-spiel" title="Leertaste">
<svg viewBox="0 0 24 24" aria-hidden="true" id="v-spiel-bild"><path d="M8 5h3v14H8zm5 0h3v14h-3z" /></svg>
</button>
<button type="button" class="spur__knopf" id="v-vor" title="10 Sekunden vor">+10</button>
<input type="range" class="spur__schiene" id="v-band" min="0" max="1000" value="0"
step="1" aria-label="Stelle im Video" />
<span class="spur__zeit" id="v-zeit">0:00 / 0:00</span>
<button type="button" class="spur__knopf spur__knopf--weiter" id="v-naechstes"
title="Nächstes Video aus der Warteschlange">Nächstes</button>
</div>
</div>
<!-- Reihe 1: was gesendet wird -->
<div class="pult__block">
<h3 class="pult__ueber">Die Sendung</h3>
<div class="pult__zeile">
<label class="pult__feld">
<span>Titel</span>
<span>Titel der Sendung</span>
<input type="text" id="p-titel" maxlength="120" placeholder="Worum geht es?" />
</label>
<label class="pult__feld">
@@ -222,49 +309,74 @@
</label>
<button type="button" class="knopf-still" id="p-sichern">Übernehmen</button>
</div>
</div>
</section>
<!-- Reihe 2: die Regler -->
<div class="pult__block">
<h3 class="pult__ueber">Ton</h3>
<!-- ==== Warteschlange ================================== -->
<section class="pult-tafel" data-tafel="liste" role="tabpanel" hidden
id="tafel-liste" aria-labelledby="reiter-liste">
<div class="pult__zeile">
<label class="pult__feld">
<span>Video anhängen</span>
<input type="text" id="l-neu" placeholder="YouTube-Adresse einfügen und Enter" />
</label>
<button type="button" class="knopf-still" id="l-anhaengen">Anhängen</button>
</div>
<ol class="warteliste" id="warteliste"></ol>
<p class="pult__klein" id="liste-hinweis">
Räum vorher ein, was ihr schauen wollt. Im Live drückst du
dann nur noch „Nächstes" — eine Adresse mitten in der
Sendung einzutippen ist ein Tippfehler zu viel.
</p>
</section>
<!-- ==== Ton ============================================ -->
<section class="pult-tafel" data-tafel="ton" role="tabpanel" hidden
id="tafel-ton" aria-labelledby="reiter-ton">
<div class="regler-reihe" id="regler"></div>
</div>
<p class="pult__klein" id="ton-hinweis"></p>
</section>
<!-- Reihe 3: Gäste -->
<div class="pult__block">
<h3 class="pult__ueber">Gäste <span class="pult__klein" id="gast-zahl">0 von 2</span></h3>
<!-- ==== Gäste ========================================== -->
<section class="pult-tafel" data-tafel="gaeste" role="tabpanel" hidden
id="tafel-gaeste" aria-labelledby="reiter-gaeste">
<h3 class="pult__ueber">Auf der Bühne <span class="pult__klein" id="gast-zahl">0 von 2</span></h3>
<div class="gast-reihe" id="gast-reihe"></div>
<div class="pult__zeile">
<select id="p-wen" class="pult__wahl" aria-label="Wen holen?"></select>
<button type="button" class="knopf-still" id="p-holen">Dazuholen</button>
</div>
</div>
</section>
<!-- Reihe 4: die Anordnung -->
<div class="pult__block">
<!-- ==== Bild =========================================== -->
<section class="pult-tafel" data-tafel="bild" role="tabpanel" hidden
id="tafel-bild" aria-labelledby="reiter-bild">
<h3 class="pult__ueber">Anordnung</h3>
<div class="layout-reihe" id="layout-reihe"></div>
</div>
<p class="pult__klein">
Die Anordnung gilt für alle — sie ist Teil der Sendung, nicht
deine Ansicht.
</p>
</section>
<!-- Reihe 5: der große Knopf -->
<div class="pult__block pult__block--tun">
<button type="button" class="tun tun--vor" id="p-vorbereiten">Vorbereiten</button>
<button type="button" class="tun tun--live" id="p-starten">Auf Sendung</button>
<button type="button" class="tun tun--aus" id="p-beenden">Beenden</button>
</div>
<!-- EIN KÜRZEL, DAS NIEMAND KENNT, IST KEINS. Deshalb steht es
dort, wo gearbeitet wird, und nicht in einer Hilfe. -->
<p class="kuerzel">
<kbd>Leertaste</kbd> Pause · <kbd>←</kbd><kbd>→</kbd> 10 s ·
<kbd>M</kbd> Mikro · <kbd>N</kbd> Nächstes · <kbd>1</kbd><kbd>2</kbd><kbd>3</kbd> Anordnung
</p>
</div>
</section>
</main>
<!-- bereiche.js VOR kopf.js: Dort steht `window.Bereiche`, und kopf.js
liest daraus die Leitungsrollen. -->
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/reaktion.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/reaktion.js?v=202609280344" defer></script>
</body>
</html>
workspace/rechte.html
+17 -17
View File
@@ -7,14 +7,14 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -134,14 +134,14 @@
Beim ersten Anlauf fehlte die Zeile auf genau diesen beiden neuen
Seiten. Gefunden hat das nicht das Auge, sondern pruef-css-klassen,
die seit dem 07.09. jede Seite danach absucht. -->
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/holen.js?v=202609280201" defer></script>
<script src="assets/js/rechte.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/holen.js?v=202609280344" defer></script>
<script src="assets/js/rechte.js?v=202609280344" defer></script>
</body>
</html>
workspace/report.html
+18 -18
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/report.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/report.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -106,17 +106,17 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/ki.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/holen.js?v=202609280201" defer></script>
<script src="assets/js/report.js?v=202609280201" defer></script>
<script src="assets/js/ki.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/holen.js?v=202609280344" defer></script>
<script src="assets/js/report.js?v=202609280344" defer></script>
</body>
</html>
workspace/scouting.html
+16 -16
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/scouting.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/scouting.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -173,14 +173,14 @@
</div>
</div>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/scouting.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/scouting.js?v=202609280344" defer></script>
</body>
</html>
workspace/start.html
+16 -16
View File
@@ -12,21 +12,21 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<!-- Nur die Startseite: Begrüßungskachel, Uhr, Glockenmulde. Siehe
den Hinweis in start.css -- dort stand es bis zum 07.09.2026. -->
<link rel="stylesheet" href="assets/css/heim.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/heim.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -732,16 +732,16 @@
</p>
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/live.js?v=202609280201" defer></script>
<script src="assets/js/start.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/live.js?v=202609280344" defer></script>
<script src="assets/js/start.js?v=202609280344" defer></script>
</body>
</html>
workspace/startcheck.html
+17 -17
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/startcheck.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/startcheck.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -85,16 +85,16 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/ki.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/startcheck.js?v=202609280201" defer></script>
<script src="assets/js/ki.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/startcheck.js?v=202609280344" defer></script>
</body>
</html>
workspace/steckbrief.html
+18 -18
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -150,16 +150,16 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/hochladen.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/hochladen.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/auskunft.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/steckbrief.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/auskunft.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/steckbrief.js?v=202609280344" defer></script>
</body>
</html>
workspace/support.html
+14 -14
View File
@@ -7,13 +7,13 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/support.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/support.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -128,16 +128,16 @@
(reading 'LEITUNG')" ab -- gemessen am 24.09.2026, als diese
Zeile beim Anlegen der Seite fehlte. Die Kopfleiste kam
trotzdem, deshalb sah man es nur in der Browserkonsole. -->
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<!-- wahl.js gehoert zu kopf.js: Der Sicht-Umschalter in der
Kopfleiste baut daraus seine Liste. pruef-css-klassen setzt das
seit dem 07.09.2026 durch -- damals fehlte es auf chat.html und
uebersicht.html, und heute hier. -->
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/support.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/support.js?v=202609280344" defer></script>
</body>
</html>
workspace/talente.html
+18 -18
View File
@@ -7,18 +7,18 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280344" />
<!-- Wegen des Kastens „Anfragen“ ueber der Liste. Eine eigene Kopie
der Regel hier waere die zweite Stelle, an der dieselbe Sache
anders aussieht. -->
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -111,15 +111,15 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/holen.js?v=202609280201" defer></script>
<script src="assets/js/talente.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/holen.js?v=202609280344" defer></script>
<script src="assets/js/talente.js?v=202609280344" defer></script>
</body>
</html>
workspace/team.html
+16 -16
View File
@@ -7,20 +7,20 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/team.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/team.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -110,15 +110,15 @@
</main>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/holen.js?v=202609280201" defer></script>
<script src="assets/js/team.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/holen.js?v=202609280344" defer></script>
<script src="assets/js/team.js?v=202609280344" defer></script>
</body>
</html>
workspace/teamlage.html
+17 -17
View File
@@ -7,20 +7,20 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/team.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/team.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<!-- `data-buehne` steht hier fest und nicht im Skript: Die Kachel zu
@@ -84,15 +84,15 @@
Kaputt ist dabei nichts -- er funktioniert. Genau deshalb faellt
es niemandem auf, und deshalb prueft pruef-css-klassen die
ABHAENGIGKEIT statt der Optik. Hier hat sie angeschlagen. -->
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/holen.js?v=202609280201" defer></script>
<script src="assets/js/teamlage.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/holen.js?v=202609280344" defer></script>
<script src="assets/js/teamlage.js?v=202609280344" defer></script>
</body>
</html>
workspace/teilen.html
+15 -15
View File
@@ -7,13 +7,13 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -112,15 +112,15 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/teilen.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/teilen.js?v=202609280344" defer></script>
</body>
</html>
workspace/treff-moderation.html
+16 -16
View File
@@ -7,14 +7,14 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -126,14 +126,14 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/treff-moderation.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/treff-moderation.js?v=202609280344" defer></script>
</body>
</html>
workspace/treff-regeln.html
+16 -16
View File
@@ -7,18 +7,18 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- haus.css MUSS die letzte Stilvorlage sein. Auf der Adresse des
Rudels 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -248,14 +248,14 @@
Beim ersten Anlauf fehlte die Zeile auf genau diesen beiden neuen
Seiten. Gefunden hat das nicht das Auge, sondern pruef-css-klassen,
die seit dem 07.09. jede Seite danach absucht. -->
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/auskunft.js?v=202609280201" defer></script>
<script src="assets/js/treff-regeln.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/auskunft.js?v=202609280344" defer></script>
<script src="assets/js/treff-regeln.js?v=202609280344" defer></script>
</body>
</html>
workspace/uebersicht.html
+16 -16
View File
@@ -12,22 +12,22 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<!-- Formular- und Dialogstile: seit dem 07.09.2026 steht hier der
Dialog "Creator anlegen". -->
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/uebersicht.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/uebersicht.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -149,16 +149,16 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/uebersicht.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/uebersicht.js?v=202609280344" defer></script>
</body>
</html>
workspace/unsere-seiten.html
+15 -15
View File
@@ -7,13 +7,13 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/unsere-seiten.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/unsere-seiten.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -335,14 +335,14 @@
</main>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/live.js?v=202609280201" defer></script>
<script src="assets/js/unsere-seiten.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/live.js?v=202609280344" defer></script>
<script src="assets/js/unsere-seiten.js?v=202609280344" defer></script>
</body>
</html>
workspace/unterstuetzen.html
+16 -16
View File
@@ -7,13 +7,13 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/unterstuetzen.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/unterstuetzen.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -106,17 +106,17 @@
<!-- bereiche.js VOR kopf.js: Dort steht `window.Bereiche`, und kopf.js
liest daraus die Leitungsrollen. Ohne sie stürzt jede Seite mit
„Cannot read properties of undefined (reading 'LEITUNG')" ab. -->
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/holen.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/holen.js?v=202609280344" defer></script>
<!-- Die Satz-Tafel. Ohne sie stand auf dieser Seite das Maschinenwort
des Servers (z.B. "nicht_gefunden") statt eines Satzes -- gemeldet
von pruef-meldungen, nicht beim Ansehen. -->
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/unterstuetzen.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/unterstuetzen.js?v=202609280344" defer></script>
</body>
</html>
workspace/werdegang.html
+16 -16
View File
@@ -7,15 +7,15 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/werdegang.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/werdegang.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -144,14 +144,14 @@
</main>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/werdegang.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/werdegang.js?v=202609280344" defer></script>
</body>
</html>
workspace/willkommen.html
+15 -15
View File
@@ -12,13 +12,13 @@
vergessen wird. -->
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/willkommen.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/willkommen.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<!-- KOERPERKLASSE "start", NICHT "gate" (berichtigt 21.09.2026).
`body.gate` ist die Anmeldewand: `display:flex; align-items:center`,
@@ -75,13 +75,13 @@
<p class="fehler" id="fehler" hidden></p>
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/willkommen.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/willkommen.js?v=202609280344" defer></script>
</body>
</html>
workspace/wissen.html
+17 -17
View File
@@ -12,20 +12,20 @@
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=202609280201" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280201" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/wissen.css?v=202609280201" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280201" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609280344" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609280344" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/start.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/wissen.css?v=202609280344" />
<link rel="stylesheet" href="assets/css/module.css?v=202609280344" />
<!-- 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=202609280201" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609280344" />
</head>
<body class="start">
@@ -190,15 +190,15 @@
</main>
<script src="assets/js/meldung.js?v=202609280201" defer></script>
<script src="assets/js/hochladen.js?v=202609280201" defer></script>
<script src="assets/js/nachfrage.js?v=202609280201" defer></script>
<script src="assets/js/meldung.js?v=202609280344" defer></script>
<script src="assets/js/hochladen.js?v=202609280344" defer></script>
<script src="assets/js/nachfrage.js?v=202609280344" defer></script>
<script src="assets/js/wahl.js?v=202609280201" defer></script>
<script src="assets/js/bereiche.js?v=202609280201" defer></script>
<script src="assets/js/installieren.js?v=202609280201" defer></script>
<script src="assets/js/kopf.js?v=202609280201" defer></script>
<script src="assets/js/glocke.js?v=202609280201" defer></script>
<script src="assets/js/wissen.js?v=202609280201" defer></script>
<script src="assets/js/wahl.js?v=202609280344" defer></script>
<script src="assets/js/bereiche.js?v=202609280344" defer></script>
<script src="assets/js/installieren.js?v=202609280344" defer></script>
<script src="assets/js/kopf.js?v=202609280344" defer></script>
<script src="assets/js/glocke.js?v=202609280344" defer></script>
<script src="assets/js/wissen.js?v=202609280344" defer></script>
</body>
</html>