$(function() {
  'use strict';

  const $resultArea = $('.jsResultArea');
  const $resultProducts = $resultArea.find('.m_col__col');
  const $resultItem = $resultProducts.find('.m_col__item');
  const $selectArea = $('.jsSelectArea');
  const $sortArea = $('.jsSortArea');
  const param = location.search;

  //年度セレクトボックス自動生成
  function makeYearSelectbox() {
    const currentYear = (new Date()).getFullYear();
    let setYear = currentYear;
    const lowerYear = 2020;
    const maxYear = 10;
    const $selectbox = $('.jsAutoYearSelectbox');

    let strHTML = ''
    for (let i = 0; i < maxYear; i++) {
      const isCurrent = param.indexOf(setYear) !== -1;
      strHTML += `<li ${ isCurrent ? 'class="s_selected"': ''}><button class="m_selectboxA__menuBtn" type="button" name="year" value="${setYear}">${setYear}</button></li>`;
      if (setYear === lowerYear) { break }
      setYear--;
    }
    $selectbox.find('.m_selectboxA__menu').append(strHTML);
    if ($selectbox.find('.m_selectboxA__menu > li.s_selected').length === 0) {
      $selectbox.find('.m_selectboxA__menu > li').eq(0).addClass('s_selected');
    }
    $selectbox.find('.m_selectboxA__valueText').text($selectbox.find('.m_selectboxA__menu > li.s_selected').text())
  };
  makeYearSelectbox();

  //初期表示

  /* カテゴリー */
  if (param.match(/[\?&]search=([\d,]+)/)) {
    const paramValues = RegExp.$1.split(',');
    for (let i = 0; i < paramValues.length; i++) {
      const paramValue = paramValues[i];
      $selectArea.find('.m_checkbox input[value="'+paramValue+'"]').prop('checked', true);
      $selectArea.find('.m_radioBtn input').prop('checked', false);
    }
  }

  /* 年度 */
  if (param.match(/[\?&]year=([\d,]+)/)) {
    const paramValues = RegExp.$1.split(',');
    for (let i = 0; i < paramValues.length; i++) {
      const paramValue = paramValues[i];
      const $area = $sortArea.find('.jsSortYear');
      const $target = $area.find('.m_selectboxA__menuBtn[value=' + paramValue + ']');
      if ($target.length > 0) {
        $target.closest('li').addClass('s_selected').siblings('li').removeClass('s_selected');
        $area.find('.m_selectboxA__valueText').text($target.text());
      }
    }
  }

  /* 国 */
  if (param.match(/[\?&]country=([\d,]+)/)) {
    const paramValues = RegExp.$1.split(',');
    for (let i = 0; i < paramValues.length; i++) {
      const paramValue = paramValues[i];
      const $area = $sortArea.find('.jsSortCountry');
      const $target = $area.find('.m_selectboxA__menuBtn[value=' + paramValue + ']');
      if ($target.length > 0) {
        $target.closest('li').addClass('s_selected').siblings('li').removeClass('s_selected');
        $area.find('.m_selectboxA__valueText').text($target.text());
      }
    }
  }
  execFilter();

  //カテゴリーのUI設定
  $selectArea.find('.m_checkbox input').on('change', function () {
    if ($selectArea.find('.m_checkbox input:checked').length > 0) {
      $selectArea.find('.m_radioBtn input').prop('checked', false);
    } else {
      $selectArea.find('.m_radioBtn input').trigger('click');
    }
  });
  $selectArea.find('.m_radioBtn input').on('change', function () {
    $selectArea.find('.m_checkbox input').prop('checked',false);
  });

  //絞りこみ検索
  $selectArea.find('input').on('change', function () {
    execFilter();
  });
  $sortArea.find(".m_selectboxA__menu > li").on('selectEvent', function () {
    execFilter();
  });

  function execFilter(){
    let checkedVal = $selectArea.find('input:checked').val(); //チェックした値

    //結果表示
    $resultItem.show().each(function () {
      let showFlg = true;
      /* カテゴリー */
      const dataSearchArr = $(this).attr('data-search') !== undefined ? $(this).attr('data-search').split(',') : [''];
      const checkedSearchArr = $selectArea.find('input[name="search"]:checked').map(function() { return $(this).val(); }).get();
      const isSearch = dataSearchArr.some(value => checkedSearchArr.includes(value))
      /* 年度 */
      const dataYear = $(this).attr('data-year') !== undefined ? $(this).attr('data-year') : '0';
      const checkedYear = $sortArea.find('.jsSortYear .m_selectboxA__menu > li.s_selected .m_selectboxA__menuBtn').val();
      /* 国 */
      const dataCountry = $(this).attr('data-country') !== undefined ? $(this).attr('data-country') : '0';
      const checkedCountry = $sortArea.find('.jsSortCountry .m_selectboxA__menu > li.s_selected .m_selectboxA__menuBtn').val();

      //表示判定
      if (
        (checkedVal !== '0' && !isSearch) ||
        (checkedYear !== '0' && dataYear !== checkedYear) ||
        (checkedCountry !== '0' && dataCountry !== checkedCountry)
      ) {
        showFlg = false;
      }
      $(this).toggleClass('u_disNon', !showFlg);
    });
    changeResult();
  }

  function changeResult() {
    const isItem = $resultProducts.find('.m_col__item:not(.u_disNon)').length === 0;
    $('.jsZeroItems').toggle(isItem);
    $resultArea.toggle(!isItem);
    COMMON.makePagination($resultProducts,'> .m_col__item:not(.u_disNon)');
  }

  function setResponsive() {
    let initFlag = true;
    $(window).on('resize', function () {
      const flag = COMMON.isMaxWidth(767);
      if (flag && !initFlag) {
        changeResult()
        initFlag = true;
      } else if (!flag && initFlag) {
        changeResult()
        initFlag = false;
      }
    });
  }
  setResponsive();
});