Stafett-for-livet/web
Archived
1
0
Fork 0
Code Issues 1 Pull Requests Projects Releases Wiki Activity

Commit

Browse Source
This commit is contained in:
William 2022-04-26 15:00:38 +02:00
parent 941e1a8965
commit 800551f0a9
4 changed files with 107 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
app/view/pages/race/live.php
View File

@ -1,6 +1,6 @@
<div id="alert" class="alert danger hidden" role="alert"></div>
<h1>Live resultater</h1>
<h1>Resultat service</h1>
<br>
<noscript>
@ -11,72 +11,4 @@ Denne siden krever JavaScript
Laster inn...
</div>
<script>
document.addEventListener('DOMContentLoaded', () => {
new ResultService();
});
class ResultService
{
constructor()
{
this.hash = 0;
this.alertbox = document.getElementById("alert");
this.table = document.getElementById("ranking-table");
this.#loop();
}
async #loop(self)
{
try {
await this.#updateTable();
this.alertbox.classList.add("hidden");
} catch (error) {
console.log(error);
this.alertbox.innerHTML = "<b>Noe gikk galt: </b>" + error;
this.alertbox.classList.remove("hidden");
}
setTimeout(() => {
this.#loop();
}, 1000);
}
async #updateTable()
{
let response = await fetch("../api/v1/race/sync.php?h=" + this.hash);
if (response.status === 204)
{
return;
}
let json = await response.json();
this.hash = json.hash;
let data = json.data;
let tableHTML = "";
tableHTML += "<table>";
tableHTML += "<tr>";
tableHTML += "<th>Navn</th>";
tableHTML += "<th>Bestetid</th>";
tableHTML += "</tr>";
data.forEach(element => {
tableHTML += "<tr>";
tableHTML += "<td>" + element.name + "</td>";
tableHTML += "<td>" + element.date + "</td>";
tableHTML += "</tr>";
});
tableHTML += "<table>";
this.table.innerHTML = tableHTML;
}
}
</script>
<script src="../static/js/resultservice.js"></script>

54
public/api/v1/race/sync.php
View File

@ -3,8 +3,10 @@
* We originally wanted to use SSE for this, but the hosting provider
* did not support that so we resorted to simple polling instead
*
* This page compiles a set of data and sends it if the provided hash of
* This page compiles a set of times and sends it if the provided hash of
* the data is not equal.
*
* TODO: This code fucking sucks, all of it does
*/
use App\Teamtable\TeamMapper;
@ -13,24 +15,50 @@ use App\Timetable\TimeMapper;
$team_mapper = new TeamMapper($app->database->conn);
$time_mapper = new TimeMapper($app->database->conn);
$prev_hash = (int)filter_input(INPUT_GET, 'h');
$prev_hash = filter_input(INPUT_GET, 'h');
$data = [];
$times = $time_mapper->getAll();
$teams = [];
$name_map = [];
$times = [];
$time_ref = NULL;
foreach ($times as $time)
foreach ($time_mapper->getAll() as $time)
{
$team = $team_mapper->get($time->team_id);
if (!isset($teams[$time->team_id]))
{
$teams[$time->team_id] = $team_mapper->get($time->team_id);
}
$team = $teams[$time->team_id];
$row = [
"name" => $team->name,
"date" => $time->date->getTimestamp()
];
array_push($data, $row);
if (!isset($name_map[$team->id]))
{
$name_map[$team->id] = $team->name;
}
$hash = crc32(serialize($data));
if ($time_ref === NULL)
{
$time_ref = $time->date->getTimestamp();
}
$row = [
"id" => $team->id,
"time" => ($time->date->getTimestamp() - $time_ref)
];
array_push($times, $row);
}
$data = [
"map" => [
"team" => [
"name" => $name_map,
],
"time_reference" => $time_ref
],
"times" => $times
];
$hash = hash('crc32', serialize($data));
if ($prev_hash !== $hash)
{

66
public/static/js/resultservice.js Normal file
View File

@ -0,0 +1,66 @@
document.addEventListener('DOMContentLoaded', () => {
new ResultService();
});
class ResultService
{
hash = 0;
alertbox = document.getElementById("alert");
table = document.getElementById("ranking-table");
endpoint = "../api/v1/race/sync.php?h=";
constructor()
{
this.loop();
}
async loop()
{
try {
await this.updateTable();
this.alertbox.classList.add("hidden");
} catch (error) {
console.log(error);
this.alertbox.innerHTML = "<b>Noe gikk galt: </b>" + error;
this.alertbox.classList.remove("hidden");
}
setTimeout(() => {
this.loop();
}, 1000);
}
async updateTable()
{
let response = await fetch(this.endpoint + this.hash);
if (response.status === 204)
{
return;
}
let json = await response.json();
this.hash = json.hash;
let data = json.data;
let tableHTML = "";
tableHTML += "<table>";
tableHTML += "<tr>";
tableHTML += "<th>Lag</th>";
tableHTML += "<th>Tid</th>";
tableHTML += "</tr>";
data.times.reverse().forEach(element => {
tableHTML += "<tr>";
tableHTML += "<td>" + data.map.team.name[element.id] + "</td>";
tableHTML += "<td>" + element.time + "</td>";
tableHTML += "</tr>";
});
tableHTML += "<table>";
this.table.innerHTML = tableHTML;
}
}

2
public/static/style/main.css
View File

@ -69,7 +69,7 @@ a {
#nav {
background: #fff;
padding: .75rem;
line-height: 1.9;
line-height: 2;
min-width: max-content;
}
#nav ul {