script.js

let slideIndex = 0
carousel()

function carousel() {
  let i
  let x = document.getElementsByClassName("mySlides")

  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none"
  }

  slideIndex++
  if (slideIndex > x.length) {
    slideIndex = 1
  }

  x[slideIndex - 1].style.display = "block"
  setTimeout(carousel, 3000)
}

// ANIMATIONS
const intro = document.querySelector('.intro-content');
const observer = new IntersectionObserver(entries => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
      entry.target.classList.toggle('showIntro');
      observer.disconnect();
    }
  });
});
observer.observe(intro);

const phrase = document.querySelector('.image-section-content');
const observer1 = new IntersectionObserver(entries => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
      entry.target.classList.toggle('showImagePhrase');
      observer1.disconnect();
    }
  });
});
observer1.observe(phrase);

const product = document.querySelector('#product1');
const product2 = document.querySelector('#product2');
const product3 = document.querySelector('#product3');
const observer2 = new IntersectionObserver(entries => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
     entry.target.style.animation = "slider 1.75s ease-out"
      observer2.disconnect();
    }
  });
});
const observer3 = new IntersectionObserver(entries => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
      entry.target.style.animation = "slider 2s ease-out"
      observer3.disconnect();
    }
  });
});
const observer4 = new IntersectionObserver(entries => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
        entry.target.style.animation = "slider 2.5s ease-out"
      // observer4.disconnect();
    }
  });
});
observer2.observe(product);
observer3.observe(product2);
observer4.observe(product3);





//nodemailer sending email for contact form
function sendEmail() {
  const name = document.querySelector('#name').value;
  document.querySelector('#name').value = '';
  const email = document.querySelector('#email').value;
  document.querySelector('#email').value = '';
  const message = document.querySelector('#message').value;
  document.querySelector('#message').value = '';
  fetch(`https://nodejs-node-mailer-sample.annabananna.repl.co/send?name=${name}&email=${email}&message=${message}`);
  alert("Email sent! Give us up to five business days to get back to you!")
  return true;
}