⚽ FCZ Matchday Dashboard

Live-Dashboard für den FC Zürich — nächstes Spiel mit Countdown, Form, Resultate und Super-League-Tabelle.

→ noahzuerii.github.io/fcz-stats ←

---

✨ Features

🗓️ Nächstes Spiel	Heim/Auswärts-Matchup mit Ort und Anstosszeit
⏱️ Live-Countdown	Tage / Std / Min / Sek bis zum Anpfiff, läuft im Browser
📅 Spielplan	Die nächsten anstehenden FCZ-Ligaspiele auf einen Blick
📈 Form	Letzte Spiele als S/U/N-Badges inkl. Punkteausbeute und Trend-Grafik
📉 Punkte-Schnitt-Trend	Punkte pro Spiel, kumuliert über die ganze Saison, als Linien-Grafik
📊 Saison-Statistik	Tabellenplatz, Punkteschnitt, Siegquote, Tordifferenz, Tore & Gegentore pro Spiel
📐 Tabellenverlauf	FCZ-Tabellenplatz nach jedem Spieltag als Linien-Grafik
🔥 Nächstes Derby	Erkennt automatisch das nächste Zürcher Derby (FCZ vs. GC) mit Datum & Countdown-Tagen
▶️ Highlights	Pro Resultat ein YouTube-Highlights-Link (echtes Video wenn verfügbar, sonst Suche)
🧩 Aufstellung	Formation + Spieler des letzten Spiels nach Mannschaftsteilen (sofern API-Daten vorhanden)
📋 Resultate	Liste der jüngsten Spiele mit Endstand
🏆 Tabelle	Aktuelle Super-League-Tabelle, FCZ-Zeile hervorgehoben
🏆 Schweizer Cup	FCZ-Cup-Spiele dieser Saison (Resultate & nächste Partie), neben der Liga
🛡️ Wappen	FCZ-Badge wird live aus der API geladen
🔄 Auto-Refresh	Lädt die Daten automatisch alle 5 Minuten neu, pausiert im Hintergrund-Tab
📲 PWA	Installierbar als App (Manifest + Service Worker), App-Shell funktioniert offline

Statische Seite ohne Backend, ohne Build, ohne Framework — index.html plus ein kleines Manifest/Service-Worker-Duo für die Installierbarkeit.

🛠️ Tech

• Vanilla HTML/CSS/JS, kein Build, kein Framework
• Zwei kostenlose APIs, beide direkt im Browser (kein Backend, kein Key-Geheimnis):
  • Tabelle: Wikipedia (de) — komplette und korrekte 12er-Tabelle, ohne Key, CORS-fähig via origin=*
  • Nächstes Spiel / Resultate / Schweizer Cup: TheSportsDB (öffentlicher Test-Key 123)
• PWA: manifest.json + sw.js (Service Worker) + icon.svg machen die Seite installierbar
• Font: Inter (Google Fonts)
• Respektiert prefers-reduced-motion; robuste Empty-States statt Crashes

⚙️ Wie es funktioniert

1. Beim Laden sucht das Script per searchteams.php automatisch nach „FC Zurich" und merkt sich idTeam — keine IDs sind hardcoded.
2. Mit der Team-ID: eventsnext.php (nächstes Spiel) und eventslast.php (letzte Spiele) von TheSportsDB.
3. Die Tabelle kommt aus dem Wikipedia-Artikel „Super League JJJJ/JJ (Schweiz)" (action=parse, origin=* für CORS). Das Script parst die {{Fußballtabelle/Zeile|…}}-Vorlagen und nimmt die finale/aktuelle 12er-Gesamttabelle. Saison-Jahr wird automatisch aus dem Datum berechnet. Schlägt das fehl, gibt's einen Fallback auf die (gedeckelte) TheSportsDB-Tabelle.
4. Der Countdown läuft client-seitig per setInterval auf Basis des Match-Timestamps.
5. Der Schweizer Cup kommt über einen einzelnen eventsseason.php-Request (Liga-ID 5489) für die ganze Saison auf einmal; gefiltert wird über die Team-ID statt über den Namen, da ein Namensabgleich auch gleichnamige Amateurvereine wie „Zürich City" träfe.
6. Ein setInterval lädt alle 5 Minuten automatisch neu (Auto-Refresh), pausiert dabei aber im Hintergrund-Tab und überspringt den Lauf, solange ein vorheriger Refresh noch läuft.
7. manifest.json + sw.js machen die Seite als PWA installierbar. Der Service Worker cacht nur die eigene App-Shell (index.html, Manifest, Icon) als Offline-Fallback — Netzwerk-zuerst, damit nie eine veraltete Version aus dem Cache kommt. API-Aufrufe an Wikipedia/TheSportsDB laufen unverändert direkt übers Netz, der Service Worker fängt sie nicht ab.

여기까지가 README 앞부분입니다. 나머지는 원문에서 읽을 수 있습니다. README 전문 보기 ↗