<script>
const COMMENTS_ENDPOINT = "http://alcovegan.myjino.ru/webflow/index.php";

const COMMENT_FORM = $("#wf-form-comment-form");
const COMMENT_NAME_FIELD = $("#name");
const COMMENT_EMAIL_FIELD = $("#email");
// TODO: rename id
const COMMENT_CONTENT_FIELD = $("#field");

const COMMENT_SUBMIT_BUTTON = $("#wf-form-comment-form input[type='submit']");
const SENDING_TEXT = COMMENT_SUBMIT_BUTTON.data("wait");
const SUCCESS_SENDING = $(".w-form-done");
const FAILED_SENDING = $(".w-form-fail");

const getFormContent = () => {
    const postSlug = location.pathname.replace("/post/", "");
    const commentName = COMMENT_NAME_FIELD.val();
    const commentEmail = COMMENT_EMAIL_FIELD.val();
    const commentContent = COMMENT_CONTENT_FIELD.val();

    return {
        "slug": postSlug,
        "name": commentName,
        "email": commentEmail,
        "text": commentContent
    }
}

const generateSlug = (name) => {
    return name.split("").map(letter => letter.toLowerCase()).map(letter => letter.replace(" ", "-")).join("")
}

const generateRequestData = (formData) => {
    return {
        "slug": formData.slug,
        "fields": {
            "name": formData.name,
            "slug": generateSlug(formData.name),
            "slug-post": "",
            "comment-texts": formData.text,
            "mail": formData.email,
            "date-comment": new Date(),
            "_archived": false,
            "_draft": false
        }
    }
}

COMMENT_SUBMIT_BUTTON.on("click", function(e) {

    e.preventDefault();
    COMMENT_SUBMIT_BUTTON.val(SENDING_TEXT);

    const formData = getFormContent();
    const sendData = generateRequestData(formData);
    console.log("sendData", JSON.stringify(sendData));

    fetch(COMMENTS_ENDPOINT, {
        "method": "POST",
        "body": JSON.stringify(sendData),
        "headers": {
            "Content-Type": "application/json"
        }
    })
    .then(response => response.json())
    .then(result => {
        console.log("result is", result);

        COMMENT_FORM.hide();
        SUCCESS_SENDING.show();
    })
    .catch(err => {
        console.log("error", err);
        FAILED_SENDING.show();
    })
});
</script>