// Get the modal
const modal = document.getElementById("myModal");

// Get the button that opens the modal
const btn = document.getElementById("myBtn");

// Get the <span> element that closes the modal
const span = document.getElementsByClassName("close")[0];
var mode = new URLSearchParams(window.location.search).get("mode");

const archiveLink = document.querySelector("#archive-link")
const pendingLink = document.querySelector("#pending-link")
const statusLink = document.querySelector("#status-link")
function handleForm(event) { event.preventDefault(); } 

function main() {
    archiveLink.classList.remove("active");
    pendingLink.classList.remove("active");
    statusLink.classList.remove("active");
    switch (mode) {
        case "status":
            statusLink.classList.add("active");
            return statusPage();
        case "pending":
            pendingLink.classList.add("active");
            break;
        case "verifications":
            archiveLink.classList.add("active");
            break;
        default:
            console.log("No mode");
            mode = "verifications"
            archiveLink.classList.add("active");
            break;
    }
    document.getElementById("main-app").innerHTML = '';
    fetch(`https://thanos.nightmare.haus/api/${mode}`)
        .then(response => response.json())
        .then(data => processData(data));

}

function statusPage() {
    document.getElementById("main-app").innerHTML = '';
    fetch(`https://thanos.nightmare.haus/api/config`)
        .then(response => response.json())
        .then(data => {
            var node = document.createElement("config-status");

            var upTime = document.createElement("div");
            upTime.setAttribute("slot", "uptime");
            upTime.innerText = data.Uptime;
            node.appendChild(upTime);

            var bumpTime = document.createElement("div");
            bumpTime.setAttribute("slot", "lastbump")
            bumpTime.innerText = new Date(data.BumpTime).toLocaleString();
            node.appendChild(bumpTime);

            node.setData(data);

            document.getElementById("main-app").appendChild(node);


            

        });
    
}

function searchPage() {
    var search = document.getElementById("search-bar");
    fetch('https://thanos.nightmare.haus/api/verifications')
        .then(response => response.json())
        .then(data => {
            var searchData = [];
            for (user of data) {
                var match = false;

                if (user.Username.toLowerCase().includes(search.value.toLowerCase())) {
                    match = true;
                }
                if (new Date(user.Closed).toLocaleString().includes(search.value)) {
                    match = true;
                }
                if (user.UserID.includes(search.value)) {
                    match = true;
                }
                if (match) {
                    searchData.push(user);
                }
            }
            processData(searchData);
        });
}

function processData(data) {
    document.getElementById("main-app").innerHTML = '';
    if (data.length == 0) {
        alert("No data.");
        return;
    }
    data = Object.values(data);
    for (user of data) {
        var node = document.createElement("user-card");
        var nameSlot = document.createElement("div");
        nameSlot.setAttribute("slot", "username");
        nameSlot.innerText = user.Username;
        node.appendChild(nameSlot);

        var joinDate = document.createElement("div");
        joinDate.setAttribute("slot", "join-date");
        joinDate.innerText = mode == "pending" ? new Date(user.Submitted).toLocaleString() : new Date(user.Closed).toLocaleString();
        node.appendChild(joinDate);

        var discordSlot = document.createElement("div");
        discordSlot.setAttribute("slot", "discord-id");
        discordSlot.innerText = user.UserID;
        node.appendChild(discordSlot);

        var picSlot = document.createElement("div");
        picSlot.setAttribute("slot", "pic-link");
        var aNode = document.createElement("a");

        aNode.setAttribute("href", mode == "pending" ? user.Photo : `https://thanos.nightmare.haus/${user.Photo}`);
        aNode.innerText = "Verification Photo";

        picSlot.appendChild(aNode);
        node.appendChild(picSlot);
        document.getElementById("main-app").appendChild(node);
    }
}

// When the user clicks on <span> (x), close the modal
span.onclick = function () {
    modal.style.display = "none";
}

// When the user clicks anywhere outside of the modal, close it
window.onclick = function (event) {
    if (event.target == modal) {
        modal.style.display = "none";
    }
}
var form = document.getElementById("search-form");
form.addEventListener('submit', handleForm);

main();