let shopbyCommonData = {};
(() => {
  const { EventManager, utils } = ShopbySkin;
  const { isMobileDevice } = utils;

  const headerEl = document.querySelector('shopby-header-v2');

  EventManager.on('PAGE_LOAD_COMPLETED', (commonData) => {
    shopbyCommonData = commonData;
  });

  // 스크롤 이벤트
  let scrolled = false;
  window.addEventListener('scroll', function () {
    if (window.scrollY > 0 && !scrolled) {
      scrolled = true;
      // Trigger your event here
      //console.log('Scroll value is greater than 0!');
      document.querySelector('.header__bottom-line').classList.add('active');
    } else if (window.scrollY === 0 && scrolled) {
      scrolled = false;
      document.querySelector('.header__bottom-line').classList.remove('active');
    }
  });

  // 외부스크립트 등록 기능. 삭제금지
  ShopbyExternalScript?.initialize({
    apiOption: {
      platform: 'PC',
    },
  }).then(() => {
    EventManager.fire('QUERY_PAGE_SCRIPTS', ShopbyExternalScript?.scripts);
  });

  // 클릭이벤트 맵
  // 1. SIGN_OUT : 로그아웃
  const headerActionMap = {
    SIGN_OUT: () => {
      EventManager.fire('SIGN_OUT');
    },
    GO_MY_MENU: (e) => {
      if (!utils.isSignedIn()) {
        e.preventDefault();

        const from = e.target.href;

        const nextUrl = `${location.origin}/pages/sign-in/sign-in.html`;

        location.href = `${nextUrl}?from=${encodeURIComponent(from)}`;
      }
    },
  };

  // 클릭이벤트 핸들러
  const clickEventListener = (e) => {
    const action = e?.target?.closest('[shopby-action]')?.getAttribute('shopby-action');

    headerActionMap[action]?.(e);
  };

  // 상단 카테고리 slider 초기화
  EventManager.on('PAGE_LOAD_COMPLETED', ({ profile }) => {
    EventManager.fire('INIT_CATEGORY_SLIDER', {
      direction: 'horizontal',
      effect: 'slide',
      slidesPerView: 'auto',
      spaceBetween: 20,
    });

    // 외부스크립트 등록 기능. 삭제금지
    ShopbyExternalScript?.setGlobalObjectSb({
      getPlatform: () => (isMobileDevice ? 'MOBILE_WEB' : 'PC'),
      profile,
    });

    // 특정 카테고리 스타일 적용
    document.querySelectorAll('.devCategoryLi > a').forEach((el) => {
      if (el.textContent.trim() === '마스터피스 크리스마스') {
        el.style.fontFamily = 'PyeongchangPeace';
      }
    });

    // 카테고리 드롭다운 데이터 로드
    const categoryLi = document.querySelectorAll('.devCategoryLi');
    if (categoryLi.length > 0) {
      categoryLi.forEach((li) => {
        const categoryNo = li.getAttribute('data-category-no');
        const url = `https://shop-api.e-ncp.com/categories/${categoryNo}`;
        fetch(url, {
          headers: {
            accept: 'application/json',
            version: '1.0',
            clientid: shopbyCommonData.clientId,
            platform: 'PC',
            language: 'ko',
          },
        })
          .then((response) => response.json())
          .then((data) => {
            const children = data?.multiLevelCategories?.[0]?.children;
            children?.forEach((child) => {
              li.querySelector(
                '.cate-dropdown-list'
              ).innerHTML += `<li class="cate-dropdown-item"><a class="cate-dropdown-link" href="/pages/product/product-list.html?categoryNo=${child.categoryNo}">${child.label}</a></li>`;
            });
            if (!children || children.length === 0) {
              li.querySelector('.cate-dropdown').innerHTML = '';
            }
            // 2차 카테고리 'LIMITED EDITION' 스타일 적용
            li.querySelectorAll('.cate-dropdown-link').forEach((link) => {
              if (link.textContent.trim() === 'LIMITED EDITION') {
                link.style.setProperty('font-weight', '600', 'important');
              }
            });
          });
      });
    }

    // 카테고리 더보기/닫기 토글
    const cateToggleBtn = document.getElementById('cateToggleBtn');
    const cateNavContainer = document.querySelector('.cate-nav-container');
    const cateItems = document.querySelectorAll('.cate-item');

    if (cateToggleBtn && cateNavContainer && cateItems.length > 0) {
      // 첫번째 줄 기준 offsetTop 구하기
      const firstRowTop = cateItems[0].offsetTop;
      let hasSecondRow = false;

      // 두번째 줄 아이템에 hidden-row 클래스 추가
      cateItems.forEach((item) => {
        if (item.offsetTop > firstRowTop) {
          item.classList.add('hidden-row');
          hasSecondRow = true;
        }
      });

      // 두번째 줄이 없으면 버튼 숨기기
      if (!hasSecondRow) {
        cateToggleBtn.style.display = 'none';
      }

      cateToggleBtn.addEventListener('click', () => {
        cateNavContainer.classList.toggle('expanded');
        cateToggleBtn.textContent = cateNavContainer.classList.contains('expanded')
          ? '닫기'
          : '더보기';
      });
    }
  });

  headerEl?.addEventListener('click', clickEventListener);

  const searchParams = new URLSearchParams(location.search);
  const trackingKey = searchParams.get('trackingKey');
  const channelType = searchParams.get('channelType');

  const { setTrackingKey, setChannelType } = ShopbySkin.utils;
  setTrackingKey(trackingKey);
  setChannelType(channelType);

  const navMenuBtn = document.querySelector('.nav__all-menu-btn');
  if (navMenuBtn) {
    navMenuBtn.addEventListener('click', function () {
      this.classList.toggle('active');
    });
  }

  // 상단 세로 슬라이드 배너 Swiper 초기화
  EventManager.on('PAGE_LOAD_COMPLETED', () => {
    // Swiper가 정의되어 있는지 확인 후 초기화
    if (typeof Swiper !== 'undefined' && document.querySelector('.top-banner-swiper')) {
      const topBannerSwiper = new Swiper('.top-banner-swiper', {
        direction: 'vertical',
        loop: true,
        autoplay: {
          delay: 3000,
          disableOnInteraction: false,
        },
        speed: 500,
        slidesPerView: 1,
        spaceBetween: 0,
      });
    }
  });
})();

