(async () => {
  const { EventManager } = ShopbySkin;

  const $fittingStudio = $('fitting-studio'); // 피팅 스튜디오 컴포넌트
  const boardNo = 279883; // 피팅 스튜디오 게시판 번호
  const boardId = 'fittingStudio'; // 피팅 스튜디오 게시판 Id
  const articleNo = 889908; // 캘러웨이 게시글 번호

  // [Jay] 게시글 상세 조회
  const postDetailRes = await callShopApi(
    `/boards/${boardId}/articles/${articleNo}`,
    'GET',
  );

  // [Jay] 게시글 렌더
  const fittingStudioHtml = renderHtml($fittingStudio, postDetailRes.result);
  $fittingStudio.append(fittingStudioHtml);

  EventManager.on('PAGE_LOAD_COMPLETED', () => {
    // [Jay] 반응형 이미지맵 좌표
    $('img[usemap]').rwdImageMaps();
  });

  const ACTION_HANDLER_MAP = {};

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

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

  document.addEventListener('click', clickEventListener);
})();