const html = document.querySelector("html");
const header = document.querySelector("header");

let windowWidth = window.innerWidth;
let windowHeight = window.innerHeight;
let mobileWidth = 1200;
let scrollPos = 0;
let stickyPos = 0;
let ticking = false;
let timeout;
let burgerMenu = document.querySelector(".h-mobile-btn");
let linkToggle;
let subLinkToggle;
let delay = 300;
let timer;

// Header Event
function headerEvent() {
  window.addEventListener('scroll', scroll, false);
  window.addEventListener("resize", headerResize, false);

  (headerAnimate = function (call) {
    windowWidth = window.innerWidth;
    windowHeight = window.innerHeight;
    scrollPos = window.scrollY || window.pageYOffset;

    animated();

    if (windowWidth > mobileWidth) {
      header.setAttribute('data-header-mobile', 'off');
      burgerMenu.setAttribute('aria-pressed', 'false');
      // burgerMarker();
    }

    if (call === undefined) {
      // initialized();
    } else if (call === 'scroll') {
      // scrolled();
    } else if (call === 'resize') {
      // resized();
    }
  })();

  function animated() {
    // scrollTop();
    sticky();
  }

  function resize() {
    clearTimeout(timer);
    timer = setTimeout(function () {
      timer = null;
      handle();
    }, 66);
  }

  function handle() {
    call = "resize";
    headerAnimate(call, windowWidth);
  }

  function scroll() {
    // 조건문 실행 - 초기 변수가 참인지 거짓인지 판단 후 변환
    if (!ticking) {
      window.requestAnimationFrame(() => {
        call = 'scroll';
        headerAnimate(call);
        ticking = false;
      });
      ticking = true;
    }
  }

  function sticky() {
    let scrollPos = window.pageYOffset || document.documentElement.scrollTop;

    if (scrollPos > stickyPos) {
      header.setAttribute('data-header', 'sticky');
    } else {
      header.removeAttribute('data-header');
    }

    if (scrollPos > 0) {
      header.classList.add('active');
    } else {
      header.classList.remove('active');
    }

    // 조건문 실행 후 변수 재설정 하여 조건문 재실행
    stickyPos = scrollPos <= 0 ? 0 : scrollPos;


    // AOS Event Scroll
    AOS.init({
      // offset: 300,
      duration: 600,
      easing: 'ease',
      once: true,
    });
  }

  function hoverAction() {
    header.addEventListener("mouseenter", function () {
      header.classList.add("header-active");
    });

    header.addEventListener("mouseleave", function () {
      header.classList.remove("header-active");
    });


    let menuLists = document.querySelectorAll(".h-menu-list");

    menuLists.forEach((list) => {
      let submenu = list.querySelector(".h-submenu");
      subLinkToggle = document.querySelectorAll(".h-submenu-toggle");
      if (submenu) {
        list.addEventListener("mouseenter", function () {
          menuLists.forEach((current) => {
            current.classList.remove("menu-active");
          });

          header.classList.add('menu-on');
          list.classList.add("menu-active");
        });

        list.addEventListener("mouseleave", function () {
          list.classList.remove("menu-active");
          header.classList.remove('menu-on');
          for (let j = 0; j < subLinkToggle.length; j++) {
            subLinkToggle[j].setAttribute("data-submenu-link", "false");
          }
        });
      }
    });
  }

  hoverAction();

  function headerResize() {
    clearTimeout(timer);
    timer = setTimeout(function () {
      timer = null;
      handle();
    }, 66);
  }

  function handle() {
    call = "resize";
    headerAnimate(call, windowWidth);
  }

  burgerMenu.addEventListener("click", function () {
    burgerMaker(this);
  });

  function hideSubMenu() {
    linkToggle = document.querySelectorAll(".h-menu-toggle");
    subLinkToggle = document.querySelectorAll(".h-submenu-toggle");

    for (let i = 0; i < linkToggle.length; i++) {
      linkToggle[i].setAttribute("data-menu-link", "false");
      for (let j = 0; j < subLinkToggle.length; j++) {
        subLinkToggle[j].setAttribute("data-submenu-link", "false");
      }
    }
  }

  function clickSubMenu() {
    hideSubMenu();
    for (let i = 0; i < linkToggle.length; i++) {
      linkToggle[i].addEventListener("click", function () {
        if (this.getAttribute("data-menu-link") === "true") {
          hideSubMenu();
        } else {
          hideSubMenu();
          this.setAttribute("data-menu-link", "true");
        }
      });
    }
  }
  clickSubMenu();

  function burgerMaker(e) {
    let body = document.querySelector('body');
    if (e === undefined || e.getAttribute("aria-pressed") === "true") {
      header.setAttribute("data-header-mobile", "off");
      burgerMenu.setAttribute("aria-pressed", "false");
      body.classList.remove('none-scroll');
      hideSubMenu();
    } else {
      e.setAttribute("aria-pressed", "true");
      header.setAttribute("data-header-mobile", "on");
      body.classList.add('none-scroll');
      linkToggle.forEach((link) => {
        link.addEventListener("click", function (event) {
          event.preventDefault();
        });
      });
    }
  }

  // 퀵 이벤트
  //ScrollDown Event 스크롤다운 이벤트 



}



