(() => {
  const { EventManager, utils, actions } = ShopbySkin;
  const { setGlobalsVariableBy, isMobileDevice } = utils;

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

  function getCookie(name) {
    const value = `; ${document.cookie}`;
    const parts = value.split(`; ${name}=`);
    if (parts.length === 2) return parts.pop().split(";").shift();
    return null;
  }

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

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

  const headerTopList1 = [
    { action: null, text: "모의고사", link: null, id: 1 },
    {
      action: null,
      text: "교재",
      link: null,
      id: 2,
    },
    {
      action: null,
      text: "입시정보",
      link: null,
      id: 3,
    },
    {
      action: null,
      text: "고객지원",
      link: null,
      id: 4,
    },
    {
      action: null,
      text: "응시 / 성적조회",
      link: DSDOENV.ApiConfig.EXAM_SYSTEM,
      id: 5,
      target: "_blank",
    },
  ];

  const category1 = [
    {
      title: "모의고사 라인업",
      link: "/pages/mock-test/lineup/lineup-detail.html",
    },
    {
      title: "THE PREMIUM",
      link: "/pages/mock-test/premium/premium-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_THE_PREMIUM,
    },
    {
      title: "D모의고사 패키지",
      link: "/pages/mock-test/D_mock_package/D_mock_package-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_DMOCK_PACKAGE,
    },
    {
      title: "D.ARCHIVE",
      link: "/pages/mock-test/D_archive/D_archive-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_DARCHIVE,
    },
    {
      title: "D.FINE",
      link: "/pages/mock-test/D_fine/D_fine-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_DFINE,
    },
    {
      title: "D.FINE FINAL",
      link: "/pages/mock-test/D_fine_final/D_fine_final-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_DFINE_FINAL,
    },
    {
      title: "D.CODE",
      link: "/pages/mock-test/D_code/D_code-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_DCODE,
    },
    {
      title: "D.LINK",
      link: "/pages/mock-test/D_archive/D_archive-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_DLINK,
    },
    {
      title: "CONSTANT",
      link: "/pages/mock-test/constant/constant-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_CONSTANT,
    },


  ];

  const category2 = [
    {
      title: "교재 라인업",
      link: "/pages/textbook/lineup/lineup-detail.html",
    },
    {
      title: "더풂",
      link: "/pages/textbook/thepoom/thepoom-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_THEP,
    },
    {
      title: "수학의 원리",
      link: "/pages/textbook/principleOfMath/principleOfMath-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_MATH,
    },
    {
      title: "D:VOCA",
      link: "/pages/textbook/D_voca/D_voca-detail.html?event=" + DSDOENV.EventConfig.EVENT_NO_DVOCA,
    },
    {
      title: "D:VOCA 출제마법사",
      link: DSDOENV.ApiConfig.VOCA_SYSTEM + `/login?memberNo=${getCookie("memberNo")}`,
      isLogin: true,
      isBlank: true,
    }
  ];

  const category3 = [
    {
      title: "입시 일정",
      link: "/pages/board/post-list-date.html?boardNo=281791&articleNo=917093",
    },
    {
      title: "입시 소식",
      link: "/pages/board/post-list.html?boardType=ipsi&categoryNo=01",
    },
    {
      title: "입시자료",
      link: "/pages/board/post-list-category.html?boardType=ipsi",
    },
    {
      title: "대학/학과 코드 검색",
      link: "/pages/board/university-department-code-search.html",
    }
    // {
    //   title: "평가원•교육청 기출자료실",
    //   link: "/pages/board/post-list.html?boardType=mock-test",
    // },
  ];

  const category4 = [
    {
      title: "혜택/이벤트",
      link: "/pages/event/event-list.html?eventYn=Y",
    },
    {
      title: "공지사항",
      link: "/pages/board/post-list.html?boardType=notice",
    },
    {
      title: "자주하는 질문",
      link: "/pages/board/post-list-faq.html?boardType=faq",
    },
    {
      title: "자료실",
      link: "/pages/board/post-list-category.html?boardType=data",
    },
    {
      title: "정오표",
      link: "/pages/board/post-list-category.html?boardType=ox",
    },
    {
      title: "특약점 안내",
      link: "/pages/special-list/special-list.html",
    },
    {
      title: "콘텐츠 도입문의",
      link: "/pages/board/content-inquiry.html",
    },
    {
      title: "현장 응시 학원 안내",
      link: "/pages/board/offline-exam-academy.html",
    }
  ];

  const createHeaderList1 = () => {
    const headerTop = document.querySelector(".header-top-list-1");

    const categoryMap = {
      1: category1,
      2: category2,
      3: category3,
      4: category4,
    };

    // 하위 메뉴 생성 함수
    const createCategoryBox = (category, id) => {
      const categoryBox = document.createElement("div");
      categoryBox.classList.add("mock-test-box");
      categoryBox.style.display = "none";
      categoryBox.style.position = "absolute";
      categoryBox.style.top = "100%";
      categoryBox.style.left = "50%";
      categoryBox.style.transform = "translateX(-50%)";
      categoryBox.style.backgroundColor = "white";
      categoryBox.style.paddingTop = "10px";
      categoryBox.style.zIndex = "10";

      category.forEach((mockItem, idx) => {
        const unit = document.createElement("div");
        unit.classList.add("unit");

        /*if (id == 0 && idx == 6) {
          unit.style.color = "red";
        }*/

        // 클릭 이벤트 추가: 링크가 있으면 이동
        unit.addEventListener("click", () => {
          if (mockItem.isLogin) {
            if (!utils.isSignIn()) {
              EventManager.fire("MODAL_ALERT_OPEN", {
                noticeType: "CAUTION",
                message: "<em>로그인 후 이용할 수 있습니다.</em>",
                onClose: redirectLoginPage,
              });
            } else {
              const memberNo = getCookie("memberNo");

              if(!memberNo) {
                EventManager.fire("MODAL_ALERT_OPEN", {
                    noticeType: "CAUTION",
                    message: "<em>로그인 후 이용할 수 있습니다.</em>",
                    onClose: actions.postSignOut,
                });
              }

              if (mockItem.link) {
                if (mockItem.isBlank) {
                  window.open(mockItem.link, "_blank");
                } else {
                  window.location.href = mockItem.link; // 링크로 이동
                }
              }
            }
          } else {
            if (mockItem.link) {
              window.location.href = mockItem.link; // 링크로 이동
            }
          }
        });

        unit.textContent = mockItem.title;

        if (mockItem.title === "HALF") {
          const badge = document.createElement("span");
          badge.classList.add("menu-text-badge");
          badge.textContent = "N";

          unit.prepend(badge);
        }
        categoryBox.appendChild(unit);
      });

      return categoryBox;
    };

    headerTopList1.forEach((item, idx) => {
      const divLink = document.createElement("div");
      divLink.classList.add("header-top-link");

      if (item.action) {
        divLink.setAttribute("shopby-action", item.action);
      }

      if (item?.target) {
        divLink.setAttribute("target", item.target);
        divLink.onclick = () => {
          if (!utils.isSignIn()) {
            EventManager.fire("MODAL_ALERT_OPEN", {
              noticeType: "CAUTION",
              message: "<em>로그인 후 이용할 수 있습니다.</em>",
              onClose: redirectLoginPage,
            });
          } else {
            window.open(item.link, item.target);
          }
        };
      }

      divLink.textContent = item.text;
      divLink.style.position = "relative";

      // id가 categoryMap에 있는 경우 처리
      if (categoryMap[item?.id]) {
        const categoryBox = createCategoryBox(categoryMap[item.id], idx);
        divLink.appendChild(categoryBox);
        divLink.addEventListener("mouseenter", () => {
          categoryBox.style.display = "block";
        });

        divLink.addEventListener("mouseleave", () => {
          categoryBox.style.display = "none";
        });
      }

      headerTop.appendChild(divLink);
    });
  };

  if (headerEl) {
    headerEl.style.width = "100%";
    headerEl.style.minWidth = "1400px"; // Set the minimum width to 300px
  }

  // 클릭이벤트 맵
  // 1. SIGN_OUT : 로그아웃
  const headerActionMap = {
    SIGN_OUT: () => {
      localStorage.removeItem("mash-up-token");

      localStorage.removeItem("memberNo"); // memberNo 로컬 스토리지 삭제
      document.cookie =  `memberNo=; expires=${new Date(0)}; path=/; domain=.dsdo.co.kr;`; // memberNo 쿠키 삭제

      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,
    });

    setGlobalsVariableBy("getPlatform", () =>
      isMobileDevice ? "MOBILE_WEB" : "PC"
    );
    setGlobalsVariableBy("profile", profile);
    createHeaderList1();
    // createHeaderList2();
    // 카테고리 Hover Class 적용
  });

  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);
})();