let vote = {
    plus_player_id: null,
    plus_nickname: "",
    plus_reason: "",
    minus_player_id: null,
    minus_nickname: "",
    minus_reason: ""
}

let current_page = 0;

async function main() {
    let players = await fetch("/data/players").then(r => r.json());
    let select = document.getElementById("player_id");
    let nickname = document.getElementById("nickname");
    let reason = document.getElementById("reason");
    players.forEach((x) => {
        let option = document.createElement("option");
        option.value = x["id"];
        option.textContent = x["name"];
        select.append(option);
    })
    select.value = null;
    select.addEventListener("change", () => {
        if (current_page) {
            vote.minus_player_id = parseInt(select.value);
        } else {
            vote.plus_player_id = parseInt(select.value);
        }
    })
    nickname.addEventListener("change", () => {
        if (current_page) {
            vote.minus_nickname = nickname.value;
        } else {
            vote.plus_nickname = nickname.value;
        }
    })
    reason.addEventListener("change", () => {
        if (current_page) {
            vote.minus_reason = reason.value;
        } else {
            vote.plus_reason = reason.value;
        }
    })
    let rightButton = document.getElementById("next");
    let leftButton = document.getElementById("prev");
    let title = document.getElementById("app_title");
    rightButton.addEventListener("click", async () => {
        if (current_page) {
            if (await fetch("/post", {
                method:"post", body: JSON.stringify(vote)})
                .then(r => r.status) === 200) {
                showMessage("Merci pour ton vote!", "Ton vote a bien été prit en compte.", false);
            }
            console.log(vote);
        } else {
            rightButton.textContent = "À voté!";
            title.textContent = "Vote -";
            current_page = 1;
            leftButton.hidden = false;
            select.value = vote.minus_player_id;
            nickname.value = vote.minus_nickname;
            reason.value = vote.minus_reason;
        }
    })
    leftButton.addEventListener("click", () => {
        if (current_page) {
            current_page = 0;
            title.textContent = "Vote +";
            rightButton.textContent = "Suivant";
            leftButton.hidden = true;
            select.value = vote.plus_player_id;
            nickname.value = vote.plus_nickname;
            reason.value = vote.plus_reason;
        }
    })
}

function showMessage(title, description, canBeDismissed) {
    let notification = document.getElementById("notification");
    notification.hidden = false;
    let notificationTitle = document.getElementById("title");
    notificationTitle.textContent = title;
    let detail = document.getElementById("detail");
    detail.textContent = description;
    let close = document.getElementById("close");
    close.hidden = !canBeDismissed;
    close.addEventListener("click", () => {
        notification.hidden = true;
    })
}

function cookie() {}

let _ = main();