function privacyModalEvent() {
  let privacyModalBtn = document.getElementById('privacyModalBtn');
  let privacyModal = document.getElementById('privacyModal');
  let modalClose = document.querySelector('#privacyModal .close--modal');
  let modalClose2 = document.querySelector('#privacyModal .modal-bg');

  if (privacyModalBtn) {
    privacyModalBtn.addEventListener('click', function () {
      privacyModal.classList.add('open');
    });

    modalClose.addEventListener('click', function () {
      privacyModal.classList.remove('open');
    });

    modalClose2.addEventListener('click', function () {
      privacyModal.classList.remove('open');
    });
  }
}

function termsModalEvent() {
  let termsModalBtn = document.getElementById('termsModalBtn');
  let termsModal = document.getElementById('termsModal');
  let modalClose = document.querySelector('#termsModal .close--modal');
  let modalClose2 = document.querySelector('#termsModal .modal-bg');

  if (termsModalBtn) {
    termsModalBtn.addEventListener('click', function () {
      termsModal.classList.add('open');
    });

    modalClose.addEventListener('click', function () {
      termsModal.classList.remove('open');
    });

    modalClose2.addEventListener('click', function () {
      termsModal.classList.remove('open');
    });
  }
}


function scrolled() {
  let quick = document.getElementById('quick');

  if (quick) {
    window.addEventListener('scroll', function () {
      // 실시간으로 스크롤 위치를 업데이트
      let scrollPos = window.pageYOffset || document.documentElement.scrollTop;

      // console.log(scrollPos); // 현재 스크롤 위치 확인

      if (scrollPos > 250) {
        quick.classList.add('on');
      }

      if (scrollPos < 250) {
        quick.classList.remove('on');
      }
    });

    $(".link-top").click(function () {
      var offset = $(".sec01").offset();
      $("html, .sec01").animate({ scrollTop: offset.top - 60 }, 300);
    });
  }
}

function subScrolled() {
  let quick = document.getElementById('quick');

  if (quick) {
    window.addEventListener('scroll', function () {
      // 실시간으로 스크롤 위치를 업데이트
      let scrollPos = window.pageYOffset || document.documentElement.scrollTop;

      // console.log(scrollPos); // 현재 스크롤 위치 확인

      if (scrollPos > 100) {
        quick.classList.add('on');
      }

      if (scrollPos < 100) {
        quick.classList.remove('on');
      }
    });

    $(".link-top").click(function () {
      var offset = $(".sec01").offset();
      $("html, .sec01").animate({ scrollTop: offset.top - 60 }, 300);
    });
  }
}




// Main Visual
// 메인 비주얼
function mainVisual() {
  let options = {
    effect: "fade",
    fadeEffect: {
      crossFade: true,
    },
    speed: 1000,
    allowTouchMove: true,
    breakpointsInverse: true,
    loop: true,
    autoplay: {
      delay: 5000,
      disableOnInteraction: false,
    },
    pagination: {
      el: ".sec01 .pagination",
      clickable: true,

    },
    watchSlidesProgress: true,

    breakpoints: {
      1201: {
        allowTouchMove: false,
      },
    }

  };

  const visualSlider = new Swiper(".sec01 .swiper-container", options);

}

