msfavorites.js

/** v.1.1.0 -- */

msfavorites = {
    options: {
        selector: '.msfavorites',
        add: '.msfavorites-add',
        remove: '.msfavorites-remove',
        go: '.msfavorites-go',
        total: '.msfavorites-total',
        element: '.ms2_product',
        added: 'added',
        loading: 'loading'
    },

    initialize: function() {
        var options = msfavorites.options;
        var selector = options.selector;
        $(document).on('click', selector + ' ' + options.add + ',' + selector + ' ' + options.remove, function (e) {

            var $this = $(this);
            var $parent = $this.parents(selector);
            var $element = $parent.parents(options.element);
            var id = $parent.data('id');
            var propkey = $parent.data('propkey');
            var action = $parent.data('added') != options.added ? 'add' : 'remove';
            var text = $this.data('text');

            if ($this.hasClass(options.loading)) {
                return false;
            } else {
                $this.addClass(options.loading);
            }
            if (text.length) {
                $this.attr('data-text', msfavorites.utils.encode($this.html())).html(text);
            }

            var product = $this.parents('.ms2_product');
            var properties = {};
            if ((product.length == 1) && (action == 'add')) {
                var data = product.find('.ms2_form').serializeArray();
                $.each(data, function (key, value) {
                    properties[value.name.replace('[', '.').replace(']', '')] = value.value;
                });
            }

            $.post(msfavoritesConfig.actionUrl, {
                action: action,
                propkey: propkey,
                resource: id,
                properties: properties
            }, function (response) {
                if (text.length) {
                    text = msfavorites.utils.decode($this.attr('data-text'));
                    $this.attr('data-text', msfavorites.utils.encode($this.html())).html(text);
                }
                $this.removeClass(options.loading);
                if (response.success) {
                    
                    $(options.total, selector).text(response.data.total);
                    
                    if (response.data.link) {
                        $(options.go, selector).attr('href', response.data.link);
                    }

                    if (action == 'add') {
                        $parent.data('added', options.added).attr('data-added', options.added);
                    } else {
                        $parent.data('added', '').attr('data-added', '');

                        if (response.data.remove === 1) {
                            if (response.data.total === 0) {
                                document.location.reload();
                            }
                            $element.remove();
                        }
                    }

                    if (response.data.total === 0) {
                        $(options.total, selector).addClass('empty').hide();
                    }
                    else {
                        $(options.total, selector).removeClass('empty').show();
                    }
                        
                    if ((typeof miniShop2 != 'undefined') && (response.message != 'undefined')) {
                        miniShop2.Message.error(response.message);
                    }

                } else {
                    if (typeof miniShop2 != 'undefined') {
                        miniShop2.Message.error(response.message);
                    }
                }
            }, 'json');

            e.preventDefault();
            return false;
        });
    },

    utils: {
        encode: function(string) {
            return $('<pre/>').text(string).html();
        },
        decode: function(string) {
            return $("<pre/>").html(string).text();
        }
    }

};

tpl.msf.favorites_total

<li class="topfav">
    <a class="tml msfavorites" href="[[+link]]" data-id="[[+id]]" data-added="[[+added]]" data-propkey="[[+propkey]]">
        <span class="glyphicon glyphicon-heart" aria-hidden="true"></span>
        <span id="ftot" class="tml msfavorites-total [[!+total:gt=`0`:then=``:else=`empty`]]">[[+total]]</span>
    </a>
</li>