var Webflow = Webflow || [];
Webflow.push(async function () {
  let project_next = document.querySelector('[project-slide-button="next"]');
  let project_thumb = document.querySelector('[project-slide="thumb"]');
  // //console.log(project_next);
  let project_slide_text = document.querySelector('[project-slide="text"]');
  let project_slide_image = document.querySelector(
    '[project-next-slide="image"]'
  );

  let isFinal = false;

  let project_slide_text_node = document.querySelectorAll(
    '[project-slider="text"]'
  );
  let project_all_slide_text = [];
  //console.log(project_all_slide_text);
  let project_current_pos = -1;
  let project_next_pos = project_current_pos + 1;
  project_slide_text_node.forEach(function (item) {
    project_all_slide_text.push(item.textContent);
  });

  // Slide In Animation
  var projectthumb = anime.timeline({
    loop: true,
    autoplay: true
  });

  projectthumb.add({
    targets: project_thumb,
    width: ["0%", "100%"],
    duration: 6000,
    easing: "linear"
  });

  projectgetActiveSlideText();
  let projectinterval = setInterval(projectgetActiveSlideText, 6000);

  project_next.addEventListener("click", function () {
    clearInterval(projectinterval);
    projectinterval = setInterval(projectgetActiveSlideText, 6000);
    projectgetActiveSlideText();
    projectthumb.restart();
  });

  function projectgetActiveSlideText() {
    //console.log("Project Next Slide");
    project_current_pos++;
    project_next_pos = project_current_pos + 1;
    //console.log("length: " + project_all_slide_text.length);

    //console.log("project_next_pos " + project_next_pos);
    //console.log("project_current_pos " + project_current_pos);

    if (project_next_pos === project_all_slide_text.length) {
      //console.log("final slide");
      isFinal = true;
      project_next_pos = 0;
    }

    project_slide_text.textContent = project_all_slide_text[project_next_pos];
    let start_project_image = document.querySelector(
      `[project-slider='${project_all_slide_text[project_next_pos]}']`
    );
    //console.log(
    //   "Current Project: " + project_all_slide_text[project_current_pos]
    // );

    //console.log("Next Project: " + project_all_slide_text[project_next_pos]);
    project_slide_image.style.backgroundImage = `url('${start_project_image.src}')`;

    let activeSlide = document.querySelector(
      `[project-slider-item='${project_all_slide_text[project_current_pos]}']`
    );
    //console.log(project_all_slide_text[project_current_pos]);

    //console.log(activeSlide);

    projectresetAllSlide();
    activeSlide.classList.add("active");

    if (isFinal) {
      //console.log("equal");
      project_current_pos = -1;
      project_next_pos = project_current_pos + 1;
      isFinal = false;
    }
  }

  function projectresetAllSlide() {
    let all_slide = document.querySelectorAll(".project_slider-item-wrapper");
    all_slide.forEach(function (item) {
      item.classList.remove("active");
    });
  }
});