// 메인 고객사
function mainProduct() {

  if ($(".partner-swiper .swiper-slide").length <= 3) {
    options = {
      slidesPerView: 2,
      spaceBetween: 6,
      loop: false,
      navigation: {
        nextEl: ".sec04 .partner .next",
        prevEl: ".sec04 .partner .prev",
      },
      touchRatio: 0,
      pagination: {
        el: ".partner-swiper .progressbar",
        type: "progressbar",
      },
      breakpoints: {
        501: {
          slidesPerView: 2,
          spaceBetween: 6,
        },
        631: {
          slidesPerView: 3,
          spaceBetween: 8,
        },
        769: {
          slidesPerView: 3,
          spaceBetween: 10,
          allowTouchMove: true,
        },
        1025: {
          slidesPerView: 4,
          spaceBetween: 15,
          allowTouchMove: false,
        },
        1201: {
          slidesPerView: 4,
          spaceBetween: 20,
          allowTouchMove: false,
        },
      }
    };
  } else {
    options = {
      slidesPerView: 2,
      spaceBetween: 6,
      initialSlide: 0,
      autoplay: {
        delay: 1500,
        disableOnInteraction: false,
      },
      loop: true,
      loopedSlides: 5,
      observer: true,
      observeParents: true,
      allowTouchMove: true,
      navigation: {
        nextEl: ".sec04 .partner .next",
        prevEl: ".sec04 .partner .prev",
      },
      pagination: {
        el: ".partner-swiper .progressbar",
        type: "progressbar",
      },
      breakpoints: {
        501: {
          slidesPerView: 2,
          spaceBetween: 6,
        },
        631: {
          slidesPerView: 3,
          spaceBetween: 8,
        },
        769: {
          slidesPerView: 3,
          spaceBetween: 10,
          allowTouchMove: true,
        },
        1025: {
          slidesPerView: 4,
          spaceBetween: 15,
          allowTouchMove: false,
        },
        1201: {
          slidesPerView: 4,
          spaceBetween: 20,
          allowTouchMove: false,
        },
      }
    }
  }

  const productSlider = new Swiper('.sec04 .partner-swiper', options);
}

function voteEvent() {
  let mainOptions = {
    effect: 'fade',
    fadeEffect: {
      crossFade: true
    },
    speed: 1000,
    allowTouchMove: true,
    breakpointsInverse: true,
    loop: true,
    loopedSlides: 1,
    // autoplay: {
    //   delay: 4000,
    //   disableOnInteraction: false,
    // },

    pagination: {
      el: ".sec01 .vote-pagination",//버튼을 담을 태그 설정 
      clickable: true, // 버튼 클릭 여부        
      type: 'bullets',   //페이징 타입 설정(종류: bullets, fraction, progress, progressbar)   
      renderBullet: function (index, className) {
        return '<div class="' + className + '">' + '<p class="number">' + 'STEP' + '<span>' + '0' + (index + 1) + '</span>' + '</p>' + '<p class="pageTxt">' + '</p>' + '</div>';
      },
    },

  }

  const visualSlider = new Swiper('.sec01 .vote-swiper', mainOptions);


}

// 메인 FAQs
function mainFaq() {
  let tabItem = document.querySelectorAll('.sec03 .tab-item');
  let tabCon = document.querySelectorAll('.sec03 .cont-item');

  for (let i = 0; i < tabItem.length; i++) {
    tabItem[i].addEventListener('click', function () {
      for (let j = 0; j < tabItem.length; j++) {
        tabItem[j].classList.remove('on');
        tabCon[j].classList.remove('on');
      }
      tabItem[i].classList.add('on');
      tabCon[i].classList.add('on');
    });
  }
}


