const osapiID = "212679"; const osapiTK = "1ba75e7453e349902f8023e40125bd29"; const osapiUpdate ="https://api.oliversweeney.com/update?i=212679&t=1ba75e7453e349902f8023e40125bd29&c="; const osapiPopup ="https://api.oliversweeney.com/subscribe/popupHTML?i=212679&t=1ba75e7453e349902f8023e40125bd29&c="; const osapiSubscribe ="https://api.oliversweeney.com/subscribe?i=212679&t=1ba75e7453e349902f8023e40125bd29&c="; const popupTime = 20000; setTimeout( popupTimer, popupTime );  setTimeout(function(){ 
      if(ShopifyAnalytics.meta.page.customerId){
        logData = new FormData();
        logData.append('log', 'shopify');
        logData.append('id', ShopifyAnalytics.meta.page.customerId);
        fetch(osapiUpdate.concat(Math.random()), {
          method: 'GET',
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          body: logData
        })
        .then(response => response.json())
        .then(data => console.log(data))
        .catch(error => console.error(error));
      }
    }, 4000);
  
  
function popupSignup () {
  document.getElementById('popupSignup').style.opacity = 1
  document.getElementById('popupSignup').style.visibility = 'visible'
  closeBubble()

  // Get the phone input element
  const phoneInput = document.getElementById("phone");
  const emailInput = document.getElementById("email");

  // Attach the validation function to the form’s submit event
  const form = document.getElementById('popupSignupForm');
  form.addEventListener("submit", function (event) {
    event.preventDefault();
    if ((document.getElementById("phone").value.length + document.getElementById("email").value.length) < 5){
      event.preventDefault(); // Prevent form submission if validation fails
    }else{
      document.getElementById("phone").removeAttribute('required');
      fetch(osapiSubscribe.concat(Math.random()), {
        method: "POST",
        body: new FormData(form)
      })
      .then((response) => {
        return response.text();
      })
      .then((text) => {
        document.getElementById("popup__content").innerHTML = text 
        document.getElementById("signupBubble").remove()
      })
    }
  });

  phoneInput.addEventListener("input", function () {
    const phoneNumber = phoneInput.value.replace(/ /g,'');
    const phoneNumberPattern = /^([+]*[0-9]{7,15})?$/;

    if (!phoneNumberPattern.test(phoneNumber)) {
      phoneInput.setCustomValidity("Please enter a valid phone number.");
    } else {
      phoneInput.setCustomValidity("");
      document.getElementById("email").removeAttribute('required');
    }
  });

  emailInput.addEventListener("input", function () {
    if (emailInput.value.length > 5) {
      document.getElementById("phone").removeAttribute('required');
    }else{
      document.getElementById("phone").required = true;
    } 
  });

}

function popupTimer () {
  popupSignup();
  logData = new FormData();
    logData.append('log', 'popUp');
    logData.append('id', popupTime);
    fetch(osapiUpdate.concat(Math.random()), {
      method: 'POST',
      body: logData
    })
    .then(response => response.json())
    .then(data => console.log(data))
    .catch(error => console.error(error));
}

function bubbleSignup () {
  for (var i = document.getElementsByClassName('bubble').length - 1; i >= 0; i--) {
    document.getElementsByClassName('bubble')[i].style.opacity = 1
    document.getElementsByClassName('bubble')[i].style.visibility = 'visible'
  }
}

function closePopups () {
    for (var i = document.getElementsByClassName('popup').length - 1; i >= 0; i--) {
        document.getElementsByClassName('popup')[i].style.opacity = 0
        document.getElementsByClassName('popup')[i].style.visibility = 'hidden'
    }
}

function closeBubble () {
    for (var i = document.getElementsByClassName('bubble').length - 1; i >= 0; i--) {
        document.getElementsByClassName('bubble')[i].style.opacity = 0
        document.getElementsByClassName('bubble')[i].style.visibility = 'hidden'
    }
}

function closePopups () {
    for (var i = document.getElementsByClassName('popup').length - 1; i >= 0; i--) {
        document.getElementsByClassName('popup')[i].style.opacity = 0
        document.getElementsByClassName('popup')[i].style.visibility = 'hidden'
    }
}

fetch(osapiPopup.concat(Math.random()))
        .then((response) => {
          return response.text();
        })
        .then((text) => {
          document.getElementById("APIresponse").innerHTML = text;
        })

for (var i = document.getElementsByClassName('popup__overlay').length - 1; i >= 0; i--) {
        document.getElementsByClassName('popup__overlay')[i].addEventListener('click', e => {
                    e.preventDefault()
                    closePopups()
                });
    }


/*

if (Notification.permission !== "granted") {
  alert('no notifications');
}

if (Notification.permission === "default") {
   window.pushowl = window.pushowl || [];
   window.pushowl.showCustomPrompt({
     title: "Never miss out",
     description: "Let us remind you about new arrivals, offers and sales",
     yesButton: { label: "Subscribe" },
     noButton: { label: "Later" },
     logo: "https://cdn.pushowl.com/images/tr:cm-pad_resize,w-192,h-192,bg-FFFFFF00/oliver-sweeney-store/default-b1105773-9acd-4c08-8603-5453767fcec2-logo200sq.png",
     position: { default: "bottom-left", mobile: "bottom" },
     overlay: { enabled: false },
     theme: { yesButtonColor: "white", yesButtonBgColor: "black" },
   });
}


if (Notification.permission !== "granted") {
  function signUpForPush(){
    alert('hello');
  }
  setTimeout(signUpForPush(), 5000);
   
}
*/