import { createDataLayerFormObject } from "../../data-layer-utils"
import { DataManager, updateDataLayerOnEvent } from "../../main"

let hasSubmittedEmail = false;

const attachFormStart = () => {
    $('.div-block-445 form[name="Form"]').on('keydown', function() {
        const navObj = createDataLayerFormObject('formStart', 'Contact Us Form')
        updateDataLayerOnEvent({...DataManager.getCurrentPageData(), ...navObj});
        $('form[name="Form"]').off('keydown');
    })
}

const attachFormSubmit = () => {
    $('.div-block-445 form[name="Form"]').on('submit', function(event) {
        event.preventDefault();
        const navObj = createDataLayerFormObject('formSubmit', 'Contact Us Form')
        updateDataLayerOnEvent({...DataManager.getCurrentPageData(), ...navObj});
    })
}

const attachFormSubmitEmail = () => {
    $('.div-block-745  form[name="Form"]').on('submit', function(event) {
        if (!hasSubmittedEmail) {
          event.preventDefault();
          const navObj = createDataLayerFormObject('formSubmit', "CJA - Let's Talk About What's Next")
          updateDataLayerOnEvent({...DataManager.getCurrentPageData(), ...navObj});
          hasSubmittedEmail = true;
        }
    })
}

const attachNewsletterFormSubmit = () => {
    $('section.section-90 form[name="Form"]').on('submit', function(event) {
        event.preventDefault();
        const navObj = createDataLayerFormObject('formSubmit', 'Concord Blog Subscription - Bottom of Page')
        updateDataLayerOnEvent({...DataManager.getCurrentPageData(), ...navObj});
    })
}

export const attachFormEvents = () => {
    attachFormStart();
    attachFormSubmit();
    attachNewsletterFormSubmit();
    attachFormSubmitEmail();
}