(() => {
  const { pageHelper, utils, EventManager, constants, actions } = ShopbySkin;
  const { initialize } = pageHelper.productListHelper();
  let urlQueryParams = utils.getQueryParams();
  const productListEl = document.querySelector('product-list-items');

  initialize({
    ...urlQueryParams,
  });

  const productListActionMap = {
    // NOTE: 좋아요버튼 클릭
    PRODUCT_LIKE_BTN: ({ event }) => {
      event?.preventDefault?.();

      const btn = event.target.closest('[shopby-product-no]');
      const productNo = Number(btn.getAttribute('shopby-product-no') ?? 0);

      utils.isSignIn()
        ? EventManager.fire('MUTATE_LIKE_PRODUCT', {
            productNo,
            onSuccess: (like) => {
              like ? btn.classList.add('is-active') : btn.classList.remove('is-active');
            },
          })
        : EventManager.fire('MODAL_CONFIRM_OPEN', {
            message: `로그인하셔야 본 서비스를 이용하실 수 있습니다.`,
            noticeType: constants.NOTICE_MODAL_TYPE.WARNING,
            onConfirm: () => {
              const nextUrl = `${location.origin}/pages/sign-in/sign-in.html`;

              location.href = `${nextUrl}?from=${encodeURIComponent(location.href)}`;
            },
          });
    },
    OPEN_PRODUCT_OPTION_MODAL: ({ event, btn }) => {
      event?.preventDefault?.();

      const btns = event.target.closest('[shopby-product-no]');
      const productNo = Number(btns.getAttribute('shopby-product-no') ?? 0);
      const isSoldOut = utils.convertStringBooleanToBoolean(
        btns.getAttribute('shopby-is-sold-out')
      );

      if (isSoldOut) {
        return;
      }

      if (!utils.isAdultVerified(event)) {
        EventManager.fire('MODAL_CONFIRM_OPEN', {
          message: '성인인증이 필요한 상품입니다.',
          noticeType: constants.NOTICE_MODAL_TYPE.CAUTION,
          onConfirm: () => {
            const nextUrl = `${location.origin}/pages/sign-in/sign-in.html`;

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

        return;
      }

      EventManager.fire('OPEN_LAYER_MODAL', {
        name: 'select-product-option-list',
        title: '옵션 선택',
        isFull: false,
        modalAddClass: 'select-product-option-modal',
        data: {
          productNo,
        },
      });
    },
    MOVE_PRODUCT_DETAIL: ({ event }) => {
      if (!utils.isAdultVerified(event)) {
        EventManager.fire('MODAL_CONFIRM_OPEN', {
          message: '성인인증이 필요한 상품입니다.',
          noticeType: 'CAUTION',
          onConfirm: () => {
            location.href = '/pages/intro/adult-certification.html?go-back=true';
          },
        });
      }
    },
  };

  const clickEventListener = (e) => {
    if (!e?.target) {
      return;
    }

    const btn = e?.target?.closest?.('[shopby-action]') || e?.target?.parentElement?.closest?.('[shopby-action]');
    const action = btn?.getAttribute('shopby-action');

    if (!btn) {
      return;
    }

    productListActionMap[action]?.({
      event: e,
    });
  };

  EventManager.on('PAGE_LOAD_COMPLETED', (commonData) => {
    // 외부스크립트 등록 기능. 삭제금지
    ShopbyExternalScript?.setPageScriptType(urlQueryParams?.keywords ? 'PRODUCT_SEARCH' : 'PRODUCT_LIST');

    document.addEventListener('click', (e) => {
      /* 옵션 클릭 */
      const selectItem = e.target.closest('.fake-select__list li');
      if (selectItem) {
        const wrap = selectItem.closest('.select.select--sm');
        if (!wrap) return;

        const select = wrap.querySelector('select');
        const btn = wrap.querySelector('.fake-select__btn');
        const fake = wrap.querySelector('.fake-select');
        const value = selectItem.dataset.value;

        // 실제 select 변경 → Shopby SEARCH_SIZE
        select.value = value;
        select.dispatchEvent(new Event('change', { bubbles: true }));

        // UI 반영
        btn.textContent = selectItem.textContent;
        fake.querySelectorAll('li').forEach(li => li.classList.remove('is-active'));
        selectItem.classList.add('is-active');

        fake.classList.remove('open');
        return;
      }

      /* 버튼 클릭 */
      const btn = e.target.closest('.fake-select__btn');
      if (btn) {
        e.stopPropagation();
        const fake = btn.closest('.fake-select');
        fake.classList.toggle('open');
        return;
      }

      const btnDepth1 = e.target.closest('.btn_depth1');
      if (!btnDepth1) return;

      const depthWrap = btnDepth1.closest('.depth1_cate');
      if (!depthWrap) return;

      const list = depthWrap.querySelector('.depth1_cate_list');
      if (!list) return;

      document.querySelectorAll('.depth1_cate.is-open').forEach(el => {
        if (el !== depthWrap) el.classList.remove('is-open');
      });
      depthWrap.classList.toggle('is-open');

    });

    //브랜드 전용관 오늘의 특가 노출여부
    const categoryNo = urlQueryParams?.categoryNo;
    const brandSaleBox = document.querySelector('.brand_sale_box');
    if (!brandSaleBox) return;

    brandSaleBox.classList.toggle('is-active', categoryNo === '1170271');

    setTimeout(() => {
      const brandSaleSwiper = new Swiper('.brand_sale_con .swiper', {
        slidesPerView: 3,
        spaceBetween: 17,
        loop: false,
        speed: 500,
        observer: true,
        observeParents: true,
        navigation: {
          nextEl: '.brand_sale_con .swiper-button-next',
          prevEl: '.brand_sale_con .swiper-button-prev',
        },
      });
      /*
      function brandSaleTimer(duration) {
        var timer = duration;
        var initialDuration = duration; // 초기 남은 시간을 저장합니다.
        var interval = setInterval(function() {
            var days = parseInt(timer / 86400, 10);
            var hours = parseInt((timer % 86400) / 3600, 10);
            var minutes = parseInt((timer % 3600) / 60, 10);
            var seconds = parseInt(timer % 60, 10);

            days = days < 10 ? + days : days;
            hours = hours < 10 ? "0" + hours : hours;
            minutes = minutes < 10 ? "0" + minutes : minutes;
            seconds = seconds < 10 ? "0" + seconds : seconds;

            var time_txt = '';
            if (days > 0) {
                time_txt += '<span class="day_view">D-' + days + '</span>';
            }
            time_txt += '<span class="time_view">';

            // 각 숫자를 문자 배열로 변환하여 쪼갬
            time_txt += '<em>' + hours.toString()[0] + '</em><em>' + hours.toString()[1] + '</em><em class="colon">:</em>';
            time_txt += '<em>' + minutes.toString()[0] + '</em><em>' + minutes.toString()[1] + '</em><em class="colon">:</em>';
            time_txt += '<em>' + seconds.toString()[0] + '</em><em>' + seconds.toString()[1] + '</em>';
            time_txt += '</span>';

            $('#displayTimeSaleTime').html(time_txt);

            // 남은 시간 비율 계산 (100%에서 시작)
            var timeSaleDurationRate = (timer / 864000) * 100;
            $('#timeSaleProgress span').css('width', timeSaleDurationRate + '%');

            if (--timer < 0) {
                timer = 0;
                clearInterval(interval);
            }
        }, 1000);
      }
      brandSaleTimer(259200);
      */
    }, 300);

    EventManager.on('QUERY_DISPLAY_CATEGORY', () => {
      function gd_dailyMissionTimer(duration) {
        var timer     = duration;
        var interval  = setInterval(function () {
          var days    = parseInt( timer / 86400        , 10);
          var hours   = parseInt((timer % 86400) / 3600, 10);
          var minutes = parseInt((timer %  3600) /   60, 10);
          var seconds = parseInt( timer %    60        , 10);

          days    = days    < 10 ?       days    : days   ;
          hours   = hours   < 10 ? "0" + hours   : hours  ;
          minutes = minutes < 10 ? "0" + minutes : minutes;
          seconds = seconds < 10 ? "0" + seconds : seconds;

          var time_txt  = '';

          if (days > 0) {
            time_txt += '<span class="day_view">D-' + days + '</span>';
          }

          time_txt += '<span class="time_view">';

          // 각 숫자를 문자 배열로 변환하여 쪼갬
          time_txt += '<em>' + hours  .toString()[0] + '</em><em>' + hours  .toString()[1] + '</em><em class="colon">:</em>';
          time_txt += '<em>' + minutes.toString()[0] + '</em><em>' + minutes.toString()[1] + '</em><em class="colon">:</em>';
          time_txt += '<em>' + seconds.toString()[0] + '</em><em>' + seconds.toString()[1] + '</em>';
          time_txt += '</span>';

          $('#displayTimeSaleTime').html(time_txt);

          // 남은 시간 비율 계산 (100%에서 시작)
          var timeSaleDurationRate = (timer / 864000) * 100;

          $('#timeSaleProgress span').css('width', timeSaleDurationRate + '%');

          if (--timer < 0) {
            timer = 0;

            if (document.querySelector('.main_section.sale_pro_box')) {
              document.querySelector('.main_section.sale_pro_box')?.classList?.add('dn');
            }

            clearInterval(interval);
          }
        }, 1000);
      }

      ShopbySkin.actions.getEventAction().fetchEvents({
        "order.direction": "DESC",
        "order.by": "REGISTER_DATE",
        "progressStatus": "ING",
        "page.size": 1,
        "page.number": 1,
        "keywordInfo.value": "아워홈_TODAY_SALE",
        "keywordInfo.type": "NAME"
      })
      .then((data) => {
        console.log(data);
        if ( data?.data?.contents?.[0] ) {
          const date_s = data.data.contents[0].startYmdt;
          const date_e = data.data.contents[0].endYmdt;
          const now = moment();
          const end = moment(date_e);
          const diff = end.diff(now, 'seconds');

          gd_dailyMissionTimer(diff, 'displayTimeSaleTime');
        }
        else {
          if (document.querySelector('.main_section.sale_pro_box')) {
            document.querySelector('.main_section.sale_pro_box')?.classList?.add('dn');
          }
        }
      });
    });

    let check = true;

    EventManager.on('QUERY_SEARCH_PRODUCTS_BY', (data) => {
      if ( urlQueryParams.sortType === undefined ) {
        // const url   = new URL(location.href);
        // const query = url.searchParams;

        // query.append('sortType', 'MD_RECOMMEND');

        // location.href = `${url.protocol}//${url.host}${url.pathname}?${url.searchParams.toString()}`;

        urlQueryParams.sortType = 'MD_RECOMMEND';
      }
      else {
        urlQueryParams = utils.getQueryParams();
      }

      if ( urlQueryParams.sortType === 'MD_RECOMMEND' ) {
        if ( true === check ) {
          check = false;

          document.querySelectorAll('li.sort-item').forEach((v, k)=>{ v.classList.remove('active') });
          document.querySelector('li.sort-item:has(button[value=MD_RECOMMEND])').classList.add('active');
          document.querySelector("[shopby-products-items]").innerHTML = '';

          const searchParam = {
            ...urlQueryParams,
            "order.by": "MD_RECOMMEND",
            "order.direction": 'ASC',
            pageSize: urlQueryParams.pageSize !== undefined ? urlQueryParams.pageSize : 20,
            pageNumber: urlQueryParams.pageNumber !== undefined ? urlQueryParams.pageNumber : 1,
          };

          if(urlQueryParams.keywords === undefined || urlQueryParams.keywords === ''){
            searchParam.categoryNos = urlQueryParams.categoryNo;
          }

          actions.queryProductsBy(searchParam);
          document.querySelector(".pagination").innerHTML = document.querySelector(".pagination").innerHTML.replaceAll('SALE_CNT', 'MD_RECOMMEND');
        }
      }

      if ( !ShopbySkin.utils.isSignIn() || '93747' == commonData?.profile?.memberGradeNo ) {
        if ( data?.items?.[0] ) {
          data?.items?.forEach((v, k)=>{
            let hasTheIcon = false;

            for ( const icon of ( v.stickerInfos || [] ) ) {
              if ( '점주전용' == icon?.name ) {
                hasTheIcon = true;

                break;
              }
            }

            if ( hasTheIcon ) {
              const itemDom = document.querySelector(`product-list-items .thumb-item[data-product-no="${v.productNo}"]`);

              if ( itemDom ) {
                if ( itemDom?.querySelector('.product-thumb-price-info')?.innerHTML ) {
                  itemDom.querySelector('.product-thumb-price-info').innerHTML = `<p class="no_mem">매장 사업자 전용 상품</p>`;
                }

                itemDom.querySelectorAll('a').forEach((v)=>{
                  v.href = `javascript:alertTheProduct();`;
                });

                if ( itemDom?.querySelector('[shopby-action="OPEN_PRODUCT_OPTION_MODAL"]')?.remove ) {
                  itemDom?.querySelector('[shopby-action="OPEN_PRODUCT_OPTION_MODAL"]')?.remove();
                }
              }
            }
          });
        }
      }

      // 외부스크립트 등록 기능. 삭제금지
      ShopbyExternalScript?.setGlobalObjectSb({
        searchedProduct: {
          ...data,
          items: productListEl.store.state.items,
        },
      });

      if (!urlQueryParams?.categoryNo) {
        ShopbyExternalScript?.setGlobalObjectSb({
          currentCategory: null,
        });
      }
    });
  });

  EventManager.on('QUERY_DISPLAY_CATEGORY', (data) => {
    if ( !document.querySelector('.l-title') ) {
      if ( document.querySelector('.depth1_cate p') ) {
        const elDepth1CateArr = document.querySelectorAll('.depth1_cate p');

        elDepth1CateArr[elDepth1CateArr.length - 1].classList.add('no-after');
        document.querySelector('.popular_pro_wrap').classList.remove('dn');
      }
    }

    // 외부스크립트 등록 기능. 삭제금지
    ShopbyExternalScript?.setGlobalObjectSb({
      currentCategory: data?.currentCategory,
    });
  });

  document.addEventListener('click', clickEventListener);

  EventManager.on('DISPLAY_PRODUCT_CONTENT_LOADED', (dpData) => {
    setTimeout(()=>{
      if ( '1' == urlQueryParams?.depth ) {
        if ( document.querySelector('.depth1_cate p') ) {
          const elDepth1Cate            = document.querySelector('.depth1_cate p');
          const categoryNameWidoutSpace = elDepth1Cate.innerText.replace(/\s/gi, '');
          const sectionId               = dpData?.propsAsString?.shopbySectionId || '' ;
          const menuNick                = sectionId.replace('product-popular-', '');

          if ( true === categoryNameWidoutSpace.includes(menuNick) ) {
            if ( '' == ( document.querySelector(`.popular_pro_wrap.${categoryNameWidoutSpace} [slot=isEmptySection]`)?.innerHTML || '' ).trim() ) {
              document.querySelector(`.popular_pro_wrap.${categoryNameWidoutSpace}`).style.display = '';
            }
          }
        }
      }
    }, 500);
  });
})();



/*
setTimeout(()=>{
  const url         = new URL(location.href);
  const sortType    = url.searchParams.get('sortType'   );
  const direction   = url.searchParams.get('direction'  );
  const pageNumber  = url.searchParams.get('pageNumber' ) ?? '1';

  if ( !sortType || ( 'MD_RECOMMEND' === sortType && 'ASC' === direction && '1' === pageNumber ) ) {
    $('button[value="MD_RECOMMEND"]').click();
  }

  document.body.style.display='';
}, 2000);
*/