Nutzer-Wunsch 20.08.2026: "wuensch mir nur noch bissl farbe und sehr wichtig ist dass ich auch spezielle live events da auch eintragen kann in der verwaltungsseite so dass da eine zweite uhr erscheint wo die zeit dann fuer dieses spezielle event laeuft." - Neue Verwaltungs-Sektion "Spezielles Live-Event": Titel (Deutsch, wird automatisch uebersetzt), echtes Datum+Uhrzeit, optionaler Link, Aktiv- Schalter -- nur mit Titel + Zukunftsdatum aktivierbar. - Zweite Uhr auf streamplan.html (Magenta/Violett statt Cyan/Gold, direkt neben der bestehenden), nur sichtbar wenn ein Event aktiviert ist und das Zieldatum noch nicht vorbei ist. Echter Countdown inkl. Tage (z.B. "2T 03:14:59"), "Jetzt"-Zeiger zeigt wie bei Uhr 1 die tatsaechliche Uhrzeit, der magentafarbene Fixpunkt markiert die Tageszeit des Events. Zieldatum wird als UTC gespeichert -- jede besuchende Person sieht den exakt richtigen Countdown in ihrer eigenen Zeitzone. - "Bissl Farbe": bunter Farbverlauf (Cyan/Violett/Gold) auf dem aeusseren Ring statt reinem Grauton, kraeftigerer Sweep-Farbschein. - Backend: neue routes/special-event.js (getSpecialEventPublic nur bei aktiv+zukuenftig, getSpecialEventAdmin fuer Entwuerfe, saveSpecialEvent mit Validierung), 13 automatisierte Tests gegen eine Fake-DB bestanden. - Bugfix unterwegs gefunden (Playwright-Screenshot, wiederholtes Muster auf dieser Seite): .stream-radar-wrap blieb trotz [hidden]-Attribut sichtbar (display:block ueberschreibt die eingebaute [hidden]-Regel bei gleicher Spezifitaet) -- explizite Regel ergaenzt, per Playwright erneut verifiziert (display:none bestaetigt). Backend-Teil (server-internal/) noch ohne Deploy-Zugriff -- Dogi muss ihn manuell auf dogiintern ausrollen, sonst bleibt die zweite Uhr unsichtbar. Co-Authored-By: Claude Opus 5 <[email protected]>
134 lines
8.0 KiB
HTML
134 lines
8.0 KiB
HTML
<!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 & 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 & 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 & 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=20260820j" />
|
|
<link rel="stylesheet" href="assets/css/theme-dogfather.css?v=20260820j" />
|
|
<link rel="stylesheet" href="assets/css/theme-hasidog.css?v=20260820j" />
|
|
<link rel="stylesheet" href="assets/css/theme-spicymedia.css?v=20260820j" />
|
|
</head>
|
|
<body class="mit-hintergrund" style="--page-bg:url('/assets/img/bg-streamplan.jpg?v=20260820j');--page-bg-mobile:url('/assets/img/bg-streamplan-mobile.jpg?v=20260820j');">
|
|
<div id="site-header"></div>
|
|
|
|
<main>
|
|
<section class="hero page-bg">
|
|
<div class="hero-banner"><img src="/assets/img/bg-streamplan.jpg?v=20260820j" alt="" loading="eager" /></div>
|
|
<div class="container">
|
|
<span class="eyebrow" data-i18n="sp_eyebrow">Welt 1 — DogFather</span>
|
|
<h1 data-i18n="sp_h1">Streamplan & 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=20260820j"></script>
|
|
<script src="assets/js/main.js?v=20260820j"></script>
|
|
<script src="assets/js/streamplan.js?v=20260820j"></script>
|
|
</body>
|
|
</html>
|