https://event.unitedindiversity.org/assets/js/main.js

1/***************************************************
2==================== JS INDEX ======================
3****************************************************
401. PreLoader Js
5
6
7****************************************************/
8
9(function ($) {
10	"use strict";
11
12	var windowOn = $(window);
13	////////////////////////////////////////////////////
14	// 01. PreLoader Js
15	windowOn.on('load',function() {
16		$("#loading").fadeOut(500);
17	});
18
19	////////////////////////////////////////////////////
20	// 02. Mobile Menu Js
21	// $('#mobile-menu').meanmenu({
22	// 	meanMenuContainer: '.mobile-menu',
23	// 	meanScreenWidth: "991",
24	// 	meanExpand: ['<i class="fal fa-plus"></i>'],
25	// });
26
27	////////////////////////////////////////////////////
28	// 03. Sidebar Js
29	$(".offcanvas-toggle-btn").on("click", function () {
30		$(".offcanvas__area").addClass("opened");
31		$(".body-overlay").addClass("opened");
32	});
33	$(".offcanvas__close-btn").on("click", function () {
34		$(".offcanvas__area").removeClass("opened");
35		$(".body-overlay").removeClass("opened");
36	});
37
38
39	////////////////////////////////////////////////////
40	// 04. Body overlay Js
41	$(".body-overlay").on("click", function () {
42		$(".offcanvas__area").removeClass("opened");
43		$(".body-overlay").removeClass("opened");
44	});
45
46
47	////////////////////////////////////////////////////
48	// 05. Search Js
49	$(".search-toggle").on("click", function () {
50		$(".search__area").addClass("opened");
51	});
52	$(".search-close-btn").on("click", function () {
53		$(".search__area").removeClass("opened");
54	});
55
56
57	////////////////////////////////////////////////////
58	// 06. Sticky Header Js
59	windowOn.on('scroll', function () {
60		var scroll = $(window).scrollTop();
61		if (scroll < 100) {
62			$("#header-sticky").removeClass("header__sticky");
63		} else {
64			$("#header-sticky").addClass("header__sticky");
65		}
66	});
67
68
69	////////////////////////////////////////////////////
70	// 07. Data CSS Js
71	$("[data-background").each(function () {
72		$(this).css("background-image", "url( " + $(this).attr("data-background") + "  )");
73	});
74	
75	$("[data-width]").each(function () {
76		$(this).css("width", $(this).attr("data-width"));
77	});
78
79	$("[data-bg-color]").each(function () {
80        $(this).css("background-color", $(this).attr("data-bg-color"));
81    });
82
83	////////////////////////////////////////////////////
84	// 07. Nice Select Js
85	// $('select').niceSelect();
86
87	////////////////////////////////////////////////////
88	// 08. slider__active Slider Js
89	if (jQuery(".slider__active").length > 0) {
90		let sliderActive1 = ".slider__active";
91		let sliderInit1 = new Swiper(sliderActive1, {
92			// Optional parameters
93			slidesPerView: 1,
94			slidesPerColumn: 1,
95			paginationClickable: true,
96			loop: true,
97			effect: 'fade',
98
99			autoplay: {
100				delay: 5000,
101			},
102
103			// If we need pagination
104			pagination: {
105				el: ".ain-slider-paginations",
106				// dynamicBullets: true,
107				clickable: false,
108			},
109
110			// Navigation arrows
111			navigation: {
112				nextEl: ".slider-button-next",
113				prevEl: ".slider-button-prev",
114			},
115
116			a11y: false,
117		});
118
119		function animated_swiper(selector, init) {
120			let animated = function animated() {
121				$(selector + " [data-animation]").each(function () {
122					let anim = $(this).data("animation");
123					let delay = $(this).data("delay");
124					let duration = $(this).data("duration");
125
126					$(this)
127						.removeClass("anim" + anim)
128						.addClass(anim + " animated")
129						.css({
130							webkitAnimationDelay: delay,
131							animationDelay: delay,
132							webkitAnimationDuration: duration,
133							animationDuration: duration,
134						})
135						.one(
136							"webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend",
137							function () {
138								$(this).removeClass(anim + " animated");
139							}
140						);
141				});
142			};
143			animated();
144			// Make animated when slide change
145			init.on("slideChange", function () {
146				$(sliderActive1 + " [data-animation]").removeClass("animated");
147			});
148			init.on("slideChange", animated);
149		}
150
151		animated_swiper(sliderActive1, sliderInit1);
152	}
153
154
155	// var sliderr = new Swiper('.active', {
156	// 	slidesPerView: 1,
157	// 	spaceBetween: 30,
158	// 	loop: true,
159	// 	pagination: {
160	// 		el: ".testimonial-pagination",
161	// 		clickable: true,
162	// 		renderBullet: function (index, className) {
163	// 		  return '<span class="' + className + '">' + '<button>'+(index + 1)+'</button>' + "</span>";
164	// 		},
165	// 	},
166	// 	breakpoints: {
167	// 		'1200': {
168	// 			slidesPerView: 3,
169	// 		},
170	// 		'992': {
171	// 			slidesPerView: 2,
172	// 		},
173	// 		'768': {
174	// 			slidesPerView: 2,
175	// 		},
176	// 		'576': {
177	// 			slidesPerView: 1,
178	// 		},
179	// 		'0': {
180	// 			slidesPerView: 1,
181	// 		},
182	// 	},
183	// });
184
185	///////////////////////////////////////////////////
186	// 13. Masonary Js
187	$(".testimonial__active").owlCarousel({
188		//add owl carousel in activation class
189		loop: true,
190		margin: 30,
191		items: 4,
192		navText: ['<button class="nav-left"><i class="far fa-angle-left"></i></button>', '<button class="nav-right"><i class="far fa-angle-right"></i></button>'],
193		nav: false,
194		dots: true,
195		slideTransition: 'fadeOutLeft',
196		smartSpeed: 300,
197		responsive: {
198			0: {
199				items: 1
200			},
201			767: {
202				items: 2
203			},
204			992: {
205				items: 3
206			},
207			1200: {
208				items: 3
209			}
210		}
211	});
212
213
214	// course slider
215	// var swiper = new Swiper('.course__slider', {
216	// 	spaceBetween: 30,
217	// 	slidesPerView: 2,
218	// 	breakpoints: {  
219	// 		'768': {
220	// 			slidesPerView: 2,
221	// 		},
222	// 		'576': {
223	// 			slidesPerView: 1,
224	// 		},
225	// 		'0': {
226	// 			slidesPerView: 1,
227	// 		},
228	// 	},
229	// 	pagination: {
230	// 		el: '.swiper-pagination',
231	// 		clickable: true,
232	// 	},
233	// });
234
235	// var postboxSlider = new Swiper('.postbox__slider', {
236	// 	slidesPerView: 1,
237    //     spaceBetween: 0,
238	// 	loop: true,
239	// 	autoplay: {
240	// 	  delay: 3000,
241	// 	},
242	// 	// Navigation arrows
243	// 	navigation: {
244	// 		nextEl: ".postbox-slider-button-next",
245	// 		prevEl: ".postbox-slider-button-prev",
246	// 	},
247	// 	breakpoints: {  
248	// 		'1200': {
249	// 			slidesPerView: 1,
250	// 		},
251	// 		'992': {
252	// 			slidesPerView: 1,
253	// 		},
254	// 		'768': {
255	// 			slidesPerView: 1,
256	// 		},
257	// 		'576': {
258	// 			slidesPerView: 1,
259	// 		},
260	// 		'0': {
261	// 			slidesPerView: 1,
262	// 		},
263	// 	},
264	// });
265
266	////////////////////////////////////////////////////
267	// 13. Masonary Js
268	$('.grid').imagesLoaded(function () {
269		// init Isotope
270		var $grid = $('.grid').isotope({
271			itemSelector: '.grid-item',
272			percentPosition: true,
273			masonry: {
274				// use outer width of grid-sizer for columnWidth
275				columnWidth: 1,
276			}
277		});
278
279
280		// filter items on button click
281		$('.masonary-menu').on('click', 'button', function () {
282			var filterValue = $(this).attr('data-filter');
283			$grid.isotope({ filter: filterValue });
284		});
285
286		//for menu active class
287		$('.masonary-menu button').on('click', function (event) {
288			$(this).siblings('.active').removeClass('active');
289			$(this).addClass('active');
290			event.preventDefault();
291		});
292
293	});
294
295	/* magnificPopup img view */
296	$('.popup-image').magnificPopup({
297		type: 'image',
298		gallery: {
299			enabled: true
300		}
301	});
302
303	/* magnificPopup video view */
304	$(".popup-video").magnificPopup({
305		type: "iframe",
306	});
307
308	////////////////////////////////////////////////////
309	// 14. Wow Js
310	new WOW().init();
311
312	////////////////////////////////////////////////////
313	// 16. Cart Quantity Js
314	$('.cart-minus').click(function () {
315		var $input = $(this).parent().find('input');
316		var count = parseInt($input.val()) - 1;
317		count = count < 1 ? 1 : count;
318		$input.val(count);
319		$input.change();
320		return false;

321	});
322	$('.cart-plus').click(function () {
323		var $input = $(this).parent().find('input');
324		$input.val(parseInt($input.val()) + 1);
325		$input.change();
326		return false;
327	});
328
329	$(".cart-plus-minus").append('<div class="dec qtybutton">-</div><div class="inc qtybutton">+</div>');
330	$(".qtybutton").on("click", function () {
331		var $button = $(this);
332		var oldValue = $button.parent().find("input").val();
333		if ($button.text() == "+") {
334			var newVal = parseFloat(oldValue) + 1;
335		} else {
336			// Don't allow decrementing below zero
337			if (oldValue > 0) {
338				var newVal = parseFloat(oldValue) - 1;
339			} else {
340				newVal = 0;
341			}
342		}
343		$button.parent().find("input").val(newVal);
344	});
345
346	////////////////////////////////////////////////////
347	// 17. Show Login Toggle Js
348	$('#showlogin').on('click', function () {
349		$('#checkout-login').slideToggle(900);
350	});
351
352	////////////////////////////////////////////////////
353	// 18. Show Coupon Toggle Js
354	$('#showcoupon').on('click', function () {
355		$('#checkout_coupon').slideToggle(900);
356	});
357
358	////////////////////////////////////////////////////
359	// 19. Create An Account Toggle Js
360	$('#cbox').on('click', function () {
361		$('#cbox_info').slideToggle(900);
362	});
363
364	////////////////////////////////////////////////////
365	// 20. Shipping Box Toggle Js
366	$('#ship-box').on('click', function () {
367		$('#ship-box-info').slideToggle(1000);
368	});
369
370	////////////////////////////////////////////////////
371	// 21. Counter Js
372	$('.counter').counterUp({
373		delay: 10,
374		time: 1000
375	});
376
377	////////////////////////////////////////////////////
378	// 22. Parallax Js
379	if ($('.scene').length > 0) {
380		$('.scene').parallax({
381			scalarX: 10.0,
382			scalarY: 15.0,
383		});
384	};
385
386	////////////////////////////////////////////////////
387	// 23. InHover Active Js
388	$('.hover__active').on('mouseenter', function () {
389		$(this).addClass('active').parent().siblings().find('.hover__active').removeClass('active');
390	});
391
392
393})(jQuery);