DogFatherGit/dogfather-universe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
57966e24d07e2ee9f31c2a8c697ec3d9c43e1710
dogfather-universe/streamplan.html
T
DogFatherGitandClaude Sonnet 5 57966e24d0 Automatischer öffentlicher Start um 21 Uhr + Countdown auf der Zugangsseite 
Nutzer-Wunsch 21.08.2026: "ich will dass du auch ein countdown zu der
seite hinzufügst wo wir den zugangscode eingeben müssen. den um 21h heute
abend geht die seite live. kannst du das sogar so anpassen dass es
automatisch läuft?"

server/gate.js:
- Neue Einstellung SITE_PUBLIC_LAUNCH_AT (ISO-Zeitstempel mit Zeitzone).
  Ab diesem Moment lässt gateMiddleware ausnahmslos jeden durch -- ganz
  ohne Neustart oder manuellen Eingriff, weil jede Anfrage die aktuelle
  Serverzeit live neu prüft. Die Freischaltung "passiert" also von selbst
  in der Sekunde, in der die Uhrzeit erreicht wird. Vorher bleiben die
  Zugangscodes unverändert nötig, damit das Team schon vorher rein kann.
  Fail-safe statt fail-open geprüft: ein kaputter/unparsbarer Zeitwert
  (z.B. Tippfehler in der .env) lässt die Schranke aktiv, statt die Seite
  versehentlich für alle zu öffnen.
- Neuer öffentlicher Endpunkt GET /gate-launch-info (immer erreichbar,
  auch ohne gültige Sitzung) liefert launchAt/isLive/serverTime für die
  Countdown-Anzeige im Frontend.

gate.html:
- Neue Countdown-Box zwischen Titel-Karte und den Zugangscode-Kacheln
  (bleibt unsichtbar, solange kein Starttermin konfiguriert ist). Rechnet
  auf der SERVERZEIT statt der eigenen Uhr (einmaliger Zeit-Abgleich beim
  Laden), damit eine falsch gehende Besucher-Uhr weder zu früh noch zu
  spät zählt. Bei Erreichen von Null folgt ein letzter Abgleich mit dem
  Server, bevor automatisch zur Zielseite weitergeleitet wird -- kein
  Klick, kein Neuladen nötig.
- Zugangscode-Kacheln (Dogi/VanVan/Diene) bleiben während des Countdowns
  unverändert nutzbar.

Getestet: 18 Middleware-Tests (inkl. Fail-safe bei kaputtem Zeitwert,
weiterhin funktionierender Zugangscode vor dem Start) + 10 Playwright-
Tests der Countdown-Oberfläche (Anzeige, Format, automatischer Sprung bei
Ablauf, sofortige Weiterleitung falls schon live, stiller Fallback bei
Netzwerkfehler). Zusätzlich alle 32 echten Seiten auf PC-Installierbarkeit
geprüft (Manifest, Icons, Service Worker, Install-Knopf, echter
Install-Klick-Ablauf simuliert) -- keine Probleme gefunden.

Cache-Busting-Version auf 20260821s erhöht.

Co-Authored-By: Claude Sonnet 5 <[email protected]>
2026-08-21 19:25:12 +02:00