/* 기존 setTimeout 주석처리
setTimeout(() => {
  // lnb동작
  const firstUl = document.querySelector('.first_ul');
  const depth1Box = document.querySelector('.depth1_box');
  const navMenuBtn = document.querySelector('.nav__all-menu-btn');
  const gnbAllmenuBox = document.querySelector('.gnb_allmenu_box');

  let isMouseOverDiv = false;
  let currentLi = null;

  firstUl.addEventListener('mouseover', (e) => {
    if (e.target.parentNode.tagName === 'LI') {
      const li = e.target.parentNode;
      if (currentLi !== li) {
        if (currentLi) {
          currentLi.classList.remove('on');
        }
        currentLi = li;
        li.classList.add('on');
        const index = Array.prototype.indexOf.call(firstUl.children, li);
        const depth1Divs = depth1Box.children;
        for (let i = 0; i < depth1Divs.length; i++) {
          if (i === index) {
            if (depth1Divs[i].innerHTML.trim() !== '') {
              depth1Divs[i].style.display = 'block';
            } else {
              depth1Divs[i].style.display = 'none';
            }
          } else {
            depth1Divs[i].style.display = 'none';
          }
        }
      }
    }
  });

  depth1Box.addEventListener('mouseover', (e) => {
    if (e.target.tagName === 'DIV') {
      isMouseOverDiv = true;
      if (currentLi) {
        currentLi.classList.add('on');
      }
    }
  });

  depth1Box.addEventListener('mouseout', () => {
    isMouseOverDiv = false;
  });

  gnbAllmenuBox.addEventListener('mouseleave', (e) => {
    if (e.relatedTarget && e.relatedTarget.parentNode === depth1Box) {
      isMouseOverDiv = true;
    } else {
      if (currentLi) {
        currentLi.classList.remove('on');
      }
      currentLi = null;
      const depth1Divs = depth1Box.children;
      for (let i = 0; i < depth1Divs.length; i++) {
        depth1Divs[i].style.display = 'none';
      }
      isMouseOverDiv = false;
    }
  });

  const categoryLi = document.querySelectorAll('.devCategoryLi');
  if (categoryLi.length > 0) {
    categoryLi.forEach((li) => {
      const categoryNo = li.getAttribute('data-category-no');
      const url = `https://shop-api.e-ncp.com/categories/${categoryNo}`;
      fetch(url, {
        headers: {
          accept: 'application/json',
          version: '1.0',
          clientid: shopbyCommonData.clientId,
          platform: 'PC',
          language: 'ko',
        },
      })
        .then((response) => response.json())
        .then((data) => {
          const children = data?.multiLevelCategories?.[0]?.children;
          children?.forEach((child) => {
            li.querySelector('div ul').innerHTML +=
              `<li><a class="" href="/pages/product/product-list.html?categoryNo=${child.categoryNo}">${child.label}</a></li>`;
          });
          if (children?.length > 0) {
          } else {
            li.querySelector('div').innerHTML = '';
          }
        });
    });
  }
}, 1000);
*/

