async function me() {
    const response = await fetch("/me");
    if (response.ok) {
        const result = await response.json();
        const span = document.getElementById("logged-in");
        // this is technically a XSS risk (TODO: deal with it)
        // in principle it only affects the person who chose their username, but...
        span.innerHTML = `Logged in as ${result.username}`;
        span.hidden = false;
    } else {
        document.getElementById("login-links").hidden = false;
        console.log("not logged in? No cookie");
        console.log(response);
    }
}

async function fetch_problems() {
    const response = await fetch("/problem");
    if (!response.ok) {
        console.log("ummm");
    }

    const result = await response.json();

    const problems_div = document.getElementById("problems");
    while (problems_div.firstChild) {
        problems_div.removeChild(problems_div.lastChild);
    }

    for (const problem of result) {
        const problem_div = document.createElement("div");
        problem_div.className = "problem";
        problems_div.appendChild(problem_div);
                 
        const title = document.createElement("h2");
        title.innerHTML = problem.title;
        problem_div.appendChild(title);
                 
        const description = document.createElement("p");
        description.innerHTML = problem.description;
        problem_div.appendChild(description);
    }
}

async function on_load() {
    await me();
    await fetch_problems();
}