Fake facets JS behavior

fakefacets.js

(function($) {

  Drupal.behaviors.FakeFacets = {
    facetClicked: function(event) {
      var $source = $(event.srcElement || event.target)
        value     = $source.data('value'),
        $litem    = $source.parent()
        $list     = $litem.parent(),
        $wrapper  = $list.parent(),
        $target   = $wrapper.data('target_select');

      // Toggle the option state in the target select field.
      $target.find('option[value=' + value + ']').attr('selected', $list.hasClass('available-facets'));

      // Move the link to the other list.
      $wrapper.find('ul').not($list).append($litem);

      // Trigger the change event to launch the ajax request.
      $target.trigger('change');
    },
    attach: function(context, settings) {
      $('.views-exposed-form-products-page-front').once('abc-fake-facets', function(i, $context) {
        // For each multiple select create two unordered lists to store
        // available and selected terms.
        $('select[multiple]', $context).each(function(i, target) {
          var $target  = $(target),
            $label  = $target.parents('.views-exposed-widget').children('label'),
            // Prepare new html elements.
            $wrapper   = $('<div>').addClass('facets-wrapper'),
            $available = $('<ul>').addClass('available-facets'),
            $selected  = $('<ul>').addClass('selected-facets');

          // For each option in the original field, create a link in the good
          // facets list.
          $target.find('option').each(function(i, option) {
            var $option = $(option),
              $link = $('<a>');
            $link.text($option.text())
              .data('value', $option.attr('value'))
              .attr('href', 'javascript:void(0);')
              .bind('click.facet', Drupal.behaviors.FakeFacets.facetClicked);

            if ($option.is(':selected')) {
              $selected.append($('<li>').append($link));
            }
            else {
              $available.append($('<li>').append($link));
            }
          });
          $wrapper.data('target_select', $target)
            .append($('<span>').addClass('facets-label').text($label.text().trim()))
            .append($available)
            .append($selected);

          $target.after($wrapper)
            .hide();
          $label.hide();
        });

      });
    }
  };

})(jQuery);