const form = document.forms[0];
const {
    title: titleEntry,
    author: authorEntry,
    ["is-dataset"]: isDatasetSwitch,
    ["short-description"]: shortDescriptionEntry,
    url: urlEntry,
    ["full-description"]: fullDescriptionEntry,
    ["btn-add"]: addBtn,
    ["btn-cancel"]: cancelBtn,
} = form.elements;

const validationListener = () => {
    addBtn.disabled = !form.checkValidity();
};

// Register validationListener on all required inputs that must be valid
[
    titleEntry,
    authorEntry,
    shortDescriptionEntry,
    urlEntry,
    fullDescriptionEntry,
].forEach(input => input.addEventListener("input", validationListener));

form.addEventListener("submit", e => {
    e.preventDefault();
    if (!form.reportValidity()) return;

    // Create the request body
    const newContent = {
        title: titleEntry.value,
        author: authorEntry.value,
        abst: shortDescriptionEntry.value,
        url: urlEntry.value,
        description: fullDescriptionEntry.value,
        type: isDatasetSwitch.checked ? "API" : "DATASET",
        categories: [],
    };

    console.debug(newContent);

    // Don't allow several requests to be sent at the same time
    addBtn.disabled = true;

    fetch("/api/v1/datasets", {
        method: "POST",
        body: JSON.stringify(newContent),
        headers: {
            "Content-Type": "application/json;charset=utf-8"
        }
    }).then(response => {
        if (response.status == 200) {
            location.assign("/");
        } else {
            addBtn.disabled = !form.checkValidity();
        }
    });
});