https://atmstudio.su/t/v4001/images/js/fixed_panel.js

1(function(){
2
3	$(function(){
4		
5		var panel = $('.mobile_panel-js');
6		var panelCatWr = $('.popup_categor_mobile_wrap');
7		var panelAddWr = $('.popup_add_mobile_wrap');
8		var closePanelButton = $('.close_panel');
9		var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
10		
11		if (isMobile) {
12			panel.css("display","flex");
13		}
14		
15		function closeCatWr() {
16			if (!panelCatWr.is(':animated')) {
17				panelCatWr.addClass('animate__backOutDown');
18				setTimeout(function(){
19					panelCatWr.removeClass('animate__backInUp');
20				},1000);
21			} 
22		}
23		
24		function openCatWr() {
25			closeAddWr();
26			if (!panelCatWr.is(':animated')) {
27				panelCatWr.removeClass('animate__backOutDown').addClass('animate__backInUp');
28			} 
29		}
30		
31		function closeAddWr() {
32			if (!panelAddWr.is(':animated')) {
33				panelAddWr.addClass('animate__backOutDown');
34				setTimeout(function(){
35					panelAddWr.removeClass('animate__backInUp');
36				},1000);
37			} 
38		}
39		
40		function openAddWr() {
41			closeCatWr();
42			if (!panelAddWr.is(':animated')) {
43				panelAddWr.removeClass('animate__backOutDown').addClass('animate__backInUp');
44			} 
45		}
46				
47		$('.icon_home').on('click', function(){
48			document.location.href = '/'
49		});
50		
51		$('.item_cart').on('click', function(){
52			document.location.href = shop2.uri + "/cart";
53		});
54		
55		$('.item_profil').on('click', function(){
56			document.location.href = '/users';
57		});
58		
59		$('.item_compare').on('click', function(){
60			document.location.href = shop2.uri + '/compare';
61		});
62		
63		$('.item_favorite').on('click', function(){
64			document.location.href = shop2.uri + '/favorites'
65		});
66		
67		$('.item_menu').on('click', function(){
68			$('.close_panel').click();
69			setTimeout(function(){
70				$('.menu_toggle').trigger('click')
71			},200)
72		});
73		
74		$('.icon_catalog').on('click', function(){
75			if(panelCatWr.hasClass('animate__backInUp')){
76				closeCatWr();
77			} else {
78				openCatWr();
79			}
80		});
81		
82		$('.item_add').on('click', function(){
83			
84			if(panelAddWr.hasClass('animate__backInUp')){
85				closeAddWr();
86			} else {
87				openAddWr();
88			}
89		});
90		
91		
92		$('.close_panel').on('click', function(){
93			$('.popup_categor_mobile_wrap, .popup_add_mobile_wrap').addClass('animate__backOutDown')
94			setTimeout(function(){
95				$('.popup_categor_mobile_wrap, .popup_add_mobile_wrap').removeClass('animate__backInUp')
96			},1000)
97		});
98		
99		$('.popup_categor_mobile a').on('click', function(){
100			document.location.href = $(this).attr('href')
101		})
102		
103		function getCatItems(url,item=null) {
104			
105			$.ajax({
106				url: url,
107				dataType: "html",
108				success: (data, textStatus) => {
109					var dataJson = $.parseJSON(data);
110					var level = dataJson.level;
111					
112					$('.cat-back-but').attr('data-back-url', dataJson.back_url);
113					
114					if (item) {
115						if (dataJson.items.length>0) {
116							$('.main_elem').hide();
117							
118							if (level >=1){
119								$('.main_elem').addClass('subLevel');
120								$('.cat-back-but').show();
121							}
122							
123							$('.main_elem').html(dataJson.items).fadeIn();
124							
125						} else {
126							document.location.href = item.attr('href');
127						}
128					
129					} else {
130						
131						$('.main_elem').hide();
132						
133						if (level <1){
134							$('.main_elem').removeClass('subLevel');
135							$('.cat-back-but').hide();
136						}
137						
138						$('.main_elem').html(dataJson.items).fadeIn();
139					}
140				}
141			});
142			
143		}
144		
145		$(document).on('click', '.popup_categor_mobile li a' , function(e){
146			
147			e.preventDefault();
148			
149			var $this = $(this);
150			var url = $this.attr('href') + '?sub_folders=1';
151			
152			getCatItems(url, $this);
153			
154		});
155		
156		$('.cat-back-but').on('click', function(){
157			
158			var	back_url = $(this).attr('data-back-url') + '?sub_folders=1';
159			
160			getCatItems(back_url, null);
161				
162			
163		});
164		
165		$('.close_wrap').on('click', function(e){
166			
167			closeCatWr();
168			closeAddWr();
169			
170		});
171		
172		
173	});
174	
175	$('.mobile_search_wr .icon').on('click', function(){
176		$(this).next().toggleClass('active')
177	})
178	
179	
180	shop2.on('afterCartAddItem', function(){
181		fetch('/-/x-api/v1/public/?method=shop2/getCartProducts')
182		  .then(response => response.json())
183		  .then(cart_products => $('.item_icon.item_cart .counter').text(cart_products.result.data.totals.amount));
184	})
185	shop2.on('afterCartRemoveItem', function(){
186		fetch('/-/x-api/v1/public/?method=shop2/getCartProducts')
187		  .then(response => response.json())
188		  .then(cart_products => $('.item_icon.item_cart .counter').text(cart_products.result.data.totals.amount));
189	})
190	shop2.queue.compare = function(){
191	  var $document = $(document);
192	
193	  function update(el, res) {
194	  
195	      // el.closest('.product-compare').replaceWith(res.data);
196	      $('input[type=checkbox][value=' + el.val() + ']').closest('.product-compare').replaceWith(res.data);
197	  
198	      $('.product-compare-added a span').html('(' + res.count + ')');
199	      $('.item_compare .counter').text(res.count);
200	  
201	      if (res.panel) {
202	          $('#shop2-panel').replaceWith(res.panel);
203	      }
204	  
205	  }
206	  
207	  $document.on('click', '.product-compare input:checkbox', function() {
208	      var $this = $(this),
209	          action = $this.attr('checked') ? 'del' : 'add';
210	  
211	      shop2.compare.action(action, $this.val(), function(res, status) {
212	          if (status == 'success') {
213	  
214	              if (res.errstr) {
215	                  shop2.alert(res.errstr);
216	                  $this.prop('checked', false);
217	              } else {
218	                  update($this, res);
219	              }
220	          }
221	      });
222	  });
223	};
224
225})();