document.addEventListener("DOMContentLoaded", e => 
{
    // check if the user is logged in and if so load the editor
    fetch("/api/user/isLoggedIn").then(res => 
    {
        if (res.ok)
        {
            window.location.href = "./editor.html";
        }
    });
});

function showErrorMessage(message) 
{
    document.querySelector("#loginError").classList.remove("hidden");
    document.querySelector("#loginError div").innerText = message;
}

document.querySelector("#login form").addEventListener("submit", e => 
{
    e.preventDefault();
    let loginData = new FormData();
    if (e.target.username.value.length > 0 && e.target.password.value.length > 0)
    {
        loginData.append("username", e.target.username.value);
        loginData.append("password", e.target.password.value);
        fetch("/api/user/login", 
    {
            method: "POST", 
            body: loginData
        }).then(res => 
        {
            if (res.ok)
            {
                window.location.href = "./editor.html";
                return;
            }
            if (res.status === 400)
            {
                showErrorMessage("Please type in a username and password.");
                return;
            }
            document.querySelector("#loginError").classList.remove("hidden");
            document.querySelector("#loginError div").innerHTML = "Invalid username or password";
        });
       return; 
    }
    document.querySelector("#loginError").classList.remove("hidden");
    document.querySelector("#loginError div").innerHTML = "Please type in a username and password";
});

document.querySelector("#loginError .close").addEventListener("click", () =>
    document.querySelector("#loginError").classList.toggle("hidden"));