$(() => {

    const controlTrack = () => {

        var check = true;
        var count = 0;

        const recTrack = () => {

            if(count == 500)
            {
                return;
            }
            else if (check == true)
            {
                $("#sub").html($("#sub").html().replace('|', ''));
                check = false;
                count++;
                setTimeout(recTrack, 700);
            }
            else if (check == false)
            {
                $("#sub").append("|"); 
                check = true;
                count++;
                setTimeout(recTrack, 700);

            }
        };
        recTrack();
    };
    const printSub = () => {
        
        $("#sub").empty();

        var outputLength = 0;
        var data = "Your future of digital marketing. All in our hands.";

        const printLetter = () => {

            if (outputLength < data.length) {
                $("#sub").html($("#sub").html().replace('|', ''));
                $("#sub").append(data.charAt(outputLength));
                $("#sub").append("|"); 

        
                outputLength++;
                setTimeout(printLetter, 80);
              } else {
                outputLength = 0;
                $("#down").addClass("animateArrowC");
                controlTrack();
                return;
              }
            
        };

        printLetter();
    };

    printSub();

    var form = document.getElementById("contact-form");
    
    async function handleSubmit(event) {
      event.preventDefault();
      var status = document.getElementById("status");
      var data = new FormData(event.target);
      fetch('https://formspree.io/f/xoqzqwdo', {
        method: 'POST',
        body: data,
        headers: {
            'Accept': 'application/json'
        }
      }).then(response => {
        if (response.ok) {
          status.innerHTML = "Thanks for your submission! One of our success managers will be in touch very soon.";
          form.reset()
        } else {
          response.json().then(data => {
            if (Object.hasOwn(data, 'errors')) {
              status.innerHTML = data["errors"].map(error => error["message"]).join(", ")
            } else {
              status.innerHTML = "Oops! There was a problem submitting your form"
            }
          })
        }
      }).catch(error => {
        status.innerHTML = "Oops! There was a problem submitting your form"
      });
    }
    form.addEventListener("submit", handleSubmit)

}); // jQuery