134 lines
8.0 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html lang="de" data-theme="dogfather">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Streamplan &amp; Livebereich — DOGFATHER UNIVERSE</title>
<meta name="description" content="Wann geht DogFather live? Streamplan und Livebereich." />
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
<link rel="manifest" href="/manifest.json" />
<meta name="theme-color" content="#0b0d10" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
<meta property="og:title" content="Streamplan &amp; Livebereich — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Wann geht DogFather live? Streamplan und Livebereich." />
<meta property="og:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://dogfather-universe.com/streamplan.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Streamplan &amp; Livebereich — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Wann geht DogFather live? Streamplan und Livebereich." />
<meta name="twitter:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
<link rel="stylesheet" href="assets/css/main.css?v=20260821s" />
<link rel="stylesheet" href="assets/css/theme-dogfather.css?v=20260821s" />
<link rel="stylesheet" href="assets/css/theme-hasidog.css?v=20260821s" />
<link rel="stylesheet" href="assets/css/theme-spicymedia.css?v=20260821s" />
</head>
<body class="mit-hintergrund" style="--page-bg:url('/assets/img/bg-streamplan.jpg?v=20260821s');--page-bg-mobile:url('/assets/img/bg-streamplan-mobile.jpg?v=20260821s');">
<div id="site-header"></div>
<main>
<section class="hero page-bg">
<div class="hero-banner"><img src="/assets/img/bg-streamplan.jpg?v=20260821s" alt="" loading="eager" /></div>
<div class="container">
<span class="eyebrow" data-i18n="sp_eyebrow">Welt 1 — DogFather</span>
<h1 data-i18n="sp_h1">Streamplan &amp; Livebereich</h1>
<p class="lead worlds" data-i18n="sp_lead">Wann ist DogFather live?</p>
<!-- Live-Radar (20.08.2026, Nutzer-Wunsch "geiler und spezieller"): 24h-Ziffernblatt
mit festem 20-Uhr-Leuchtpunkt + echtem "Jetzt"-Zeiger, schaltet live auf Rot/Puls
um, sonst zählt es zum nächsten 20-Uhr-Termin runter. Zweite Uhr (rechts, Magenta/
Violett) für ein optionales "spezielles Live-Event" aus der Verwaltung -- nur
sichtbar, wenn dort eins aktiviert ist. Siehe assets/js/streamplan.js. -->
<div class="stream-radar-reihe">
<div class="stream-radar-wrap">
<div class="stream-radar" id="stream-radar">
<div class="stream-radar-sweep" aria-hidden="true"></div>
<svg viewBox="0 0 300 300" class="stream-radar-dial" aria-hidden="true">
<defs>
<linearGradient id="radarGradTaeglich" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#8fd9ea"></stop>
<stop offset="50%" stop-color="#8b5cf6"></stop>
<stop offset="100%" stop-color="#e8c465"></stop>
</linearGradient>
</defs>
<circle cx="150" cy="150" r="130" class="radar-ring-outer" stroke="url(#radarGradTaeglich)"></circle>
<circle cx="150" cy="150" r="94" class="radar-ring-inner"></circle>
<g id="radar-ticks"></g>
<g id="radar-fixmarker"></g>
<line id="radar-now-hand" class="radar-now-hand" x1="150" y1="150" x2="150" y2="50"></line>
<circle id="radar-now-dot" class="radar-now-dot" cx="150" cy="50" r="5"></circle>
<circle cx="150" cy="150" r="4" class="radar-center-dot"></circle>
</svg>
<div class="stream-radar-center">
<span class="stream-radar-dot" id="radar-status-dot"></span>
<span class="stream-radar-status" id="radar-status-text" data-i18n="sp_radar_loading">Lädt …</span>
<span class="stream-radar-countdown" id="radar-countdown"></span>
<span class="stream-radar-sub" id="radar-status-sub"></span>
</div>
</div>
<a class="btn btn-primary stream-radar-watch-btn" id="radar-watch-btn" href="https://www.tiktok.com/@dogfather0804" target="_blank" rel="noopener" hidden data-i18n="sp_radar_watch_btn">🔴 Jetzt anschauen</a>
<p class="small muted stream-radar-hinweis" data-i18n="sp_radar_hinweis">Alle Zeiten in deiner Ortszeit.</p>
</div>
<div class="stream-radar-wrap" id="se-radar-wrap" hidden>
<div class="stream-radar event-spezial" id="se-radar">
<div class="stream-radar-sweep" aria-hidden="true"></div>
<svg viewBox="0 0 300 300" class="stream-radar-dial" aria-hidden="true">
<defs>
<linearGradient id="radarGradSpezial" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#ff5cb8"></stop>
<stop offset="50%" stop-color="#c9a6ff"></stop>
<stop offset="100%" stop-color="#e8c465"></stop>
</linearGradient>
</defs>
<circle cx="150" cy="150" r="130" class="radar-ring-outer" stroke="url(#radarGradSpezial)"></circle>
<circle cx="150" cy="150" r="94" class="radar-ring-inner"></circle>
<g id="se-radar-ticks"></g>
<g id="se-radar-fixmarker"></g>
<line id="se-radar-now-hand" class="radar-now-hand" x1="150" y1="150" x2="150" y2="50"></line>
<circle id="se-radar-now-dot" class="radar-now-dot" cx="150" cy="50" r="5"></circle>
<circle cx="150" cy="150" r="4" class="radar-center-dot"></circle>
</svg>
<div class="stream-radar-center">
<span class="stream-radar-titel" id="se-radar-titel"></span>
<span class="stream-radar-countdown" id="se-radar-countdown"></span>
<span class="stream-radar-sub" data-i18n="sp_radar_hinweis_spezial">Spezielles Live-Event</span>
</div>
</div>
<a class="btn btn-primary stream-radar-watch-btn" id="se-radar-link" href="#" target="_blank" rel="noopener" hidden data-i18n="sp_radar_mehr_erfahren">Mehr erfahren →</a>
</div>
</div>
<div class="btn-row" style="justify-content:center;">
<a class="btn-tiktok" href="https://www.tiktok.com/@dogfather0804" target="_blank" rel="noopener"><span class="btn-tiktok-note" aria-hidden="true">♪</span><span class="btn-tiktok-text" data-i18n="sp_btn_tiktok">Zur Dogi TikTok-Seite</span></a>
</div>
</div>
</section>
<section class="section-tight">
<div class="container">
<div class="grid grid-2" style="align-items:center;">
<div class="card">
<span class="tag" data-i18n="sp_card1_tag">Fixer Termin</span>
<h3 data-i18n="sp_card1_h3">🌙 Jeden Tag ab 20 Uhr</h3>
<p data-i18n="sp_card1_p">DogFather geht <strong>jeden Tag</strong> live — verlässlich ab <strong>20:00 Uhr</strong>. Das ist der feste Abend-Stream, auf den man sich einstellen kann.</p>
</div>
<div class="card">
<span class="tag" data-i18n="sp_card2_tag">Bonus</span>
<h3 data-i18n="sp_card2_h3">☀️ Extra-Streams tagsüber</h3>
<p data-i18n="sp_card2_p">Oft geht's auch schon tagsüber live — die Uhrzeit dafür variiert von Tag zu Tag. Am besten TikTok-Benachrichtigungen für @dogfather0804 aktivieren, um keinen Stream zu verpassen.</p>
</div>
</div>
<!-- TODO: Streamformate, wiederkehrende Segmente und Running Gags (Masterplan Block D) hier noch ergänzen, sobald geklärt. -->
</div>
</section>
</main>
<div id="site-footer"></div>
<script src="assets/js/i18n-streamplan.js?v=20260821s"></script>
<script src="assets/js/main.js?v=20260821s"></script>
<script src="assets/js/streamplan.js?v=20260821s"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink