web/app/view/pages/race/live.php

<div id="alert" class="alert danger hidden" role="alert"></div>

<h1>Live resultater</h1>
<br>

<noscript>
Denne siden krever JavaScript
</noscript>

<div id="ranking-table">
Laster inn...
</div>

<script>
let hash = 0;
let alertbox = document.getElementById("alert");

document.addEventListener('DOMContentLoaded', function() {
    loop();
});

async function loop()
{
    try {
        await updateTable();
        alertbox.classList.add("hidden");
    } catch (error) {
        alertbox.innerHTML = "<b>Noe gikk galt: </b>" + error;
        alertbox.classList.remove("hidden");
    }

    setTimeout(function() {
        loop();
    }, 1000);
}

async function updateTable()
{
    let response = await fetch("../api/v1/race/sync.php?h=" + hash);

    if (response.status === 204)
    {
        return;
    }

    let json = await response.json();

    hash = json.hash;

    let data = json.data;

    let table_html = "";
    table_html += "<table>";
    table_html += "<tr>";
    table_html += "<th>Navn</th>";
    table_html += "<th>Bestetid</th>";
    table_html += "</tr>";

    data.forEach(element => {
        table_html += "<tr>";
        table_html += "<td>" + element.n + "</td>";
        table_html += "<td>" + element.d + "</td>";
        table_html += "</tr>";
    });

    table_html += "<table>";

    console.log(data);

    document.getElementById("ranking-table").innerHTML = table_html;
}
</script>