`;
}
/* Sprachumschalter — eigener nav-group-artiger Dropdown, zeigt die
aktuell gewählte Sprache (Flagge + Kürzel) und listet beim Klick die
übrigen 4 Sprachen auf. */
/* Aus den 2-3 Landesfarben einer Sprache ein Aurora-Wolkenbild bauen
(mehrere versetzte, weiche Farbflecken — dieselbe Machart wie beim
Bewerben-Knopf, nur mit den Farben DIESER Sprache) plus eine
Stopp-Liste für den conic-gradient der Kugel. */
function sprachAurora(farben) {
const positionen = ["22% 30%", "72% 28%", "48% 78%"];
return farben
.map((f, i) => `radial-gradient(circle at ${positionen[i % positionen.length]}, ${f}, transparent 60%)`)
.join(", ");
}
function sprachKugelStopps(farben) {
return [...farben, farben[0]].join(", ");
}
function renderSprachSchalter() {
const aktuell = getSprache();
const aktiv = SPRACHEN.find((s) => s.code === aktuell) || SPRACHEN[0];
const styleFuer = (s) =>
`--sprach-glut:${s.glut};--sprach-aurora:${sprachAurora(s.farbstopps)};--sprach-stopps:${sprachKugelStopps(s.farbstopps)};`;
return `
`;
}
/* ===================================================================
Vorschau-Modus für Dogi + VanVan (Zugangsschranke, siehe gate-worker.js)
Solange die Seite noch nicht öffentlich ist, kommen nur Dogi und VanVan
per Zugangscode rein (gate-worker.js setzt dabei ein lesbares Cookie
"dogi_role=dogi"/"vanvan" — NICHT das eigentliche Sicherheits-Cookie,
das bleibt HttpOnly). Damit die beiden die Seite auch "als Abonnent"
bzw. "als Nicht-Abonnent" ansehen können, OHNE ein echtes Abo
abschließen zu müssen, gibt es einen kleinen Umschalter unten links,
der NUR erscheint, wenn das Rollen-Cookie gesetzt ist. Die Wahl landet
in localStorage und wird von renderAboButton() sowie von supporter.js/
supporter.html (Mock-Daten statt echtem API-Aufruf) ausgelesen.
=================================================================== */
const VORSCHAU_SCHLUESSEL = "dogiPreviewMode"; // "abonnent" | "nicht-abonnent" | leer = echter Stand
function getCookieWert(name) {
const treffer = document.cookie.match(new RegExp(`(?:^|;\\s*)${name}=([^;]+)`));
return treffer ? decodeURIComponent(treffer[1]) : null;
}
function getVorschauRolle() {
return getCookieWert("dogi_role"); // "dogi" | "vanvan" | null
}
/* Realistischer Anzeigename fürs Vorschau-Konto — Nutzer-Feedback
03.08.2026: "ich will in der Vorschau alles sehen wie es fertig sein
wird, nix da stehen haben von Vorschau, das bringt mir nix." Statt dem
Wort "Vorschau" irgendwo im Text zeigt die Vorschau jetzt einfach den
Namen der Person, die gerade eingeloggt ist (Dogi oder VanVan) — sieht
dadurch exakt so aus wie ein echtes, fertiges Konto. */
function vorschauAnzeigename() {
const rolle = getVorschauRolle();
return rolle === "vanvan" ? "VanVan" : "Dogi";
}
window.dogiVorschauName = vorschauAnzeigename; // öffentlich, für supporter.html
function getVorschauModus() {
if (!getVorschauRolle()) return null; // Umschalter nur für Dogi/VanVan gültig
const wert = localStorage.getItem(VORSCHAU_SCHLUESSEL);
return wert === "abonnent" || wert === "nicht-abonnent" ? wert : null;
}
function setVorschauModus(modus) {
if (modus) localStorage.setItem(VORSCHAU_SCHLUESSEL, modus);
else localStorage.removeItem(VORSCHAU_SCHLUESSEL);
renderHeader();
renderVorschauSchalter();
document.dispatchEvent(new CustomEvent("dogi-vorschau-geaendert", { detail: { modus } }));
}
window.dogiVorschauModus = getVorschauModus; // öffentlich, für supporter.html/abonnieren.html
/* Aufklappbarer Kreisknopf unten links, spiegelbildlich zum Musik-Knopf
unten rechts (gleiche Bauart, siehe .vorschau-toggle/.vorschau-panel in
main.css) — Nutzer-Feedback 03.08.2026: statt einer dauerhaft offenen
Text-Knopfleiste "so ein Button wie bei VanVan", der sich erst bei
Klick öffnet. Nur EINMAL erzeugt (wie beim Musik-Widget), damit ein
offenes Panel beim nahtlosen Seitenwechsel nicht jedes Mal neu gebaut
wird — nur der Inhalt (aktive Auswahl) wird bei jedem Aufruf aktuell
gehalten. */
function renderVorschauSchalter() {
if (!getVorschauRolle()) return; // öffentliche Besucher sehen nie etwas
let widget = document.getElementById("vorschau-widget");
if (!widget) {
widget = document.createElement("div");
widget.className = "vorschau-widget";
widget.id = "vorschau-widget";
widget.innerHTML = `
🎭 Vorschau
`;
document.body.appendChild(widget);
const panel = document.getElementById("vorschau-panel");
const toggle = document.getElementById("vorschau-toggle");
const oeffnen = (auf) => {
panel.hidden = !auf;
toggle.setAttribute("aria-expanded", String(auf));
widget.classList.toggle("open", auf);
};
toggle.addEventListener("click", () => oeffnen(panel.hidden));
document.getElementById("vorschau-close").addEventListener("click", () => oeffnen(false));
document.addEventListener("keydown", (e) => {
if (e.key === "Escape" && !panel.hidden) oeffnen(false);
});
document.getElementById("vorschau-optionen").addEventListener("click", (e) => {
const btn = e.target.closest("button[data-vorschau]");
if (!btn) return;
setVorschauModus(btn.dataset.vorschau === "echt" ? null : btn.dataset.vorschau);
});
}
const aktuell = getVorschauModus();
const knopf = (wert, label) => {
const aktiv = wert === "echt" ? !aktuell : aktuell === wert;
return ``;
};
document.getElementById("vorschau-optionen").innerHTML =
knopf("echt", "Echter Login-Stand") + knopf("abonnent", "Als Abonnent") + knopf("nicht-abonnent", "Als Nicht-Abonnent");
}
/* Abo-Button in der Hauptnavigation (Dogfather_VanVan_Supporter_Abo.odt,
Abschnitt 3) — Beschriftung/Ziel hängt vom Supporter-Login-Stand ab.
Bewusst KEIN API-Aufruf bei jedem Seitenaufruf (würde jede einzelne
Seite der Website an den Worker koppeln) — stattdessen wird der zuletzt
bekannte Stand aus localStorage gelesen, den supporter.html/
abonnieren.html bei jedem eigenen Laden aktuell hält (siehe dort).
Vorschau-Modus (Dogi/VanVan, siehe oben) überschreibt das für den
Nav-Knopf, unabhängig vom echten Login-Stand.
Nutzer-Feedback 03.08.2026: Ist man eingeloggt UND hat ein Abo, soll im
Knopf nicht der generische Text "Supporter-Bereich" stehen, sondern der
eigene Benutzername (aus /supporter/me → profile.displayName, wird von
abonnieren.html/supporter.html per S.cacheDisplayName() aktuell
gehalten). displayName ist freier Nutzertext -> escapeHtml() ist
Pflicht (sonst XSS über den eigenen Anzeigenamen möglich), und wird auf
eine im Knopf sinnvolle Länge gekürzt. */
function escapeHtml(text) {
return String(text).replace(/[&<>"']/g, (z) => ({ "&": "&", "<": "<", ">": ">", '"': """, "'": "'" }[z]));
}
function kuerzen(text, maxLaenge) {
return text.length > maxLaenge ? text.slice(0, maxLaenge - 1).trimEnd() + "…" : text;
}
function bereichLabel(name) {
const sauber = (name || "").trim();
if (!sauber) return t("nav_cta_abo_bereich");
return `${escapeHtml(kuerzen(sauber, 18))} 👑`;
}
/* Kleines Schimmer-Badge "Bald", solange die eigentliche Registrierung auf
abonnieren.html gesperrt ist (20.08.2026, siehe .btn-gold-locked dort).
Nur auf den drei Zielen, die dort ankommen — NICHT auf supporter.html
(echter, bereits funktionierender Bereich für Dogi/VanVan als Test-
Supporter), sonst würde es fälschlich so wirken, als sei der ganze
Supporter-Bereich gesperrt. Reine Wiederverwendung von .btn-silver-text/
-spark (siehe main.css) in kleinerem Maßstab, kein neuer Mechanismus. */
function soonBadge() {
return `✨${t("nav_cta_abo_soon")}`;
}
function renderAboButton() {
const vorschau = getVorschauModus();
if (vorschau === "abonnent") {
// Ist Dogi/VanVan zufällig wirklich mit einem echten Konto
// eingeloggt (echter Name im Speicher), soll auch in der Vorschau
// DER echte Name stehen. Ohne echtes Konto fällt es auf den Namen
// der eingeloggten Rolle zurück (vorschauAnzeigename() — "Dogi" oder
// "VanVan"), NICHT auf einen erkennbaren "Vorschau"-Platzhalter,
// damit die Vorschau exakt so aussieht wie das fertige Ergebnis
// (Nutzer-Feedback 03.08.2026: "nix da stehen haben von Vorschau,
// das bringt mir nix").
const echterName = localStorage.getItem("supporterDisplayName");
return `${bereichLabel(echterName || vorschauAnzeigename())}`;
}
if (vorschau === "nicht-abonnent") {
return `${t("nav_cta_abo_anonym")}${soonBadge()}`;
}
const token = localStorage.getItem("supporterToken");
if (!token) {
return `${t("nav_cta_abo_anonym")}${soonBadge()}`;
}
/* Nutzer-Wunsch 21.08.2026: "meine seite ändert sich nicht und es gibt
keinen button für registrierte sich normal anzumelden und abzumelden.
wo sie die speziellen sachen sehen als supporter und dass sie auch
schon den abo sehen aber gesperrt ist." Vorher landeten Leute mit
Konto, aber ohne bezahltes Abo (status "none"), im Nav-Knopf wieder
nur bei abonnieren.html -- man merkte dem Knopf also nie an, dass man
überhaupt eingeloggt ist. supporter.html zeigt für genau diesen Fall
schon lange den Bereich "Mein Abo" -> #supp-keine-abo ("Du hast noch
kein aktives Abo" + Knopf) UND den Ausloggen-Knopf (siehe dort,
#btn-logout) -- das musste also nur noch verlinkt werden. Ab jetzt:
JEDER mit gültigem Token (egal ob "none", "active", "pending", ...)
geht auf supporter.html und sieht dort automatisch den passenden
Zustand samt Logout. */
const name = localStorage.getItem("supporterDisplayName");
return `${bereichLabel(name)}`;
}
function renderHeader() {
const el = document.getElementById("site-header");
if (!el) return;
/* Sprungziel vorbereiten.
Das tabindex="-1" ist der entscheidende Teil und wird fast überall
vergessen: Ein Sprung auf ein Element, das von sich aus keinen Fokus
annehmen kann, verschiebt in Chrome und Safari nur die Bildlaufleiste
-- der Tastaturfokus bleibt oben in der Navigation stehen. Der nächste
Tab landet dann wieder im Menü, und der Sprung war wirkungslos.
Mit -1 nimmt den Fokus programmatisch an, taucht aber selbst
NICHT in der Tab-Reihenfolge auf.
Beides nur setzen, wenn nichts dasteht: Falls eine Seite schon eine
eigene id oder ein eigenes tabindex hat, wird das nicht überfahren. */
const inhalt = document.querySelector("main");
if (inhalt) {
if (!inhalt.id) inhalt.id = "inhalt";
if (!inhalt.hasAttribute("tabindex")) inhalt.setAttribute("tabindex", "-1");
}
el.innerHTML = `
${inhalt ? `${t("nav_zum_inhalt")}` : ""}
`;
const toggle = el.querySelector(".nav-toggle");
const links = el.querySelector(".nav-links");
toggle.addEventListener("click", () => {
const open = links.classList.toggle("open");
toggle.setAttribute("aria-expanded", String(open));
});
el.querySelectorAll(".nav-group > button").forEach((btn) => {
btn.addEventListener("click", () => {
const group = btn.parentElement;
const wasOpen = group.classList.contains("open");
el.querySelectorAll(".nav-group.open").forEach((g) => g.classList.remove("open"));
if (!wasOpen) group.classList.add("open");
btn.setAttribute("aria-expanded", String(!wasOpen));
});
});
/* Bugfix 20.08.2026 (Nutzer-Report per Screenshot): ein per Klick
geöffnetes Kategorie-Menü blieb offen stehen, bis irgendwo anders
hingeklickt wurde — verlässt man es einfach nur mit der Maus (ohne
zu klicken), sollte es sich von selbst schließen, genau wie das
reine Hover-Aufklappen (siehe main.css @media (hover:hover)) es
nahelegt. Nur auf echten Maus-Geräten (nicht Touch/Tablet, dort
gibt es kein "Verlassen mit der Maus", nur echte Klicks). */
const hatEchteMaus = window.matchMedia("(hover: hover) and (pointer: fine)").matches;
if (hatEchteMaus) {
el.querySelectorAll(".nav-group").forEach((group) => {
group.addEventListener("mouseleave", () => {
if (!group.classList.contains("open")) return;
group.classList.remove("open");
group.querySelector("button")?.setAttribute("aria-expanded", "false");
});
});
}
el.querySelectorAll(".sprach-schalter [data-sprache]").forEach((link) => {
link.addEventListener("click", (e) => {
e.preventDefault();
setSprache(link.dataset.sprache);
});
});
}
/* Klick außerhalb schließt offene Menüs. Bewusst NUR EINMAL angemeldet —
renderHeader() läuft bei jedem Seitenwechsel erneut, und ein Zuhörer
pro Wechsel würde sich sonst endlos aufsummieren. */
document.addEventListener("click", (e) => {
const kopf = document.getElementById("site-header");
if (kopf && !kopf.contains(e.target)) {
kopf.querySelectorAll(".nav-group.open").forEach((g) => g.classList.remove("open"));
}
});
function renderFooter() {
const el = document.getElementById("site-footer");
if (!el) return;
const year = new Date().getFullYear();
el.innerHTML = `
`;
}
function renderFog() {
if (document.querySelector(".fog-layer")) return;
const layer = document.createElement("div");
layer.className = "fog-layer";
layer.setAttribute("aria-hidden", "true");
const blobs = 6;
let html = "";
for (let i = 0; i < blobs; i++) {
const size = 220 + Math.round(Math.random() * 260);
const top = Math.round(Math.random() * 100);
const left = Math.round(Math.random() * 100);
const delay = (Math.random() * 10).toFixed(1);
html += ``;
}
layer.innerHTML = html;
document.body.prepend(layer);
}
/* ===================================================================
Musik-Knopf (unten rechts, auf jeder Seite)
Kleiner schwebender Knopf, der ein Feld mit den Spotify-Playern von
Hasidog und Van-Van aufklappt. Genauso gelöst wie im Analyse-Tool.
Zwei bewusste Entscheidungen:
1. Das Feld hängt direkt am , nicht in einem Abschnitt — so
kann kein Neuaufbau der Seite den laufenden Player unterbrechen.
2. Die Player werden ERST beim ersten Öffnen geladen (src wird dann
gesetzt). Sonst würde jede Seite zwei fremde Einbettungen laden,
auch wenn niemand Musik hören will.
=================================================================== */
const SPOTIFY_ARTISTS = [
{ name: "Hasidog", id: "2INiE1VVJGUQdEURsltuJU" },
{ name: "Van-Van", id: "4J9PcKZBkh6V8dVY3CGliw" },
];
function renderMusicWidget() {
if (document.getElementById("music-widget")) return;
const widget = document.createElement("div");
widget.className = "music-widget";
widget.id = "music-widget";
widget.innerHTML = `
${t("music_title")}
${t("music_intro")}
${SPOTIFY_ARTISTS.map(
(a) => `
${a.name}
`
).join("")}
`;
document.body.appendChild(widget);
const panel = document.getElementById("music-panel");
const toggle = document.getElementById("music-toggle");
let geladen = false;
function oeffnen(auf) {
panel.hidden = !auf;
toggle.setAttribute("aria-expanded", String(auf));
widget.classList.toggle("open", auf);
if (auf && !geladen) {
// Player erst jetzt wirklich laden
panel.querySelectorAll("iframe[data-src]").forEach((f) => {
f.src = f.dataset.src;
f.removeAttribute("data-src");
});
geladen = true;
}
}
toggle.addEventListener("click", () => oeffnen(panel.hidden));
document.getElementById("music-close").addEventListener("click", () => oeffnen(false));
document.addEventListener("keydown", (e) => {
if (e.key === "Escape" && !panel.hidden) oeffnen(false);
});
}
/* Das Musik-Widget wird nur EINMAL erzeugt (damit der laufende Player
beim Seitenwechsel nicht abreißt) — bei Sprachwechsel deshalb nicht
neu rendern, sondern nur die Texte/Attribute darin austauschen. */
function applyMusicWidgetSprache() {
const titel = document.getElementById("music-title-text");
if (titel) titel.textContent = t("music_title");
const schliessen = document.getElementById("music-close");
if (schliessen) schliessen.setAttribute("aria-label", t("music_close_aria"));
const intro = document.getElementById("music-intro-text");
if (intro) intro.textContent = t("music_intro");
const toggle = document.getElementById("music-toggle");
if (toggle) toggle.setAttribute("title", t("music_toggle_title"));
document.querySelectorAll("#music-widget iframe[data-artist]").forEach((f) => {
f.setAttribute("title", `${f.dataset.artist} ${t("music_spotify_suffix")}`);
});
}
/* ===================================================================
Musik-Knopf: Chamäleon-Farben
Der Knopf soll nicht nur zwischen 3 festen Weltfarben wechseln,
sondern sich an das tatsächliche Bild JEDER einzelnen Seite anpassen
— Durchschnittsfarbe plus die kräftigste (sattste) Farbe darin, als
kleiner Verlauf. Bildquelle in Prioritätsreihenfolge:
1. Das scharfe Banner-Bild im Kopfbereich (.hero-banner img)
2. Das Artwork der Startseite (.hero-artwork, CSS-Hintergrund)
3. Das Ambiente-Hintergrundbild der Seite (--page-bg am )
Gibt es nichts davon (reine Text-Hero-Seiten wie Links oder Videos),
fällt der Knopf sauber auf die normale Weltfarbe zurück (siehe CSS:
var(--music-c1, var(--accent))).
Bilder sind alle selbst gehostet (gleiche Domain) — Canvas-Auslesen
funktioniert dadurch ohne CORS-Probleme.
=================================================================== */
function bildquelleErmitteln() {
const banner = document.querySelector(".hero-banner img");
if (banner && banner.getAttribute("src")) return banner;
/* Startseite seit 27.08.2026: Das Trio-Artwork ist ein echtes
(vorher ein CSS-Hintergrund im ::before, siehe main.css). Ohne diese
Zeile fände die Farbsuche dort nichts mehr und der Musik-Knopf fiele
ausgerechnet auf der Startseite auf die Ersatzfarbe zurück. */
const artworkBild = document.querySelector(".hero-artwork img");
if (artworkBild && artworkBild.getAttribute("src")) return artworkBild;
const artwork = document.querySelector(".hero-artwork");
if (artwork) {
const hintergrund = getComputedStyle(artwork, "::before").backgroundImage;
const ersteEbene = hintergrund && hintergrund.split(",")[0];
const treffer = ersteEbene && ersteEbene.match(/url\(["']?(.*?)["']?\)/);
if (treffer && treffer[1]) return treffer[1];
}
const seitenBg = getComputedStyle(document.body).getPropertyValue("--page-bg");
const treffer2 = seitenBg && seitenBg.match(/url\(["']?(.*?)["']?\)/);
if (treffer2 && treffer2[1]) return treffer2[1];
return null;
}
function rgbNachHsl(r, g, b) {
r /= 255; g /= 255; b /= 255;
const max = Math.max(r, g, b), min = Math.min(r, g, b);
let h = 0, s = 0;
const l = (max + min) / 2;
if (max !== min) {
const d = max - min;
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
switch (max) {
case r: h = (g - b) / d + (g < b ? 6 : 0); break;
case g: h = (b - r) / d + 2; break;
default: h = (r - g) / d + 4;
}
h *= 60;
}
return [h, s * 100, l * 100];
}
const begrenzen = (wert, min, max) => Math.min(max, Math.max(min, wert));
let musikFarbLauf = 0;
function musikKnopfFarbenAnpassen() {
const knopf = document.getElementById("music-toggle");
if (!knopf) return;
const lauf = ++musikFarbLauf;
const zuruecksetzen = () => {
knopf.style.removeProperty("--music-c1");
knopf.style.removeProperty("--music-c2");
};
const quelle = bildquelleErmitteln();
if (!quelle) {
zuruecksetzen();
return;
}
const verarbeiten = (bild) => {
if (lauf !== musikFarbLauf) return; // zwischenzeitlich schon weitergeklickt
try {
const groesse = 28;
const canvas = document.createElement("canvas");
canvas.width = groesse;
canvas.height = groesse;
const ctx = canvas.getContext("2d");
ctx.drawImage(bild, 0, 0, groesse, groesse);
const daten = ctx.getImageData(0, 0, groesse, groesse).data;
let rSumme = 0, gSumme = 0, bSumme = 0, n = 0;
let besteSaettigung = -1, satR = 0, satG = 0, satB = 0;
for (let i = 0; i < daten.length; i += 4) {
const r = daten[i], g = daten[i + 1], b = daten[i + 2];
rSumme += r; gSumme += g; bSumme += b; n++;
const hsl = rgbNachHsl(r, g, b);
if (hsl[2] > 15 && hsl[2] < 88 && hsl[1] > besteSaettigung) {
besteSaettigung = hsl[1]; satR = r; satG = g; satB = b;
}
}
const r = Math.round(rSumme / n), g = Math.round(gSumme / n), b = Math.round(bSumme / n);
const [h1, s1, l1] = rgbNachHsl(r, g, b);
const farbe1 = `hsl(${Math.round(h1)}deg ${Math.round(begrenzen(s1, 42, 92))}% ${Math.round(begrenzen(l1, 40, 62))}%)`;
let farbe2;
if (besteSaettigung > 18) {
const [h2, s2, l2] = rgbNachHsl(satR, satG, satB);
farbe2 = `hsl(${Math.round(h2)}deg ${Math.round(begrenzen(s2, 50, 95))}% ${Math.round(begrenzen(l2, 42, 66))}%)`;
} else {
farbe2 = `hsl(${Math.round((h1 + 45) % 360)}deg ${Math.round(begrenzen(s1, 45, 90))}% ${Math.round(begrenzen(l1 + 8, 42, 68))}%)`;
}
knopf.style.setProperty("--music-c1", farbe1);
knopf.style.setProperty("--music-c2", farbe2);
} catch {
zuruecksetzen(); // z.B. wenn das Bild aus irgendeinem Grund nicht lesbar ist
}
};
if (typeof quelle === "string") {
const bild = new Image();
bild.addEventListener("load", () => verarbeiten(bild));
bild.addEventListener("error", zuruecksetzen);
bild.src = quelle;
} else if (quelle.complete && quelle.naturalWidth > 0) {
verarbeiten(quelle);
} else {
quelle.addEventListener("load", () => verarbeiten(quelle), { once: true });
quelle.addEventListener("error", zuruecksetzen, { once: true });
}
}
/* ===================================================================
Nahtloser Seitenwechsel — damit die Musik nicht abreißt
Normalerweise lädt der Browser bei jedem Klick die ganze Seite neu,
wodurch der Spotify-Player jedes Mal von vorn startet. Stattdessen
holen wir die Zielseite im Hintergrund und tauschen nur den
Inhaltsbereich aus. Kopfzeile, Fußzeile und der Musik-Knopf
bleiben stehen — die Musik läuft einfach weiter.
Die Liste unten kann bei Bedarf wieder Seiten aufnehmen, die bewusst
NICHT nahtlos geladen werden sollen (z.B. künftige interne Bereiche
mit eigenem Login) — aktuell gibt es keine solche Seite mehr.
Absicherung: Geht beim Holen irgendetwas schief, wird ganz normal
zur Zielseite navigiert. Schlimmstenfalls ist es also wie vorher.
=================================================================== */
const KEIN_NAHTLOSER_WECHSEL = [];
/* Seiteneigene Skripte melden sich fast alle über "DOMContentLoaded" an.
Nach dem ersten Laden ist dieses Ereignis längst vorbei — ein später
nachgeladenes Skript würde also nie starten. Deshalb: Anmeldungen, die
NACH dem Laden eintreffen, sofort ausführen. Während des normalen
Erstaufbaus (readyState === "loading") bleibt alles wie gehabt. */
const anmeldenOriginal = document.addEventListener.bind(document);
document.addEventListener = function (typ, fn, optionen) {
if (typ === "DOMContentLoaded" && document.readyState !== "loading" && typeof fn === "function") {
setTimeout(() => fn(new Event("DOMContentLoaded")), 0);
return;
}
return anmeldenOriginal(typ, fn, optionen);
};
/** Skripte der neuen Seite der Reihe nach ausführen. */
async function skripteUebernehmen(neuesDokument) {
const schonGeladen = new Set(
[...document.querySelectorAll("script[src]")].map((s) => s.getAttribute("src"))
);
for (const alt of [...neuesDokument.querySelectorAll("script")]) {
const src = alt.getAttribute("src");
if (src) {
// i18n-*.js-Dateien setzen nur window.I18N_PAGE neu (kein Zustand,
// keine Event-Listener) — die MÜSSEN bei jedem Besuch der Seite
// erneut laufen, sonst bleibt window.I18N_PAGE nach einem
// Zwischenstopp auf einer anderen Seite (die es zurückgesetzt hat)
// fälschlich leer, wenn man z.B. zur Startseite zurückkehrt.
//
// BUGFIX 21.08.2026 (Nutzer-Report: rohe Übersetzungs-Schlüssel wie
// "ts_profil_ansehen" sichtbar, aber NUR nachdem man auf einen Link
// geklickt und dann "Zurück" gedrückt hat): das Muster endete bisher
// auf ".js$" (striktes String-Ende). Seit die Cache-Busting-Version
// ("?v=20260821...") an JEDE Skript-URL angehängt wird, endet der
// echte src-Wert aber nie mehr auf ".js", sondern auf ".js?v=...".
// Der Test schlug dadurch für JEDE i18n-Datei fehl -> istSprachDatei
// war immer false -> die i18n-Datei wurde wie eine normale, schon
// geladene Datei übersprungen und NIE erneut ausgeführt, sobald man
// per Klick auf eine andere Seite und wieder zurück navigiert ist.
// window.I18N_PAGE blieb dadurch dauerhaft auf null (von der
// Zwischenseite zurückgesetzt) stehen -- jede Übersetzung fiel auf
// den rohen Schlüsselnamen zurück. Fix: ".js" darf jetzt auch von
// einem "?..." gefolgt werden, nicht nur vom exakten String-Ende.
const istSprachDatei = /\/i18n-[^/]+\.js(\?.*)?$/.test(src);
// Schon vorhanden (z.B. main.js oder eine bereits geladene Datendatei):
// nicht erneut ausführen — sonst gäbe es doppelte Deklarationen.
if (schonGeladen.has(src) && !istSprachDatei) continue;
schonGeladen.add(src);
await new Promise((fertig) => {
const neu = document.createElement("script");
neu.src = src; // bei i18n-Dateien bewusst dieselbe URL — der Browser
// bedient das aus dem HTTP-Cache, das
