function message (messageContainer, level, text) {
    const messageElement   = document.createElement('p')
    messageContainer.appendChild(messageElement)
    messageElement.textContent = text
    messageElement.classList.add('contact-mailer-message')
    messageElement.classList.add('contact-mailer-message-'+level)
    setTimeout(() => {
        messageContainer.removeChild(messageElement)
    }, 10000)
}

function interceptForm (formId) {
    /*
     * This function intercepts a form submission and send it via XHR.
     * Param formId is the HTML id of the form
     */
    const formElem   = document.getElementById(formId)
    if (!formElem) {
        console.error('You tried to intercept form id:"' + formId + '" but it was not found.')
        return
    }
    /* Create the message container */
    const messageBox = document.createElement('div')
    messageBox.classList.add('contact-mailer-message-container')
    formElem.parentNode.insertBefore(messageBox, formElem)

    /* Intercept the submit event */
    formElem.onsubmit = async (e) => {
        e.preventDefault()
        fetch(formElem.action, {
            method: formElem.method,
            body: new FormData(formElem)
        })
        .then(data => {
            if (!data.ok || data.status == 500) {
                message(messageBox, 'error', 'Erreur du service d’envoi. Réessayez plus tard ou contactez https://jean-cloud.net')
            } else if (data.ok || data.status == 200) {
                message(messageBox, 'success', 'Le message a bien été envoyé !')
                formElem.reset()
            }
        })
        .catch((error) => {
            message(messageBox, 'error', 'Impossible d’envoyer le formulaire. Vérifiez votre connexion internet ou réessayez plus tard.')
        })
    }
}

interceptForm ('contact-mailer-form')