Ergebnisseview
This commit is contained in:
Thies Mueller
parent
7e389c330b
commit
fc1b522846
116
index.php
116
index.php
@ -9,9 +9,9 @@ function fetch_api($url) {
|
|||||||
return $json ? json_decode($json, true) : [];
|
return $json ? json_decode($json, true) : [];
|
||||||
}
|
}
|
||||||
|
|
||||||
$messages = fetch_api("http://127.0.0.1:8000/api/v1/messages");
|
$messages = fetch_api("https://api.sat.regattatech.de/api/v1/messages");
|
||||||
$resultsData = fetch_api("http://127.0.0.1:8000/api/v1/results/current/");
|
$resultsData = fetch_api("https://api.sat.regattatech.de/api/v1/results/current/");
|
||||||
$rennplanData = fetch_api("http://127.0.0.1:8000/api/v1/rennplan/current/");
|
$rennplanData = fetch_api("https://api.sat.regattatech.de/api/v1/rennplan/current/");
|
||||||
|
|
||||||
$results = $resultsData['ergebnisse'] ?? [];
|
$results = $resultsData['ergebnisse'] ?? [];
|
||||||
$rennplan = $rennplanData['rennplan'] ?? [];
|
$rennplan = $rennplanData['rennplan'] ?? [];
|
||||||
@ -34,7 +34,7 @@ function render_message_box($message) {
|
|||||||
'danger' => 'danger'
|
'danger' => 'danger'
|
||||||
];
|
];
|
||||||
$type = $typeMap[$message['type']] ?? 'secondary';
|
$type = $typeMap[$message['type']] ?? 'secondary';
|
||||||
return "<div class='alert alert-{$type}' role='alert'>{$message['message']}</div>";
|
return "<div class='alert alert-{$type} fs-5' role='alert'>{$message['message']}</div>";
|
||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
@ -42,33 +42,32 @@ function render_message_box($message) {
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<title>Regatta Übersicht</title>
|
<title>RegattaTech.DE Ergebnis TV</title>
|
||||||
<link href="/res/css/bootstrap.min.css" rel="stylesheet">
|
<link href="/res/css/bootstrap.min.css" rel="stylesheet">
|
||||||
<style>
|
<style>
|
||||||
#resultsBox {
|
#resultsBox {
|
||||||
height: 400px;
|
max-height: 600px;
|
||||||
overflow: hidden;
|
overflow-y: auto;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
#resultsBox .inner {
|
body {
|
||||||
position: absolute;
|
font-size: 1.25rem;
|
||||||
animation: scroll 30s linear infinite;
|
}
|
||||||
}
|
h5, h6 {
|
||||||
@keyframes scroll {
|
font-size: 1.5rem;
|
||||||
0% { top: 0; }
|
}
|
||||||
100% { top: -100%; }
|
</style>
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
</head>
|
||||||
<body class="bg-light">
|
<body class="bg-light">
|
||||||
<div class="container-fluid py-2 bg-white border-bottom">
|
<div class="container-fluid py-3 bg-white border-bottom">
|
||||||
<div class="d-flex justify-content-between align-items-center">
|
<div class="d-flex justify-content-between align-items-center">
|
||||||
<img src="/res/img/regattatech_logo.png" height="50">
|
<img src="/res/img/regattatech_logo.png" height="70">
|
||||||
<h4 id="clock" class="m-0"></h4>
|
<h3 id="clock" class="m-0 fw-bold"></h3>
|
||||||
<img src="/res/img/sat_logo.png" height="50">
|
<img src="/res/img/sat_logo.png" height="70">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container mt-3">
|
<div class="container mt-4">
|
||||||
<div id="messages">
|
<div id="messages">
|
||||||
<?php
|
<?php
|
||||||
if (!empty($messages)) {
|
if (!empty($messages)) {
|
||||||
@ -76,39 +75,41 @@ function render_message_box($message) {
|
|||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
</div>
|
</div>
|
||||||
<div class="row mt-3">
|
<div class="row mt-4">
|
||||||
<!-- Ergebnisse -->
|
<!-- Ergebnisse -->
|
||||||
<div class="col-md-6">
|
<div class="col-lg-7">
|
||||||
<h5>Letzte Ergebnisse</h5>
|
<h5 class="fw-bold">Letzte Ergebnisse</h5>
|
||||||
<div id="resultsBox" class="bg-white border rounded p-2">
|
<div id="resultsBox" class="bg-white border rounded p-3">
|
||||||
<div class="inner">
|
|
||||||
<?php
|
<?php
|
||||||
$lauf = null;
|
if (empty($results)) {
|
||||||
$latest = array_reverse(array_slice($results, -10));
|
echo "<p class='text-muted'>Noch keine Ergebnisse vorhanden</p>";
|
||||||
foreach ($latest as $res) {
|
} else {
|
||||||
if ($lauf !== $res['lauf']) {
|
$lauf = null;
|
||||||
echo "<h6 class='mt-3'>Lauf {$res['lauf']}</h6>";
|
$latest = array_reverse(array_slice($results, -10));
|
||||||
$lauf = $res['lauf'];
|
foreach ($latest as $res) {
|
||||||
|
if ($lauf !== $res['lauf']) {
|
||||||
|
echo "<h3 class='mt-4'>Lauf {$res['lauf']}</h3>";
|
||||||
|
$lauf = $res['lauf'];
|
||||||
|
}
|
||||||
|
echo "<div class='mb-3'><strong>{$res['title']}</strong><br>";
|
||||||
|
foreach (['bahn1', 'bahn2', 'bahn3'] as $bahn) {
|
||||||
|
$boot = $res[$bahn]['boot'];
|
||||||
|
$zeit = $res[$bahn]['zeit'];
|
||||||
|
echo ucfirst($bahn) . ": $boot - $zeit<br>";
|
||||||
|
}
|
||||||
|
echo "</div>";
|
||||||
}
|
}
|
||||||
echo "<div class='mb-2'><strong>{$res['title']}</strong><br>";
|
|
||||||
foreach (['bahn1', 'bahn2', 'bahn3'] as $bahn) {
|
|
||||||
$boot = $res[$bahn]['boot'];
|
|
||||||
$zeit = $res[$bahn]['zeit'];
|
|
||||||
echo "$bahn: $boot - $zeit<br>";
|
|
||||||
}
|
|
||||||
echo "</div>";
|
|
||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- Nächste Rennen -->
|
<!-- Nächste Rennen -->
|
||||||
<div class="col-md-6">
|
<div class="col-lg-5">
|
||||||
<h5>Nächste Rennen</h5>
|
<h5 class="fw-bold">Nächste Rennen</h5>
|
||||||
<div class="bg-white border rounded p-2">
|
<div class="bg-white border rounded p-3">
|
||||||
<?php
|
<?php
|
||||||
foreach ($nextRaces as $rennen) {
|
foreach ($nextRaces as $rennen) {
|
||||||
echo "<div class='mb-3'>
|
echo "<div class='mb-4'>
|
||||||
<strong>{$rennen['name']} ({$rennen['zeit']})</strong><br>
|
<strong>{$rennen['name']} ({$rennen['zeit']})</strong><br>
|
||||||
Bahn 1: {$rennen['bahn1']}<br>
|
Bahn 1: {$rennen['bahn1']}<br>
|
||||||
Bahn 2: {$rennen['bahn2']}<br>
|
Bahn 2: {$rennen['bahn2']}<br>
|
||||||
@ -119,13 +120,13 @@ function render_message_box($message) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row mt-4 align-items-center">
|
<div class="row mt-5 align-items-center">
|
||||||
<div class="col-md-10">
|
<div class="col-lg-10">
|
||||||
<div class="p-3 bg-white rounded border">
|
<div class="p-4 bg-white rounded border fs-5">
|
||||||
<strong>Alle Ergebnisse & Rennpläne Live unter <a href="https://app.sport-am-tankumsee.de" target="_blank">https://app.sport-am-tankumsee.de</a></strong>
|
<strong>Alle Ergebnisse & Rennpläne Live unter <u>https://app.sport-am-tankumsee.de</u> oder im iOS AppStore</strong>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-2 text-end">
|
<div class="col-lg-2 text-end">
|
||||||
<img src="/res/img/qrcode.png" class="img-fluid" alt="QR Code">
|
<img src="/res/img/qrcode.png" class="img-fluid" alt="QR Code">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -138,6 +139,15 @@ function render_message_box($message) {
|
|||||||
setInterval(updateClock, 1000);
|
setInterval(updateClock, 1000);
|
||||||
updateClock();
|
updateClock();
|
||||||
setInterval(() => location.reload(), 15000);
|
setInterval(() => location.reload(), 15000);
|
||||||
|
let scrollDirection = 1;
|
||||||
|
setInterval(() => {
|
||||||
|
const box = document.getElementById('resultsBox');
|
||||||
|
if (box.scrollHeight > box.clientHeight) {
|
||||||
|
if (box.scrollTop + box.clientHeight >= box.scrollHeight) scrollDirection = -1;
|
||||||
|
if (box.scrollTop <= 0) scrollDirection = 1;
|
||||||
|
box.scrollTop += scrollDirection * 1;
|
||||||
|
}, 100);
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user