/*
 * © NHN Commerce Corp. All rights reserved.
 * NHN Corp. PROPRIETARY/CONFIDENTIAL. Use is subject to license terms.
 *
 * @author Bomee Yoon
 * @author Eunbi Kim
 * @since 2021-6-23
 */

$(() => {
  const { getUrlParam } = shopby.utils;
  const $searchBoxOrCategoryBoxArea = $('#searchBoxOrCategoryBoxArea');
  const $categorySelector = $('#categorySelector');
  const $categoryList = $('#categoryList'); //24.05.10 seet3 추가
  const $selectedCategoryTit = $('#selectedCategoryTit');
  const sectionId = getUrlParam('sectionId');
  const keyword = getUrlParam('keyword');
  const depth = getUrlParam('depth');
  shopby.product.list = {
    async initiate() {
      await this.productList.initiate();
      if (sectionId || keyword) return;            
      this.category.initiate();
    },   

    getCurrentDepthCategories() {
      return this.productList.getCurrentDepthCategories.call(this.productList);
    },

    category: {
      data: {
        categories: [],
        selectedCategoryTit: '',
        selectedChildCategories: [],
        category: [],        
      },
      memberGroupNo: null,
      async initiate() {
        //로그인 여부
        const logined = shopby.logined();
        if(logined){
          await this.memberGroupsData();
        }  

        this.setData();
        this.render();
        this.bindEvents();        
      },
      setData() {
        this.setCategoryData();
        this.setProductCount();
      },
      render() {
        const { categories, selectedCategoryTit, selectedChildCategories ,currentCategoryNo } = this.data;
        $categorySelector.render({ categories });
        //$selectedCategoryTit.render({ selectedCategoryTit });
        $searchBoxOrCategoryBoxArea.render({ selectedChildCategories });

        //24.05.10 seet3 추가
        if(shopby.localStorage.getItem('category') && depth != ''){
          
          this.data.selectedChildCategories = shopby.localStorage.getItem('category');
          const name = 'categoryNo';
          const searchParams = new URLSearchParams(window.location.search);
          const categoryNo = Number(searchParams.get(name));
          this.data.selectedChildCategories = this.data.selectedChildCategories.map((child,index) => {
            if(Number(getUrlParam('depth'))){ 
              if (child.categoryNo === categoryNo) {
                child.isOn = true;  
              }else{
                child.isOn = false;  
              }
            }else{
              if(index == 0){
                child.isOn = true;  
              }
            }  
            return child;
          });
          const selectedChildCategories = this.data.selectedChildCategories;
          $categoryList.render({selectedChildCategories}); 
        }else{
          $categoryList.render({ selectedChildCategories }); 
        }

        const selectedLabel = categories[0].selectedLabel;
        $selectedCategoryTit.render({ selectedLabel });
        
      },
      bindEvents() {
        $('.location_select').on('mouseenter mouseleave', this.events.toggle);
        // $('.btn_glist_cart').on('click', this.events.onClickAddCarts);
        $('.btn_glist_cart').on('click', this.events.onClickCartBtn);
        if(this.memberGroupNo){
          $('.btn_glist_order').on('click',  (target) => {
            this.onClickBuyBtn(target, this.memberGroupNo,shopby.localStorage.getItem('categoryChk'));
          });
        }else{
          $('.btn_glist_order').on('click', this.events.onClickBuyBtn);
        }
        
        this.events.hide.call(this);
      },

      events: {
        toggle() {
          $(this).find('.location_tit').toggleClass('active');
          $(this).find('ul').stop().slideToggle('fast');
        },
        hide() {
          !this.data.selectedChildCategories ||
            (!this.data.selectedChildCategories.length && $searchBoxOrCategoryBoxArea.hide());
        },
        // onClickAddCarts(){
        //   shopby.popup('product-cart', {}, async data => {
        //     $('body').removeClass('popup-open');
        //   });
        // },
        onClickCartBtn({ target }) {
          shopby.popup('product-cart', { productNo: $(target).closest('li').data('product-no') });
          //shopby.popup('cart-product-option', { productNo: $(target).closest('li').data('product-no') });
        },
        onClickBuyBtn({target}) {
          shopby.popup('product-cart', { productNo: $(target).closest('li').data('product-no'),type:'buy',categoryNo:shopby.localStorage.getItem('categoryChk')  });
        },
      },

      onClickBuyBtn(event, memberGroupNo,categoryNo) {
        console.log(categoryNo)

        if(memberGroupNo == 4370 &&  categoryNo == 689189){
          alert('개인회원만 렌탈 신청이 가능합니다. 고객센터로 문의 주세요.');
          return;
        }
        shopby.popup('product-cart', { productNo: $(event.target).closest('li').data('product-no'),type:'buy',categoryNo:categoryNo });
      },

      async memberGroupsData() {
        const profile = await shopby.api.member.getProfile();
        try {
          this.memberGroupNo = profile.data.memberGroups[0].memberGroupNo;
        } catch (e) {
          this.memberGroupNo = null;
          console.error(e);
        }      
      },

      // setCategoryData() {
      //   const name = 'categoryNo';
      //   const searchParams = new URLSearchParams(window.location.search);

      //   if (searchParams.has(name) && Boolean(searchParams.get(name))) {
      //     const { multiLevelCategories } = shopby.cache.getCategories();
      //     const categoryNo = Number(searchParams.get(name));
      //     const selectData = this._getSelectData(categoryNo, multiLevelCategories, [
      //       { children: multiLevelCategories },
      //     ]) || { category: null, parents: [] };

      //     const { parents, category } = selectData;
      //     this.data.categories = parents;
      //     this.data.selectedCategoryTit = category.label;
      //     this.data.selectedChildCategories = category.children;
      //     this.data.currentCategory = category;
         
      //   }
      // },
      setCategoryData() {
        const name = 'categoryNo';
        const searchParams = new URLSearchParams(window.location.search);

        if (searchParams.has(name) && Boolean(searchParams.get(name))) {
          const { multiLevelCategories } = shopby.cache.getCategories();
          const categoryNo = Number(searchParams.get(name));
          const selectData = this._getSelectData(categoryNo, multiLevelCategories, [
            { children: multiLevelCategories },
          ]) || { category: null, parents: [] };
          const { parents, category } = selectData;
          this.data.categories = parents;
          if(category !== null){
            this.data.selectedCategoryTit = category.label;
            this.data.selectedChildCategories = category.children;
          }
          this.data.currentCategoryNo = categoryNo;
          this.data.currentCategory = category;              
          
          if(category !== null){
            // 현재 카테고리의 상위 카테고리를 찾기
            const parentCategory = parents.length > 0 ? parents[parents.length - 1] : null;
            // 상위 카테고리의 모든 하위 카테고리(현재 카테고리를 포함한 형제 카테고리들)를 설정함
            if (parentCategory && parentCategory.children && category.children) {
               //24.05.08 seet3 수정
              this.data.selectedChildCategories = category.children.map((child,index) => {
                if(Number(getUrlParam('depth'))){ 
                  if (child.categoryNo === categoryNo) {
                    child.isOn = true;  // 현재 선택된 카테고리에 'isOn' 속성 추가
                  }
                }else{
                  if(index == 0){
                    child.isOn = true;  
                  }
                }  
                 //24.05.08 seet3 수정 끝 
                return child;
              });
            } else {
              // 상위 카테고리가 없을 경우(즉, 최상위 카테고리일 경우), 현재 카테고리 자체가 유일한 카테고리
              this.data.selectedChildCategories = [category];
              this.data.selectedChildCategories[0].isOn = true;  // 최상위 카테고리일 경우 자기 자신에 'isOn' 속성 추가
            }
          }
        }
      }
      ,
      async setProductCount() {
        const { selectedChildCategories } = this.data;
        const currentCategories = shopby.product.list.getCurrentDepthCategories();
        this.data.selectedChildCategories = selectedChildCategories.map(category => {
          const found =
            currentCategories && currentCategories.find(({ categoryNo }) => categoryNo === category.categoryNo);
          category.productCount = found ? found.count : 0;
          return category;
        });
        if(depth ==''){
          shopby.localStorage.setItem('category', this.data.selectedChildCategories);
        }
      },

      _getSelectData(categoryNo, categoryList, parents) {
        const { length } = categoryList;
        const PARENTS_LAST_INDEX = parents.length - 1;

        for (let i = 0; i < length; i += 1) {
          const category = categoryList[i];
          const { label, categoryNo: no, children } = category;

          parents[PARENTS_LAST_INDEX].selectedLabel = label;

          if (categoryNo === no) {
            return { category, parents };
          }

          if (children && children.length > 0) {
            parents.push(category);
            const result = this._getSelectData(categoryNo, children, parents);

            if (result) {
              return result;
            }
          }

          if (i === length - 1) {
            parents.splice(PARENTS_LAST_INDEX, 1);
          }                   
        }
      },
    },
    productList: {
      page: shopby.pagination,
      $productList: $('#productList'),
      data: {
        productInfo: null,
        productsSearchSummary: null,
        categories: shopby.cache.getCategories(),
        title: null,
        totalCount: 0,
        orderDirection: 'DESC',
        productList: [],
        sorting: {},
        searchWord: null,        
        message: '진열중인 상품이 없습니다.',
        page: getUrlParam('page', 1),
        pageSize: getUrlParam('pageSize', 20),
        orderBy: getUrlParam('orderBy', 'sale_cnt'),
        brandNo: getUrlParam('brandNo'),
        keyword: [
          getUrlParam('width'      ),
          getUrlParam('aspectRatio'),
          getUrlParam('rim'        ),
        ].join(' '),
        keywordInResult: getUrlParam('keywordInResult'),
        listType: getUrlParam('type', 'gallery'),
        categoryNo: getUrlParam('categoryNo'),
        categoryChk: null,
      },
      async initiate() {
        this.page = new shopby.pagination(this.paginationCallback.bind(this), '#pagination', this.data.pageSize);
        await this.setData();
        this.render();
        this.bindEvents();
      },
      async setData() {
        const { keyword, keywordInResult } = this.data;
        this.data.searchWord = keywordInResult ? keywordInResult : keyword;
        //24.05.30 seet3 추가
        const { multiLevelCategories } = shopby.cache.getCategories();       
        for(let i =0; i <multiLevelCategories.length; i++){
          if(getUrlParam('depth')){
            for(let j =0; j < multiLevelCategories[i].children.length; j++){
              if(multiLevelCategories[i].children[j].categoryNo == this.data.categoryNo){
                this.data.categoryChk =multiLevelCategories[i].categoryNo;
              }
            }
          }else{
            for(let j =0; j < multiLevelCategories[i].children.length; j++){
              if(multiLevelCategories[i].categoryNo == this.data.categoryNo){
                this.data.categoryChk =multiLevelCategories[i].categoryNo;
              }
            }
          }          
        }
        shopby.localStorage.setItem('categoryChk', this.data.categoryChk);
        //24.05.30 seet3 추가끝

        if (!sectionId) {
          await this.fetchProductList();
          await this.fetchProductsSearchSummary();
        } else {
          await this.fetchMainSection();
        }          

        this.data.productList.forEach(
          product => (product.calculatedSalePrice = shopby.utils.getDisplayProductPrice(product)),
        );
        this.setSortingData();
      },
      render() {
        const { productList, searchWord, keyword, totalCount } = this.data;
        this.page.render(totalCount);
        $('#searchResult').render({ searchWord, keyword, totalCount });
        if (this.data.keyword !== '') {
          this.keywordRender();
        }
        if (sectionId) {
          this.sectionRender();
        }
        this.$productList.render({ productList, message: this.data.message });
        this.setPageSize();

        //PC버전만 상품명 대괄호 이후 줄바꿈 적용 
        var itemNames = document.querySelectorAll('.item_name');
        itemNames.forEach(function(itemnames) {
            var text = itemnames.innerHTML;
            var splitIndex = text.indexOf(']') + 1;
            if (splitIndex > 0) {
              var firstPart = text.slice(0, splitIndex);
              var secondPart = text.slice(splitIndex).trim();
              itemnames.innerHTML = firstPart + '<br>' + secondPart;
            }
        });
      },
      bindEvents() {
        $('#productSorting').on('change', this.onChangeProductSorting.bind(this));
        this.$productList.on('click', '#wishBtn', this.onClickWishBtn.bind(this));
        $('.btn_goods_search').on('click', this.onClickKeywordInResultBtn.bind(this));
      },
      keywordRender() {
        this.data.message = '검색결과가 없습니다.';
        const searchBoxTemplate = this.getSearchBoxTemplate();
        $searchBoxOrCategoryBoxArea.html(searchBoxTemplate).attr('class', 'search_form_box');
        $categorySelector.hide();
        $selectedCategoryTit.hide();
      },
      sectionRender() {
        $selectedCategoryTit.render({ selectedCategoryTit: this.data.title });
        $categorySelector.hide();
        //$searchBoxOrCategoryBoxArea.hide();
      },
      getCurrentDepthCategories() {
        const depth = Number(getUrlParam('depth')) || 1;
        const categoryNo = shopby.localStorage.getItem('categoryChk');
        const key = `depth${depth + 1}Categories`;
        return (
          this.data.productsSearchSummary[key] &&
          this.data.productsSearchSummary[key].filter(({ parentCategoryNo }) => parentCategoryNo === categoryNo)
        );
      },      
      async fetchProductList() {
        const { direction, order } = this.mapSortingParams(this.data.orderBy);
        try {
          const queryString = {
            pageNumber: this.data.page,
            pageSize: this.data.pageSize,
            categoryNos: this.data.categoryNo,
            'order.direction': direction,
            'order.by': order,
            hasTotalCount: true,
            'filter.keywords': this.data.keyword,
            'filter.keywordInResult': this.data.keywordInResult,
            'filter.saleStatus': 'ALL_CONDITIONS',
            'filter.soldout': true,
          };
          const { data } = await shopby.api.product.getProductsSearch({ queryString });
          if (queryString['filter.keywords']) {
            shopby.setGlobalVariableBy('PRODUCT_SEARCH', data);
          } else {
            shopby.setGlobalVariableBy('PRODUCT_LIST', data);
          }        

          //24.05.13 seet3 추가
          for(let i =0; i < data.items.length; i++){
            if(data.items[i].immediateDiscountAmt){
              data.items[i].rate = Math.round((Number(data.items[i].immediateDiscountAmt)/Number(data.items[i].salePrice))*100);             
            }
            data.items[i].keywords = await this.fetchProductsSearchKeywords(data.items[i].productNo);
            data.items[i].categoryChk = this.data.categoryChk;
          }
          //24.05.13 seet3 추가 끝
          this.data.totalCount = data.totalCount;
          this.data.productList = data.items;
          this.data.productInfo = data;

          
        } catch (e) {
          console.error(e);
        }
      },
      async fetchProductsSearchSummary() {
        try {
          const queryString = {
            categoryNos: this.data.categoryNo,
            'filter.keywords': this.data.keyword,
            'filter.keywordInResult': this.data.keywordInResult,
            'filter.saleStatus': 'ALL_CONDITIONS',
            'filter.soldout': true,
          };
          const { data } = await shopby.api.product.getProductsSearchSummary({ queryString });
          this.data.productsSearchSummary = data;
        } catch (e) {
          console.error(e);
        }
      },
      async fetchProductsSearchKeywords(productNo) {
        try {
          const queryString = {
            productNos: productNo,
          };
          const { data } = await shopby.kaimen.api.product.getProductsSearchKeywords({ queryString });
          let text = '';

          if(data[0].keywords.length >= 3){                
            const filteredData = data[0].keywords.filter(item => {
              return item.includes('w');
            });
            const filteredData2 = data[0].keywords.filter(item => {
              return item.includes('a');
            });
            const filteredData3 = data[0].keywords.filter(item => {
              return item.includes('r');
            });
            text = filteredData[0].replace(/w/g, '')+'/ '+filteredData2[0].replace(/a/g, '')+'R '+filteredData3[0].replace(/r/g, '');
          } else{
            text = data[0].keywords.join(" ");
          }   
          
          return text;
        } catch (e) {
          console.error(e);
        }
      },
      async fetchMainSection() {
        const orders = {
          sale_cnt: 'SALE',
          price_asc: 'LOW_PRICE',
          price_dsc: 'HIGH_PRICE',
          review: 'REVIEW',
          register: 'REGISTER',
        };

        try {
          const request = {
            pathVariable: {
              sectionsId: sectionId,
            },
            queryString: {
              pageNumber: this.data.page,
              pageSize: this.data.pageSize,
              by: orders[this.data.orderBy],
              hasTotalCount: true,
              'filter.keywords': this.data.keyword,
              'filter.keywordInResult': this.data.keywordInResult,
            },
          };
          const { data } = await shopby.api.display.getDisplaySectionsIdsSectionId({ ...request });
          shopby.setGlobalVariableBy('DISPLAY_SECTION', data);
          const { productTotalCount, products, label } = data;
          this.data.totalCount = productTotalCount;
          this.data.productList = products;
          this.data.title = label;
        } catch (e) {
          console.error(e);
        }
      },
      onChangeProductSorting({ target }) {
        const { name, value } = target;
        switch (name) {
          case 'pageSize':
            return shopby.utils.sendQueryString({ pageSize: value, page: 1 });
          case 'sort':
            return shopby.utils.sendQueryString({ orderBy: value });
          default:
            return;
        }
      },
      async onclickCartBtn() {
        try {
          this.option.validate();
          const isSuccess = await shopby.helper.cart.addCart(this.requestForCartAndOrder);
          if (!isSuccess) return;
          await shopby.helper.cart.updateCartCount(true);
          const confirmOption = {
            message:
              '<p style="text-align: center;"><strong>상품이 장바구니에 담겼습니다.</strong></br>바로 확인하시겠습니까?</p>',
            iconType: 'cart',
          };
          const afterAdding = ({ state }) => {
            if (state === 'ok') {
              window.location.href = '/pages/order/cart.html';
            }
          };

          shopby.confirm(confirmOption, afterAdding);
        } catch (error) {
          errorHandler.cartAndOrder(error);
        }
      },
      async onClickWishBtn(event) {
        event.preventDefault();
        const $button = $(event.currentTarget);
        const liked = $button.hasClass('on');
        const productNo = $button.closest('li').data('product-no');

        if (!shopby.logined()) {
          return shopby.confirmLogin();
        }
        try {
          const requestBody = { productNos: [productNo] };
          await shopby.api.product.postProfileLikeProducts({ requestBody });
          liked ? $button.removeClass('on') : $button.addClass('on');
        } catch (e) {
          console.error(e);
        }
      },
      onClickKeywordInResultBtn() {
        const keywordInResult = $('input[name=keywordInResult]').val();
        shopby.utils.sendQueryString({ keywordInResult });
      },
      mapSortingParams(paramKey) {
        switch (paramKey) {
          case 'sale_cnt':
            return { order: 'SALE_CNT', direction: 'DESC' };
          case 'price_asc':
            return { order: 'DISCOUNTED_PRICE', direction: 'ASC' };
          case 'price_dsc':
            return { order: 'DISCOUNTED_PRICE', direction: 'DESC' };
          case 'review':
            return { order: 'REVIEW', direction: 'DESC' };
          case 'register':
          default:
            return { order: 'RECENT_PRODUCT', direction: 'DESC' };
        }
      },
      setSortingData() {
        $(`input[value=${this.data.orderBy}]`).closest('li').find('label').addClass('on');
      },
      setPageSize() {
        $(`select[name=pageSize]`).val(this.data.pageSize).prop('selected', true);
      },
      async paginationCallback() {
        const { pageNumber } = this.page;
        this.data.page = pageNumber;
        shopby.utils.pushState({ page: pageNumber });
        await this.setData();
        this.render();
        this.bindEvents();
      },
      getSearchBoxTemplate() {
        const { keywordInResult } = this.data;
        return `
             <div class="goods_search_box">
               <div class="search_again_box">
                 <div class="keyword-div">
                  <input type="text" class="keyword_input" autocomplete="off"
                  value="${keywordInResult}" name="keywordInResult">
                 </div>
                 <button type="button" class="btn_goods_search"><em>검색</em></button>
               </div>
            </div>`;
      },
    },
  };
  shopby.start.initiate(shopby.product.list.initiate.bind(shopby.product.list));
});