https://tulpany-optom-8marta.ru/assets/js/main.js

1(function ($) {
2	"use strict";
3	/*----------------------------------------
4	   Sticky Menu Activation
5	---------------------------------*/
6	$(window).on('scroll', function () {
7		if ($(this).scrollTop() > 300) {
8			$('.header-sticky').addClass('sticky');
9		} else {
10			$('.header-sticky').removeClass('sticky');
11		}
12	});
13	/*----------------------------------------
14		Off Canvas
15	-------------------------------------------*/
16	$(".off-canvas-btn").on('click', function () {
17		$("body").addClass('fix');
18		$(".off-canvas-wrapper").addClass('open');
19	});
20
21	$(".btn-close-off-canvas,.off-canvas-overlay").on('click', function () {
22		$("body").removeClass('fix');
23		$(".off-canvas-wrapper").removeClass('open');
24	});
25
26	/*----------------------------------------
27		Off Canvas Menu
28	-------------------------------------------*/
29	$(".off-canvas-menu-btn").on('click', function () {
30		$("body").addClass('fix');
31		$(".off-canvas-menu-wrapper").addClass('open');
32	});
33
34	$(".btn-close-off-canvas,.off-canvas-overlay").on('click', function () {
35		$("body").removeClass('fix');
36		$(".off-canvas-menu-wrapper").removeClass('open');
37	});
38	/*----------------------------------------*/
39	/*  Cart Plus Minus Button
40	/*----------------------------------------*/
41	$('.cart-plus-minus').append(
42		'<div class="dec qtybutton"><i class="fa fa-minus"></i></div><div class="inc qtybutton"><i class="fa fa-plus"></i></div>'
43	);
44	$('.qtybutton').on('click', function () {
45		var $button = $(this);
46		var oldValue = $button.parent().find('input').val();
47		if ($button.hasClass('inc')) {
48			var newVal = parseFloat(oldValue) + 1;
49		} else {
50			// Don't allow decrementing below zero
51			if (oldValue > 1) {
52				var newVal = parseFloat(oldValue) - 1;
53			} else {
54				newVal = 1;
55			}
56		}
57		$button.parent().find('input').val(newVal);
58	});
59	/*----------------------------------------*/
60	/* Toggle Function Active
61	/*----------------------------------------*/
62	// showlogin toggle
63	$('#showlogin').on('click', function () {
64		$('#checkout-login').slideToggle(900);
65	});
66	// showlogin toggle
67	$('#showcoupon').on('click', function () {
68		$('#checkout_coupon').slideToggle(900);
69	});
70	// showlogin toggle
71	$('#cbox').on('click', function () {
72		$('#cbox-info').slideToggle(900);
73	});
74
75	// Ship box toggle
76	$('#ship-box').on('click', function () {
77		$('#ship-box-info').slideToggle(1000);
78	});
79	/*----------------------------------------
80		Responsive Mobile Menu
81	------------------------------------------*/
82	//Variables
83	var $offCanvasNav = $('.mobile-menu'),
84	$offCanvasNavSubMenu = $offCanvasNav.find('.dropdown');
85	//Add Toggle Button With Off Canvas Sub Menu
86	$offCanvasNavSubMenu.parent().prepend('<span class="menu-expand"><i></i></span>');
87	//Close Off Canvas Sub Menu
88	$offCanvasNavSubMenu.slideUp();
89	//Category Sub Menu Toggle
90	$offCanvasNav.on('click', 'li a, li .menu-expand', function(e) {
91	var $this = $(this);
92	if ( ($this.parent().attr('class').match(/\b(menu-item-has-children|has-children|has-sub-menu)\b/)) && ($this.attr('href') === '#' || $this.hasClass('menu-expand')) ) {
93		e.preventDefault();
94		if ($this.siblings('ul:visible').length){
95			$this.parent('li').removeClass('active');
96			$this.siblings('ul').slideUp();
97		} else {
98			$this.parent('li').addClass('active');
99			$this.closest('li').siblings('li').removeClass('active').find('li').removeClass('active');
100			$this.closest('li').siblings('li').find('ul:visible').slideUp();
101			$this.siblings('ul').slideDown();
102		}
103	}
104	});
105
106	/*----------------------------------------
107		Swiper Slider Activation Js
108	------------------------------------------*/
109	// Home 01 Slider
110	var intro11Slider = new Swiper('.intro11-slider', {
111        loop: true,
112        speed: 400,
113		slidesPerView: 1,
114        spaceBetween: 10,
115		effect: 'fade',
116        navigation: {
117            nextEl: '.home1-slider-next',
118            prevEl: '.home1-slider-prev',
119		},
120		pagination: {
121			el: '.swiper-pagination',
122			type: 'bullets',
123			clickable: 'true',
124		},
125		//autoplay: {},
126	});
127	// Product Carousel
128	var intro11Slider = new Swiper('.product-slider', {
129		slidesPerView: 1,
130		spaceBetween: 10,
131		pagination: {
132			el: '.swiper-pagination',
133			type: 'bullets',
134			clickable: 'true',
135		},
136		//autoplay: {},
137		// Responsive breakpoints
138		breakpoints: {
139			// when window width is >= 320px
140			320: {
141			  slidesPerView: 1,
142			  spaceBetween: 10
143			},
144			// when window width is >= 480px
145			480: {
146			  slidesPerView: 2,
147			  spaceBetween: 10
148			},
149			// when window width is >= 767px
150			768: {
151			  slidesPerView: 3,
152			  spaceBetween: 10
153			},
154			// when window width is >= 1200px
155			1200: {
156				slidesPerView: 4,
157				spaceBetween: 10
158			  },
159		  }
160	});
161	// item Carousel 2
162	var intro11Slider = new Swiper('.item-carousel-2', {
163		slidesPerView: 1,
164		autoHeight: true,
165		pagination: {
166			el: '.swiper-pagination',
167			type: 'bullets',
168			clickable: 'true',
169		},
170		//autoplay: {},
171		// Responsive breakpoints
172		breakpoints: {
173			// when window width is >= 480px
174			480: {
175			  slidesPerView: 1,
176			},
177			// when window width is >= 575px
178			575: {
179			  slidesPerView: 2,
180			},
181			// when window width is >= 767px
182			767: {
183			  slidesPerView: 2,
184			},
185			// when window width is >= 991px
186			991: {
187				slidesPerView: 2,
188			},
189			// when window width is >= 1200px
190			1200: {
191				slidesPerView: 3,
192			  },
193		  }
194	});
195	// Brand Logo Carousel
196	var intro11Slider = new Swiper('.brand-logo-carousel', {
197		loop: true,

198        speed: 800,
199		slidesPerView: 1,
200        spaceBetween: 10,
201		effect: 'slide',
202        navigation: {
203            nextEl: '.home1-slider-next',
204            prevEl: '.home1-slider-prev',
205		},
206		//autoplay: {},
207		// Responsive breakpoints
208		breakpoints: {
209			// when window width is >= 320px
210			320: {
211			  slidesPerView: 2,
212			},
213			// when window width is >= 480px
214			480: {
215			  slidesPerView: 2,
216			},
217			// when window width is >= 575px
218			575: {
219			  slidesPerView: 3,
220			},
221			// when window width is >= 767px
222			767: {
223			  slidesPerView: 4,
224			},
225			// when window width is >= 991px
226			991: {
227				slidesPerView: 4,
228			},
229			// when window width is >= 1200px
230			1200: {
231				slidesPerView: 5,
232			  },
233		  }
234	});
235	// Testimonial Carousel
236	var intro11Slider = new Swiper('.testimonial-carousel', {
237        loop: true,
238        speed: 800,
239		slidesPerView: 1,
240        spaceBetween: 10,
241		effect: 'slide',
242        navigation: {
243            nextEl: '.home1-slider-next',
244            prevEl: '.home1-slider-prev',
245		},
246		//autoplay: {},
247
248	});
249	// Latest Post Carousel
250	var intro11Slider = new Swiper('.latest-post-carousel', {
251        loop: true,
252		direction: 'vertical',
253		slidesPerView: 3,
254		mousewheel: true,
255		pagination: {
256			el: '.swiper-pagination',
257			clickable: true,
258		},
259		//autoplay: {},
260		
261
262	});
263	// Single product with Thumbnail
264	var galleryThumbs = new Swiper('.single-product-thumb', {
265		spaceBetween: 10,
266		slidesPerView: 4,
267		loop: false,
268		freeMode: true,
269		loopedSlides: 5, //looped slides should be the same
270		watchSlidesVisibility: true,
271		watchSlidesProgress: true,
272		// Responsive breakpoints
273		breakpoints: {
274			// when window width is >= 320px
275			320: {
276			  slidesPerView: 2,
277			},
278			// when window width is >= 575px
279			575: {
280			  slidesPerView: 3,
281			},
282			// when window width is >= 767px
283			767: {
284			  slidesPerView: 4,
285			},
286			// when window width is >= 991px
287			991: {
288				slidesPerView: 3,
289			},
290			// when window width is >= 1200px
291			1200: {
292				slidesPerView: 4,
293			},
294		  }
295	  });
296	var galleryTop = new Swiper('.single-product-img', {
297	spaceBetween: 10,
298	loop: false,
299	loopedSlides: 5, //looped slides should be the same
300	navigation: {
301		nextEl: '.swiper-button-next',
302		prevEl: '.swiper-button-prev',
303	},
304	thumbs: {
305		swiper: galleryThumbs,
306	},
307	});
308	/*----------------------------------------*/
309	/*  Shop Grid Activation
310	/*----------------------------------------*/
311	$('.shop_toolbar_btn > button').on('click', function (e) {
312	
313		e.preventDefault();
314		
315		$('.shop_toolbar_btn > button').removeClass('active');
316		$(this).addClass('active');
317		
318		var parentsDiv = $('.shop_wrapper');
319		var viewMode = $(this).data('role');
320		
321		
322		parentsDiv.removeClass('grid_3 grid_4 grid_5 grid_list').addClass(viewMode);
323
324		if(viewMode == 'grid_3'){
325			parentsDiv.children().addClass('col-lg-4 col-md-6 col-sm-6').removeClass('col-lg-3 col-cust-5 col-12');
326			
327		}
328
329		if(viewMode == 'grid_4'){
330			parentsDiv.children().addClass('col-lg-3 col-md-6 col-sm-6').removeClass('col-lg-4 col-cust-5 col-12');
331		}
332		
333		if(viewMode == 'grid_list'){
334			parentsDiv.children().addClass('col-12').removeClass('col-lg-3 col-lg-4 col-md-6 col-sm-6 col-cust-5');
335		}
336			
337	});
338	/*--------------------------------
339	Price Slider Active
340	-------------------------------- */
341	$( "#slider-range" ).slider({
342        range: true,
343        min: 0,
344        max: 500,
345        values: [ 0, 500 ],
346        slide: function( event, ui ) {
347        $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
348       }
349    });
350    $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
351       " - $" + $( "#slider-range" ).slider( "values", 1 ) );
352	/*----------------------------------------
353		Bootstrap 5 Tooltip
354	------------------------------------------*/
355	$(function () {
356		$('[data-toggle="tooltip"]').tooltip();
357	});
358	
359	/*----------------------------------------*/
360	/*  Countdown
361	/*----------------------------------------*/
362	$('[data-countdown]').each(function() {
363		var $this = $(this), finalDate = $(this).data('countdown');
364		$this.countdown(finalDate, function(event) {
365			$this.html(event.strftime('<div class="single-countdown"><span class="single-countdown_time">%D</span><span class="single-countdown_text">Дней</span></div><div class="single-countdown"><span class="single-countdown_time">%H</span><span class="single-countdown_text">Часов</span></div><div class="single-countdown"><span class="single-countdown_time">%M</span><span class="single-countdown_text">Минут</span></div><div class="single-countdown"><span class="single-countdown_time">%S</span><span class="single-countdown_text">Секунд</span></div>'));
366		});
367	});
368	/*----------------------------------------*/
369	/*------ Popup Image
370	-------------------------------------------------*/
371	$('.popup-gallery').magnificPopup({
372		delegate: 'a',
373		type: 'image',
374		tLoading: 'Loading image #%curr%...',
375		mainClass: 'mfp-img-mobile',
376		gallery: {
377			enabled: true,
378			navigateByImgClick: true,
379			preload: [0,1] // Will preload 0 - before current, and 1 after the current image
380		},
381		image: {
382			tError: '<a href="%url%">The image #%curr%</a> could not be loaded.'
383		}
384	});
385	/*---------------------------------
386	/* 	MailChimp
387    -----------------------------------*/
388    $('#mc-form').ajaxChimp({
389        language: 'en',
390        callback: mailChimpResponse,
391        // ADD YOUR MAILCHIMP URL BELOW HERE!
392        url: 'http://devitems.us11.list-manage.com/subscribe/post?u=6bbb9b6f5827bd842d9640c82&amp;id=05d85f18ef'
393    });

394    function mailChimpResponse(resp) {
395        if (resp.result === 'success') {
396            $('.mailchimp-success').html('' + resp.msg).fadeIn(900);
397            $('.mailchimp-error').fadeOut(400);
398        } else if (resp.result === 'error') {
399            $('.mailchimp-error').html('' + resp.msg).fadeIn(900);
400        }
401	}
402	/*--------------------------
403	 Ajax Contact Form JS
404	---------------------------*/
405	const form = $('#contact-form'),
406	formMessages = $('.form-message');
407
408	 $(form).submit(function (e) {
409		 e.preventDefault();
410		 var formData = form.serialize();
411		 $.ajax({
412			 type: 'POST',
413			 url: form.attr('action'),
414			 data: formData
415		 }).done(function (response) {
416			 // Make sure that the formMessages div has the 'success' class.
417			 $(formMessages).removeClass('alert alert-danger');
418			 $(formMessages).addClass('alert alert-success fade show');
419
420			 // Set the message text.
421			 formMessages.html("<button type='button' class='close' data-dismiss='alert'>&times;</button>");
422			 formMessages.append(response);
423
424			 // Clear the form.
425			 $('#contact-form input,#contact-form textarea').val('');
426		 }).fail(function (data) {
427			 // Make sure that the formMessages div has the 'error' class.
428			 $(formMessages).removeClass('alert alert-success');
429			 $(formMessages).addClass('alert alert-danger fade show');
430
431			 // Set the message text.
432			 if (data.responseText !== '') {
433				 formMessages.html("<button type='button' class='close' data-dismiss='alert'>&times;</button>");
434				 formMessages.append(data.responseText);
435			 } else {
436				 $(formMessages).text('Oops! An error occurred and your message could not be sent.');
437			 }
438		 });
439	 });
440	/*--------------------------------
441	/* 	Scroll To Top
442	-------------------------------- */
443	function scrollToTop() {
444		var $scrollUp = $('.scroll-to-top'),
445			$lastScrollTop = 0,
446			$window = $(window);
447
448		$window.on('scroll', function () {
449			var topPos = $(this).scrollTop();
450			if (topPos > $lastScrollTop) {
451				$scrollUp.removeClass('show');
452			} else {
453				if ($window.scrollTop() > 200) {
454					$scrollUp.addClass('show');
455				} else {
456					$scrollUp.removeClass('show');
457				}
458			}
459			$lastScrollTop = topPos;
460		});
461
462		$scrollUp.on('click', function (evt) {
463			$('html, body').animate({
464				scrollTop: 0
465			}, 600);
466			evt.preventDefault();
467		});
468	}
469	scrollToTop();
470	/*----------------------------------------*/
471	/*  Nice Select
472	/*----------------------------------------*/
473	$(document).ready(function () {
474		$('.nice-select').niceSelect();
475	});
476	/*----------------------------------------*/
477	/*-----  Preloader
478	---------------------------------*/
479	$(window).on('load', function () {
480		$('#preloader').delay(350).fadeOut('slow')
481		$('body').delay(350).css({'overflow':'visible'});
482	});
483    
484})(jQuery);
485