Quick Buy js

PaloAlto.QuickBuyPopup = (function($selector) {
  var container, product, sectionId;

  var $mfpData;
  $selector.magnificPopup({
    type: 'ajax',
    alignTop: true,
    removalDelay: 300,
    mainClass: 'popup-quick-buy mfp-fade',
    callbacks: {
      parseAjax: function(mfpResponse) {
        var $mfpContent = $(mfpResponse.data);
        $mfpData = $mfpContent.find('.product-single').add( $mfpContent.find('[id^="ProductJson-"]') )
        var $productContainer = $mfpData.filter('.product-single');
        sectionId = $productContainer.data('section-id');
        product = JSON.parse($mfpData.filter('#ProductJson-' + sectionId )[0].innerHTML);
        container = 'product-' + sectionId;
        setTimeout(function() {
          PaloAlto.initProductVariants($mfpData, product, sectionId);
        }, 400);

        return mfpResponse.data = $mfpData;
      }
    }
  });

  var magnificPopup = $.magnificPopup;

  $(document).on('click', '.mfp-wrap .product-single .grid__item a', function(event) {
    event.preventDefault();

    var imageId = $(this)
      .find('img')
      .data('id');

    $('.popup-gallery #' + imageId)
      .removeClass('hide')
      .siblings()
      .addClass('hide');
  });

  $(document).on('submit', '.mfp-wrap .product-form', function(event) {
    event.preventDefault();
    var $form = $(this).closest('form');

    $.ajax({
      url: '/cart/add.js',
      type: 'POST',
      dataType: 'json',
      data: $form.serialize()
    })
    .done(function() {
      magnificPopup.close();
      $.ajax({
        url: '/cart',
      })
      .done(function(data) {
        var $cartIcon = $(data).find('.site-header__cart-toggle');
        $('.site-header__cart-toggle').html($cartIcon[0].innerHTML)
      });
    });
  });
});

PaloAlto.Filters = (function() {
  if($('body').hasClass('quick-buy-enabled')){
    PaloAlto.QuickBuyPopup($('.quick_buy_button'));
  }
  var constants = {
    SORT_BY: 'sort_by',
    DEFAULT_SORT: 'title-ascending'
  };
  var selectors = {
    filterSelection: '.filters-toolbar__input--filter',
    sortSelection: '.filters-toolbar__input--sort',
    defaultSort: '.filters-toolbar__default-sort'
  };

  function Filters(container) {
    var $container = this.$container = $(container);

    this.$filterSelect = $(selectors.filterSelection, $container);
    this.$sortSelect = $(selectors.sortSelection, $container);
    this.$selects = $(selectors.filterSelection, $container).add($(selectors.sortSelection, $container));

    this.defaultSort = this._getDefaultSortValue();
    this._resizeSelect(this.$selects);

    this.$filterSelect.on('change', this._onFilterChange.bind(this));
    this.$sortSelect.on('change', this._onSortChange.bind(this));
        this.$selects.removeClass('hidden');

  }

  Filters.prototype = _.assignIn({}, Filters.prototype, {
    _onSortChange: function(evt) {
      var query = '';

      this.sort = this._getSortValue();

      if (this.sort !== this.defaultSort) {
        query = [constants.SORT_BY + '=' + this.sort];
      }

      var search = document.location.search = query.length ? '?' + query : '';

      document.location.href = this.$filterSelect.val() + search;
      this._resizeSelect($(evt.target));
    },

    _onFilterChange: function(evt) {
      document.location.href = this.$filterSelect.val();
      this._resizeSelect($(evt.target));
    },

    _getSortValue: function() {
      return this.$sortSelect.val() || this.defaultSort;
    },

    _getDefaultSortValue: function() {
      return $(selectors.defaultSort, this.$container).val() || constants.DEFAULT_SORT;
    },

    _resizeSelect: function($selection) {
      $selection.each(function() {
        var $this = $(this);
        var arrowWidth = 10;
        // create test element
        var text = $this.find('option:selected').text();
        var $test = $('<span>').html(text);

        // add to body, get width, and get out
        $test.appendTo('body');
        var width = $test.width();
        $test.remove();

        // set select width
        $this.width(width + arrowWidth);
        var newWidth = $this.outerWidth();

        var label = $this.closest('.form-horizontal').children().first();
        $(label).css('width',newWidth);
      });
    },

    onUnload: function() {
      this.$filterSelect.off('change', this._onFilterChange);
      this.$sortSelect.off('change', this._onSortChange);
    }



  });

  return Filters;
})();