/*-----------------------------------------------------
 search_dropdown.js
 検索条件を選択するためのドロップダウンメニューを制御する
-------------------------------------------------------*/

$(function () {
  dropdown();
});

function dropdown () {
  var dropdown = $('#dropdown');
  if (dropdown.length > 0) {
    var filterInput = $('#filter-input');
    var label = dropdown.find('.select').children('.label');
    
    // メニュー展開
    label.click(function (e) {
      e.stopPropagation();
      $(this).next().toggleClass('active');
    });
    
    // いずれかの検索条件をクリックした場合
    // メニューを閉じて、指定した検索条件のテキストを表示させる
    var items = dropdown.find('.list').children('li');
    items.each(function () {
      $(this).click(function (e) {
        e.preventDefault();
        var option = $(this).data('option') || $(this).children('p').data('option');
        var text = $(this).text();

        label.text(text);
        filterInput.val(option);

        if ($(this).parent()[0].tagName.toLowerCase() === 'ul' &&
            $(this).parent().hasClass('active')) {
          $(this).parent().removeClass('active');
        }
      });
    });
    
    // メニューを閉じる
    var toggleCloseDropdown = function () {
      if (label.next().hasClass('active')) {
        label.next().removeClass('active');
      }
    }
    
    // Escキーを押した場合メニューを閉じる
    document.addEventListener('keydown', function (e) {
      if (e.keyCode === 27) {
        toggleCloseDropdown()
      }
    });
    
    // クリックした領域がメニュー以外の場合、メニューを閉じる
    $(document).click(function (e) {
      if (!$(e.target).closest('.list').length) {
    	toggleCloseDropdown();
      }
    });
  }
}