const form = document.getElementById("reg-form");

form.addEventListener("submit", async (event) => {
    event.preventDefault();

    let userId = document.getElementById("user-id").value;
    let msgBox = document.getElementById("msg-box");
    try {
        const response = await fetch(`/api/checkname/${userId}`, {
            method: "GET",
        });

        if (response.status === 409) {
            msgBox.innerText = "Entry with id \"" + userId + "\" already in use";
            return;
        } else if (!response.ok) {
            throw new Error(`Server Error: ${response.status}`);
        }

        const data = await response.json();
        console.log("Fetch successful:", data);

        form.submit();

    } catch (error) {
        console.error("Fetch failed:", error);
        msgBox.innerText = "Internal Error: " + error;
    }
});