fs
185365dc79
Neue Unterseite /matchcenter ersetzt die alten BFV-Widget-Embeds (verstoßen
gegen CSP) durch eine self-hostete Lösung: Cron-Scraper holt die Daten aus der
öffentlichen BFV-Widget-JSON-API, schreibt data/matchcenter.json und lädt die
Vereinswappen lokal — Besucher kontaktieren nur unsere Domain.
- bin/matchcenter-sync.php: CLI/Cron-Scraper (Muster wie instagram-sync), JSON-API
team/{id}/matches + competition/{compoundId}/table, Wappen via getLogo lokal,
atomarer Write, Fail-safe. Auto-Saison: Tabellen-compoundId wird aus der
Matches-API abgeleitet (team_id ist saison-stabil). Per-Team-Cache-Fallback bei
Fetch-Fehlern, damit Sektionen nie leeren.
- Seite app/pages/matchcenter.php + Route + Nav-Eintrag (unter Fußball).
- Komponenten: match-slider (nächste Spiele), match-card, match-row, league-table
(mit Auf-/Abstiegszonen), matchcenter-section (kicker-Layout: Tabelle 2/3 +
Spiele 1/3), matchcenter-empty, crest (weißes Chip + Initialen-Fallback).
- carousel.js: banner.js zum generischen [data-carousel]-Antrieb verallgemeinert
(Banner- und Match-Slider teilen ihn); crest.js: Logo-Fallback im Browser.
- helpers.php: sportsevent_nodes() für SportsEvent-JSON-LD.
- Icons calendar-event; config.example + .gitignore + CLAUDE.md ergänzt.
- Responsive geprüft (kein Seiten-Overflow 360–1280, Tabelle scrollt in der Karte).
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0192vTfGmGpoWeyUse4TuQFj
46 lines
2.5 KiB
PHP
46 lines
2.5 KiB
PHP
<?php
|
|
|
|
declare(strict_types=1);
|
|
|
|
/**
|
|
* „Nächste Spiele"-Slider (teamübergreifend). Props: $matches (data/matchcenter.json
|
|
* → upcoming[]). Spiegelt die Mechanik des banner-slider (Crossfade, Pause/Play,
|
|
* prefers-reduced-motion) über den generischen Antrieb assets/js/carousel.js.
|
|
* Ohne JS ist nur die erste Folie sichtbar. Leer → nichts rendern (Off-Season).
|
|
*/
|
|
$matches = $matches ?? [];
|
|
if ($matches === []) {
|
|
return;
|
|
}
|
|
$total = count($matches);
|
|
?>
|
|
<section class="section match-slider" id="naechste-spiele" aria-roledescription="Karussell" aria-label="Nächste Spiele unserer Mannschaften" data-carousel>
|
|
<div class="container">
|
|
<h2>Nächste Spiele</h2>
|
|
<ul class="match-slider__track" id="match-slider-track" data-carousel-track aria-live="off">
|
|
<?php foreach ($matches as $i => $m): ?>
|
|
<li class="match-slider__slide" data-carousel-slide role="group" aria-roledescription="Folie" aria-label="<?= ($i + 1) ?> von <?= $total ?>"<?= $i === 0 ? '' : ' hidden' ?>>
|
|
<p class="match-slider__team"><?= e($m['team_name'] ?? '') ?></p>
|
|
<?php component('match-card', ['match' => $m, 'variant' => 'hero']); ?>
|
|
</li>
|
|
<?php endforeach; ?>
|
|
</ul>
|
|
<?php if ($total > 1): ?>
|
|
<div class="match-slider__controls" data-carousel-controls hidden>
|
|
<button class="match-slider__toggle" type="button" data-carousel-toggle aria-pressed="false" aria-controls="match-slider-track" hidden>
|
|
<?= icon('pause-fill', 'match-slider__toggle-icon match-slider__toggle-icon--pause') ?>
|
|
<?= icon('play-fill', 'match-slider__toggle-icon match-slider__toggle-icon--play') ?>
|
|
<span class="visually-hidden" data-carousel-toggle-label>Automatischen Wechsel pausieren</span>
|
|
</button>
|
|
<div class="match-slider__dots" role="group" aria-label="Spiel wählen">
|
|
<?php foreach ($matches as $i => $m): ?>
|
|
<button class="match-slider__dot" type="button" data-carousel-dot aria-label="Spiel <?= ($i + 1) ?> von <?= $total ?>: <?= e(($m['home'] ?? '') . ' gegen ' . ($m['away'] ?? '')) ?>">
|
|
<span class="match-slider__progress" data-carousel-progress aria-hidden="true"></span>
|
|
</button>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
</section>
|