https://musicstyle-shop.ru/g/templates/shop2/2.130.2/default-2/js/product_preview_popup.js

1$(function(){
2    var quick_view_class = "product-quick-view2";
3    var $quick_view_trigger;
4	var previewEvent = new Event(`productPrevievInit`, {bubbles: true});
5	
6    $(document).on('click', '.card_popup_close', function(){
7    	myo.close();
8    });
9    var obj = {
10    	popupFlag: true
11    };
12    
13    $(document).on("click", ".shop-product-btn", function (e) {
14        var $this = $(this);
15        var url = $this.attr("data-url") || $this.attr("href");
16        
17		obj.currentProductUrl = url;
18		obj.currentPrice = false;
19		
20		if( shop2.cf_margin_price_enabled ){
21			obj.currentPrice = $this.closest('form').find('.product-price');
22		}
23		
24		if ($this.parents('.popover-body').length>0 || $this.parents('.promo-products-list').length>0) {
25			obj.popupFlag = false;
26		} else {
27			obj.popupFlag = true;
28		}
29		
30		return obj
31    });
32    
33    shop2.on('afterCartAddItem', function(d, status) {
34		if (!d.errstr && obj.popupFlag) { // если ошибок нет
35			$('#shop2-msg').hide();
36			loadProduct(obj.currentProductUrl);
37		}
38	});
39
40    if (shop2 && shop2.product && shop2.product._reload) {
41        var reload = shop2.product._reload;
42        
43        shop2.product._reload = function(node) {
44            var args = Array.prototype.slice.call(arguments, 0);
45            var popoverDiv = $(node).closest("." + quick_view_class);
46            if (popoverDiv.length) {
47                reloadProduct(node);
48            } else {
49                reload.apply(this, args);
50            }
51        }
52    }
53
54    function loadProduct (url, callback) {
55    	
56        if (!myo) return false;
57        if ($('.product-quick-view2').length>0) {
58        	myo.close();
59        };      
60        myo.open({
61            ajax: url + '?&products_only=1&product_preview=1',
62            wrapClass: quick_view_class,
63            onLoad: function () {
64				
65				if (typeof amountInit === "function") {
66                	amountInit();
67				};
68				
69				if (typeof shop2_gr.methods.amountInit === "function") {
70                    shop2_gr.methods.amountInit();
71                };
72                
73                const imageObserver = new IntersectionObserver((entries, imgObserver) => {
74                    entries.forEach((entry) => {
75                        if (entry.isIntersecting) {
76                            const lazyImage = entry.target
77                            lazyImage.src = lazyImage.dataset.src
78                            lazyImage.classList.remove("gr_lazy_load");
79                            imgObserver.unobserve(lazyImage);
80                        }
81                    })
82                });
83                const arr = document.querySelectorAll("img.gr_lazy_load")
84                arr.forEach((v) => {
85                    imageObserver.observe(v);
86                });
87                
88                if( obj.currentPrice ){
89
90                    this.bodyDiv.find('.card-product-preview__item .card-product-preview__price').html(
91                        obj.currentPrice.html()
92                    );
93                }
94                
95                
96                var $popupKindClass = $(".popup_kinds_slider");
97                
98                if ($popupKindClass.length>0) {
99                    var sliderAutoplay = $(".popup_kinds_slider").data("autoplay");
100                    // forEach function from Todd Motto"s  blog, as mentioned above
101                    var forEachSlider = function(array, callback, scope) {
102                        for (var i = 0; i < array.length; i++) {
103                            callback.call(scope, i, array[i]); // passes back stuff we need
104                        }
105                    };
106                    // tiny-slider initialisation
107                    var sliders = document.querySelectorAll(".popup_kinds_slider");
108                    forEachSlider(sliders, function(index, value) {
109                        let thumbnail = value.dataset.name;
110                        let multislider = tns({
111                            loop: true,
112                            container: value,
113                            slideBy: 1,
114                            autoplayTimeout: 3000,
115                            autoplayHoverPause: true,
116                            mode: "carousel",
117                            axis: "horizontal",
118                            autoplay: sliderAutoplay,
119                            autoplayButtonOutput: false,
120                            mouseDrag: true,
121                            center: false,
122                            autoWidth: false,
123                            nav: true,
124                            navPosition: "bottom",
125                            controlsText: ['<svg class="gr-svg-icon"><use xlink:href="#icon_shop_slider_prev"></use></svg><svg class="gr-svg-icon gr_small_icon"><use xlink:href="#icon_shop_slider_prev_small"></use></svg>', '<svg class="gr-svg-icon"><use xlink:href="#icon_shop_slider_next"></use></svg><svg class="gr-svg-icon gr_small_icon"><use xlink:href="#icon_shop_slider_next_small"></use></svg>'],
126                            preventActionWhenRunning: true,
127                            responsive: {
128                                320: {
129                                    items: 1,
130                                    gutter: 0,
131                            		controls: false
132                                },
133                                480: {
134                                    items: 1,
135                                    gutter: 0,
136                            		controls: false
137                                },
138                                768: {
139                                    items: 2,
140                                    gutter: 20,
141                            		controls: true
142                                },
143                                1024: {
144                                    items: 2,
145                                    gutter: 20,
146                            		controls: true
147                                }
148                            }
149                        });
150                    });
151                }
152                
153                if ($.isFunction(callback)) {
154                    callback();
155                };
156                document.dispatchEvent(previewEvent);
157            }
158        });
159    };
160
161    function reloadProduct (node) {
162        var $node = $(node),
163            kinds = shop2.product.getNodeData(node, 'kinds', true),
164            paramName = shop2.product.getNodeData(node, 'name'),
165            paramValue = shop2.product.getNodeData(node, 'value'),
166            $form = $node.closest('form'),
167            form = $form.get(0),
168            meta, kind_id, product_id;
169            
170        if (kinds && $.type(paramName) !== 'undefined' && $.type(paramValue) !== 'undefined' && form) {
171
172            if (form.elements.meta) {
173                meta = $.parseJSON(form.elements.meta.value);
174            }
175
176            product_id = form.elements.product_id.value;
177
178            $form.find('[name=submit]').prop('disabled', true);
179

180            kind_id = shop2.product.findKindId(product_id, kinds, paramName, paramValue, meta);
181
182            if (kind_id === 0) return false;
183
184            var url = window.location.protocol + "//" + window.location.host + shop2.uri + "/product/" + kind_id;
185
186            loadProduct(url);
187        }
188    };
189});