// 새로운 setTimeout - 개별 클래스 적용
setTimeout(() => {
  // lnb동작
  const firstUl = document.querySelector('.first_ul');
  const depth1Box = document.querySelector('.depth1_box');
  const navMenuBtn = document.querySelector('.nav__all-menu-btn');
  const gnbAllmenuBox = document.querySelector('.gnb_allmenu_box');

  let isMouseOverDiv = false;
  let currentLi = null;

  firstUl.addEventListener('mouseover', (e) => {
    if (e.target.parentNode.tagName === 'LI') {
      const li = e.target.parentNode;
      if (currentLi !== li) {
        if (currentLi) {
          currentLi.classList.remove('on');
        }
        currentLi = li;
        li.classList.add('on');
        const index = Array.prototype.indexOf.call(firstUl.children, li);
        const depth1Divs = depth1Box.children;
        for (let i = 0; i < depth1Divs.length; i++) {
          if (i === index) {
            if (depth1Divs[i].innerHTML.trim() !== '') {
              depth1Divs[i].style.display = 'block';
            } else {
              depth1Divs[i].style.display = 'none';
            }
          } else {
            depth1Divs[i].style.display = 'none';
          }
        }
      }
    }
  });

  depth1Box.addEventListener('mouseover', (e) => {
    if (e.target.tagName === 'DIV') {
      isMouseOverDiv = true;
      if (currentLi) {
        currentLi.classList.add('on');
      }
    }
  });

  depth1Box.addEventListener('mouseout', () => {
    isMouseOverDiv = false;
  });

  gnbAllmenuBox.addEventListener('mouseleave', (e) => {
    if (e.relatedTarget && e.relatedTarget.parentNode === depth1Box) {
      isMouseOverDiv = true;
    } else {
      if (currentLi) {
        currentLi.classList.remove('on');
      }
      currentLi = null;
      const depth1Divs = depth1Box.children;
      for (let i = 0; i < depth1Divs.length; i++) {
        depth1Divs[i].style.display = 'none';
      }
      isMouseOverDiv = false;
    }
  });

  /* 카테고리 드롭다운 로드 - PAGE_LOAD_COMPLETED로 이동함
  const categoryLi = document.querySelectorAll('.devCategoryLi');
  if (categoryLi.length > 0) {
    categoryLi.forEach((li) => {
      const categoryNo = li.getAttribute('data-category-no');
      const url = `https://shop-api.e-ncp.com/categories/${categoryNo}`;
      fetch(url, {
        headers: {
          accept: 'application/json',
          version: '1.0',
          clientid: shopbyCommonData.clientId,
          platform: 'PC',
          language: 'ko',
        },
      })
        .then((response) => response.json())
        .then((data) => {
          const children = data?.multiLevelCategories?.[0]?.children;
          children?.forEach((child) => {
            li.querySelector('.cate-dropdown-list').innerHTML +=
              `<li class="cate-dropdown-item"><a class="cate-dropdown-link" href="/pages/product/product-list.html?categoryNo=${child.categoryNo}">${child.label}</a></li>`;
          });
          if (children?.length > 0) {
          } else {
            li.querySelector('.cate-dropdown').innerHTML = '';
          }
        });
    });
  }
  */
}, 500);