const badgeurl = "https://monitoring.lila.network/api/badge/##/status?style=for-the-badge"
const template = document.getElementById("game-template").content
const serverdata = "/servers.json"
var gamecontainer = document.getElementById("gamelist")

window.setInterval(PopulatePage, 30000, true)

async function PopulatePage(reload) {
    var request = await fetch(serverdata, {cache: "reload"})
    var data = await request.json()
    console.log(data)

    if (reload == true) {
        gamecontainer.innerHTML = ""
    }

    data.forEach(server => {
        let clone = template.cloneNode(true);

        let url = badgeurl.replace("##", server.id ) + "&" + String(Date.now())
        clone.querySelector("#game-name").innerHTML = server.displayname
        clone.querySelector("#game-badge").src = url
        clone.querySelector("#game-url").innerHTML = server.serverurl
        clone.querySelector("#game-password").innerHTML = server.password ? "yes" : "no"
        clone.querySelector("#game-whitelist").innerHTML = server.whitelist ? "yes" : "no"

        gamecontainer.appendChild(clone)
    });
}