function price() {
  // 이전 퍼블 소스
  // const calculateForm = document.getElementById('calculateForm');

  // if (calculateForm) {
  //   const submitBtn = document.querySelector('.calculateButton');
  //   const inputs = document.querySelectorAll('input[type="text"]');
  //   const rowPrice = document.querySelector('.row-price');
  //   const priceText = document.querySelector('.price-txt');
  //   const priceBox = document.querySelector('.row-price');
  //   const voteMethodSelect = document.getElementById('voteMethod');

  //   // 입력값에서 숫자가 아닌 문자 제거
  //   inputs.forEach(input => {
  //     input.addEventListener('input', function () {
  //       this.value = this.value.replace(/[^0-9]/g, '');
  //     });
  //   });

  //   // 버튼 클릭 시 예상 금액 계산
  //   submitBtn.addEventListener('click', function () {
  //     const electorCount = parseInt(document.getElementById('votePeople').value) || 0;
  //     const votePeriod = parseInt(document.getElementById('votePeriod').value) || 0;
  //     const voteNum = parseInt(document.getElementById('voteNum').value) || 0;
  //     const voteMethod = voteMethodSelect.value;
  //     let totalPrice = 0;

  //     // 조건 확인
  //     if (votePeriod >= 4 || voteNum >= 10 || electorCount >= 3001 || voteMethod === "ars") {
  //       rowPrice.classList.remove('active');
  //       rowPrice.classList.add('on');
  //       priceText.textContent = "별도 문의 바랍니다.";
  //       return;
  //     } else {
  //       rowPrice.classList.add('active');
  //       rowPrice.classList.remove('on');
  //     }

  //     // 금액 계산 로직
  //     if (electorCount > 2000 && electorCount <= 3000) {
  //       totalPrice += electorCount * 500;
  //     } else if (electorCount > 1000 && electorCount <= 2000) {
  //       totalPrice += electorCount * 550;
  //     } else if (electorCount > 200 && electorCount <= 1000) {
  //       totalPrice += electorCount * 600;
  //     } else if (electorCount > 0 && electorCount <= 200) {
  //       totalPrice += 120000;
  //     }

  //     // 결과 표시
  //     const totalPriceSpan = document.querySelector('.totalPrice span');

  //     if (totalPriceSpan && priceText) {
  //       totalPriceSpan.textContent = totalPrice.toLocaleString() + '원'; // 올바른 연결
  //       priceBox.classList.add('active');
  //     }
  //   });
  // }

  // 최시 퍼블 소스
  const calculateForm = document.getElementById('calculateForm');

  if (calculateForm) {
    const submitBtn = document.querySelector('.calculateButton');
    const inputs = document.querySelectorAll('input[type="text"]');
    const rowPrice = document.querySelector('.row-price');
    const priceText = document.querySelector('.price-txt');
    const priceBox = document.querySelector('.row-price');
    const voteMethodSelect = document.getElementById('voteMethod');

    inputs.forEach(input => {
      // 객체 할당
      const lastText = {
        votePeople: ' 명',
        votePeriod: ' 일',
        voteNum: ' 개'
      };

      // 숫자 할당
      const inputNumber = value => value.replace(/[^0-9]/g, '');

      // 입력 방식
      input.addEventListener('input', function () {
        const text = lastText[this.id];
        const numberValue = inputNumber(this.value);

        this.value = numberValue ? numberValue + text : '';

        if (numberValue && this === document.activeElement) {
          this.setSelectionRange(numberValue.length, numberValue.length);
        }
      });
    });


    // 버튼 클릭 시 예상 금액 계산
    submitBtn.addEventListener('click', function () {
      const electorCount = parseInt(document.getElementById('votePeople').value.replace(/[^0-9]/g, '')) || 0; // '명' 제거
      const votePeriod = parseInt(document.getElementById('votePeriod').value.replace(/[^0-9]/g, '')) || 0; // '일' 제거
      const voteNum = parseInt(document.getElementById('voteNum').value.replace(/[^0-9]/g, '')) || 0; // '개' 제거
      const voteMethod = voteMethodSelect.value;
      let totalPrice = 0;

      // 조건 확인
      if (votePeriod >= 4 || voteNum >= 10 || electorCount >= 3001 || voteMethod === "ars") {
        rowPrice.classList.remove('active');
        rowPrice.classList.add('on');
        priceText.textContent = "별도 문의 바랍니다.";
        return;
      } else {
        rowPrice.classList.add('active');
        rowPrice.classList.remove('on');
      }

      // 금액 계산 로직
      if (electorCount > 2000 && electorCount <= 3000) {
        totalPrice += electorCount * 500;
      } else if (electorCount > 1000 && electorCount <= 2000) {
        totalPrice += electorCount * 550;
      } else if (electorCount > 200 && electorCount <= 1000) {
        totalPrice += electorCount * 600;
      } else if (electorCount > 0 && electorCount <= 200) {
        totalPrice += 120000;
      }

      // 결과 표시
      const totalPriceSpan = document.querySelector('.totalPrice span');

      if (totalPriceSpan && priceText) {
        totalPriceSpan.textContent = totalPrice.toLocaleString() + '원'; // 올바른 연결
        priceBox.classList.add('active');
      }
    });
  }
}




