(async () => {
  const { utils } = ShopbySkin;
  const $offlineStoreImageList = $('offline-store-image-list'); // 오프라인 스토어 이미지 리스트
  const $offlineStoreInfo = $('offline-store-info'); // 오프라인 스토어 정보
  let mapOption = {};
  const storeSno = getUrlParam('storeSno'); // 매장 번호

  // [Aaron] 오프라인 매장 조회 API
  const param = {
    method: 'GET',
  };

  // 테스트용 - 에이샵 매장 Api 조회(임시)
  const { result: storeData, statusCode: storeStatusCode } = await callGeekApi(
    `/app/sbgolf-shop/${storeSno}`,
    param,
  );

  if (storeStatusCode >= 400) {
    ShopbySkin.EventManager.fire('MODAL_ALERT_OPEN', {
      noticeType: 'CAUTION',
      message: '<em>매장 정보를 찾을 수 없습니다.</em>',
      onClose: () => {
        document.location.href = '/pages/service/offline-store.html';
      },
    });
    return;
  }

  storeData.additionalInfo = JSON.parse(storeData.additionalInfo);

  if (storeData?.additionalInfo?.offlineStoreImage) {
    storeData.additionalInfo.offlineStoreImage =
      storeData?.additionalInfo?.offlineStoreImage.filter((data) => {
        return data.type === 'slider';
      });
  }

  // [Aaron] 오프라인 스토어 이미지 리스트 렌더
  const offlineStoreImageListHtml = renderHtml(
    $offlineStoreImageList,
    storeData,
  );
  $offlineStoreImageList.append(offlineStoreImageListHtml);
  $offlineStoreImageList.velocity({ opacity: 1 }, { duration: 500 });
  // END

  // [Aaron] 오프라인 스토어 정보 렌더
  detailKakaoMap(storeData.sno, storeData.lat, storeData.lng);

  // [Aaron] 태그 배열화
  storeData.tag = storeData.tag.split(',').map((data) => data.trim());

  const offlineStoreInfo = renderHtml($offlineStoreInfo, storeData);
  $offlineStoreInfo.append(offlineStoreInfo);

  $offlineStoreInfo.velocity({ opacity: 1 }, { duration: 500 });

  // END

  /**
   * [Aaron] 매장 상세 지도 생성
   * @param shopSno // 매장 번호
   * @param lat
   * @param lng
   */
  function detailKakaoMap(shopSno, lat, lng) {
    const mapContainer = document.getElementById('map'); // 지도를 표시할 div
    // 기존에 생성된 map 제거

    mapOption = {
      center: new kakao.maps.LatLng(lat, lng), // 지도의 중심좌표
      level: 2,
    };

    // 지도 생성
    const map = new kakao.maps.Map(mapContainer, mapOption);
    const position = new kakao.maps.LatLng(lat, lng);

    // 마커 이미지 설정
    const markerImageSrc = '/assets/images/geek/ico_location.svg';
    const markerImageSize = new kakao.maps.Size(30, 30);
    const markerImageOption = { offset: new kakao.maps.Point(20, 40) };
    const markerImage = new kakao.maps.MarkerImage(
      markerImageSrc,
      markerImageSize,
      markerImageOption,
    );

    const marker = new kakao.maps.Marker({
      position: position,
      image: markerImage,
    });

    // 지도 중심 이동
    map.setCenter(position);
    // 마커 표시
    marker.setMap(map);

    if (!shopSno) return;

    // [Jay] 매장 영업시간 '/' 문자로 줄바꿈 처리를 위해 배열로 변환
    /*
    const iwContent = `<div style="padding:5px;">${currentData[0].address}<br>
          <a href="https://map.kakao.com/link/map/${currentData[0].address},${lat},${lng}" style="color:blue" target="_blank">큰지도보기</a>
          <a href="https://map.kakao.com/link/to/${currentData[0].address},${lat},${lng}" style="color:blue" target="_blank">길찾기</a>
        </div>`;
   */
    const iwContent = `${storeData.shopName}`;
    const iwPosition = new kakao.maps.LatLng(lat, lng); // 인포윈도우 표시 위치

    var content =
      '<div class="customoverlay">' + '' + iwContent + '' + '</div>';

    // 인포윈도우를 생성합니다
    new kakao.maps.CustomOverlay({
      map: map,
      position: iwPosition,
      content: content,
      yAnchor: 1,
    });
  }

  // 지도 확대
  function onClickZoomIn() {
    map.setLevel(map.getLevel() - 1);
  }

  // 지도 축소
  function onClickZoomOut() {
    map.setLevel(map.getLevel() + 1);
  }

  const offlineStoreDetailSmallSlideOption = {
    id: 'offline-store-detail__small_slide',
    direction: 'horizontal',
    effect: 'slide',
    slidesPerView: 6,
    spaceBetween: 10,
    navigation: {
      nextEl: '.btn-swip.next',
      prevEl: '.btn-swip.prev',
    },
  };

  utils.initSwiper(offlineStoreDetailSmallSlideOption);

  $offlineStoreImageList.on('click', '.store-list-item', ({ target }) => {
    const src = target.getAttribute('src');
    $('.thumb-big').find('.store-image-thumb').attr('src', src);
    $(target).parents('li').addClass('active').siblings().removeClass('active')
  });
})();