Shopify search autocomplete

shopify-search-autocomplete.js

(function($) {
  $(document).ready(function() {
  
    var $search_form = $('#header #form-search'),
        search_cache = [];
    $search_form.find('input[name="q"]').attr('autocomplete', 'off');
    function hide_search_form_autocomplete() {
      $search_form.removeClass('show-autocomplete');
    }
    function show_search_form_autocomplete() {
      $search_form.addClass('show-autocomplete');
    }
    function render_search_form_autocomplete($search_results) {
      if($search_results.length > 0) {
        if($search_form.find('.search-autocomplete').length == 0)
          $search_form.find('input[name="q"]').after('<div class="search-autocomplete" />');
        var $search_autocomplete = $search_form.find('.search-autocomplete').empty();
        $search_results.each(function(i, item) {
          $search_autocomplete.append($(item));
        });
        show_search_form_autocomplete();
      } else
        hide_search_form_autocomplete();
    }
    function save_search_cache(keyword, $search_results) {
      var saved = false,
          item_to_save = {
            keyword: keyword,
            results: $search_results
          };
      $(search_cache, function(i, item) {
        if(item.keyword == keyword) {
          search_cache[i].results = $search_results;
          saved = true;
        }
      });
      if(saved == false)
        search_cache.push(item_to_save);
    }
    function get_search_cache(keyword) {
      var $search_results = false;
      $.each(search_cache, function(i, item) {
        if(item.keyword == keyword) {
          $search_results = search_cache[i].results;
        }
      });
      return $search_results;
    }
    function handle_search_form_submit() {
      var $search_input = $search_form.find('input[name="q"]'),
          search_keyword = $search_input.val().trim();
      if(search_keyword.length > 0) {
        if(!$search_form.hasClass('is-searching')) {
          var $search_results = get_search_cache(search_keyword);
          if($search_results != false) {
            render_search_form_autocomplete($search_results.slice(0, 5));
          } else {
            $search_form.addClass('is-searching');
            $.ajax({
              url: '/search',
              data: {
                q: search_keyword,
                type: 'product'
              },
              method: 'GET'
            }).done(function(response) {
              var $response = $('<div />');
              $response.html(response);
              var $search_results = $response.find('#shopify-section-template-search .product[data-productid] a');
              save_search_cache(search_keyword, $search_results)
              render_search_form_autocomplete($search_results.slice(0, 5));
              $search_form.removeClass('is-searching');
            });
          }
        }
      } else {
        hide_search_form_autocomplete();
      }
    }
    $('#header #form-search input[name="q"]')
    .on('keyup', function(e) {
      var $this = $(this);
      $this.delay(400).promise().done(function() {
        if($this.is(':focus')) {
          handle_search_form_submit();
        }
      });
    })
    .on('focus', show_search_form_autocomplete);
    $('html,body').click(function(e) {
      var $target = $(e.target);
      if($search_form.hasClass('show-autocomplete')) {
        if($target.closest($search_form).length > 0) {}
        else {
          hide_search_form_autocomplete();
        }
      }
    });
    
  });
}(jQuery));