function inquiry() {
  const inquiry = document.getElementById('inquiryForm');

  if (inquiry) {
    let submitBtn = document.querySelector('.submitButton');

    submitBtn.addEventListener('click', function (e) {
      e.preventDefault(); // 기본 button 동작 방지

      let inquiryVote = document.getElementById('inquiryVote');
      let inquiryGroup = document.getElementById('inquiryGroup');
      let inquiryName = document.getElementById('inquiryName');
      let inquiryTel = document.getElementById('inquiryTel');
      let inquiryPeople = document.getElementById('inquiryPeople');
      let inquiryEmail = document.getElementById('inquiryEmail');
      let inquiryDate = document.getElementById('inquiryDate');
      // let inquiryVoteType = document.getElementsByName('inquiryVoteType');
      let inquiryVoteType = document.querySelectorAll('input[name="inquiryVoteType[]"]');

      if (inquiryVote.value === "") {
        alert('투표명을 입력해주세요.')
        inquiryVote.focus();
        return false;
      }

      if (inquiryGroup.value === "") {
        alert('단체명을 입력해주세요.')
        inquiryGroup.focus();
        return false;
      }

      if (inquiryName.value === "") {
        alert('성함과 직위를 입력해주세요.')
        inquiryName.focus();
        return false;
      }

      if (inquiryTel.value === "") {
        alert('휴대번호 및 유선번호를 입력해 주세요.');
        inquiryTel.focus();
        return false;
      }

      if (inquiryPeople.value === "") {
        alert('인원 수를 입력해 주세요.');
        inquiryPeople.focus();
        return false;
      }

      if (inquiryPeople.value === "") {
        alert('인원 수를 입력해 주세요.');
        inquiryPeople.focus();
        return false;
      }

      if (inquiryEmail.value === "") {
        alert('이메일을 입력해 주세요.');
        inquiryEmail.focus();
        return false;
      }

      if (inquiryDate.value === "") {
        alert('인원 수를 입력해 주세요.');
        inquiryDate.focus();
        return false;
      }

      // 투표방법 체크 여부 확인
      let isVoteTypeChecked = false;
      inquiryVoteType.forEach(checkbox => {
        if (checkbox.checked) {
          isVoteTypeChecked = true;
        }
      });

      if (!isVoteTypeChecked) {
        alert('투표방법을 선택해 주세요.');
        inquiryVoteType[0].focus(); // 첫 번째 체크박스에 포커스
        return false;
      }

      // 약관동의 확인
      let inquiryAgree = document.getElementById('inquiryAgree');

      if (!inquiryAgree.checked) {
        alert('개인정보 수집 및 이용약관에 동의해주세요.')
        inquiryAgree.focus();
        return false;
      }

      if (confirm("등록하시겠습니까?")) {
        const formData = new FormData(document.forms[0]);
        formData.append("mode", "reg");
        $.ajax({
          type: "POST",
          url: "./proc/proc.php",
          processData: false,
          contentType: false,
          data: formData,
          success: function (data) {
            alert(data.message);
            if (data.result === 'YES') {
              location.href = "/child"
            }
          },
          err: function (err) {
            console.log("err:", err)
          }
        })
      }

      //   alert('문의가 접수되었습니다.')
      //  location.href = "/child"
    })
  }
}