"use strict"

function render_scoreboard(data) {
    const users = Object.values(data.users);

    users.sort((a, b) => b.score - a.score);
    const min_score = users[users.length-1].score,
        max_score = users[0].score;
    
    const tbody = document.querySelector("#scoreboard tbody");

    while (tbody.children.length) {
        tbody.removeChild(tbody.firstChild);
    }

    const template = document.querySelector("#scoreboard template");

    for (const user of users) {

        const clone = template.content.cloneNode(true);
        const name = clone.querySelector(".name"),
            score = clone.querySelector(".score"),
            bar = clone.querySelector(".bar");
        
        const score_percent = Math.floor(10 + (user.score - min_score) / (max_score - min_score) * 90) + "%";
        bar.style.width = score_percent;
    
        name.innerText = user.name;
        score.innerText = user.score;

        tbody.appendChild(clone);
    }
}

async function update_scoreboard() {

    const r = await fetch('api/get_public_model', {
        method: 'POST',
        body: JSON.stringify({}),
    });

    if (r.status !== 200) {
        console.log("oh no");
        return;
    }

    const data = await r.json();
    render_scoreboard(data);
}

update_scoreboard();
setInterval(update_scoreboard, 1000);