document.addEventListener('DOMContentLoaded', function () {
  const customer_name = document.getElementById('customer_name');
  const customer_phone = document.getElementById('customer_phone');
  const event_date = document.getElementById('event_date');
  const event_type = document.getElementById('event_type');
  const event_city = document.getElementById('event_city');
  const event_budget = document.getElementById('event_budget');
  const submit_button = document.getElementById('contact_form_submit_button');
  const input_captcha = document.getElementById('input_captcha');

  if (customer_name && customer_phone && event_date && event_type && event_city && event_budget && input_captcha && submit_button) {
    customer_name.addEventListener('keydown', handleEnterKey);
    customer_phone.addEventListener('keydown', handleEnterKey);
    event_type.addEventListener('keydown', handleEnterKey);
    event_city.addEventListener('keydown', handleEnterKey);
    input_captcha.addEventListener('keydown', handleEnterKey);
  }

  function handleEnterKey(event) {
    if (event.key === "Enter" || event.keyCode == "13") {
      submitContactForm();
    }
  }

  function submitContactForm() {

    document.querySelectorAll('.form-validation-require').forEach(function(element) { 
      element.classList.remove('border-1p-red'); 
    });

    var formData = new FormData();
    formData.append("customer_name", customer_name.value.trim());
    formData.append("customer_phone", customer_phone.value.trim());
    formData.append("event_date", event_date.value.trim());
    formData.append("event_type", event_type.value.trim());
    formData.append("event_city", event_city.value.trim());
    formData.append("event_budget", event_budget.value.trim());
    formData.append("input_captcha", input_captcha.value.trim());
    formData.append("page_url", $("#page_url").val().trim());

    submit_button.setAttribute('disabled', '');

    $.ajax({
      url: home_url + "apis/submit-contact-form.php", 
      type: 'post', 
      data: formData, 
      processData: false, 
      contentType: false,
      success: function (result) {
        result = JSON.parse(result);
        submit_button.removeAttribute('disabled');
        if(result.status == 'success') {
          if(result.authResult == "name_empty") {
            setValidateAndFocusToElement(customer_name, 'Please enter your full name');
          } else if(result.authResult == "phone_empty") {
            setValidateAndFocusToElement(customer_phone, 'Please enter your contact number');
          } else if(result.authResult == "event_date_empty") {
            setValidateAndFocusToElement(event_date, 'Please select event date');
          } else if(result.authResult == "event_type_empty") {
            setValidateAndFocusToElement(event_type, 'Please enter event type');
          } else if(result.authResult == "event_city_empty") {
            setValidateAndFocusToElement(event_city, 'Please enter event city');
          } else if(result.authResult == "event_budget_empty") {
            setValidateAndFocusToElement(event_budget, 'Please select your budget');
          } else if(result.authResult == "captcha_empty") {
            setValidateAndFocusToElement(input_captcha, 'Please enter captcha code');
          } else if(result.authResult == "captcha_invalid") {
            setValidateAndFocusToElement(input_captcha, 'You entered wrong captcha');
          } else if(result.authResult == "too_many_wrong_captcha") {
            tata.error("Sorry! You attempt too many wrong captcha entry", '', { animate: 'slide', closeBtn: false, duration: 2000 });
          } else if(result.authResult == "submitted") {
            customer_name.value = '';
            customer_phone.value = '';
            event_date.value = '';
            event_type.value = '';
            event_city.value = '';
            event_budget.value = '';
            input_captcha.value = '';
            document.getElementById('captcha_display_element').src = result.newImage;
            Swal.fire({
              title: "Thank You!",
              text: "Your query has been submitted, we will get back to you soon.",
              icon: "success",
              confirmButtonText: "OK"
            });
          } else {
            tata.error("Sorry! You attempt too many wrong captcha entry", '', { animate: 'slide', closeBtn: false, duration: 2000 });
          }
        } else {
          tata.error("Error! Something went wrong", '', { animate: 'slide', closeBtn: false, duration: 2000 });
        }
      }
    });
  }

  function setValidateAndFocusToElement(element, message) {
    element.classList.add('border-1p-red');
    window.scrollTo({ top: element.offsetTop - customOffsetTop, behavior: 'smooth' });
    tata.error(message, '', { animate: 'slide', closeBtn: false, duration: 2000 });
    element.focus();
  }
});