https://preetishenoy.com/wp-content/themes/livre/assets/js/main.js

1"use strict";
2
3/* jshint esversion: 6, browser: true */
4$ = jQuery;
5
6var isRTL = $("body").hasClass("rtl");
7
8SmoothScroll({ stepSize: 55 });
9
10//- livre settings variable from wp localized
11var livre = livre_js_var;
12
13//- Mobile Menu Initialization
14function initMobileMenu() {
15	var mainMenu = $(".menu-main-wrapper .menu").length ? $(".menu-main-wrapper .menu") : $(".menu-main-dropdown .menu");
16	var mobileMenuWrap = $(".mobile-menu");
17	mobileMenuWrap.append(mainMenu.clone());
18
19	var menuItem = mobileMenuWrap.find(".menu-item-has-children > a");
20
21	menuItem.each(function () {
22		var subButton = '<button class="no-ui open-sub"><i class="dripicons-chevron-down"></i></button>';
23		$(this).append(subButton);
24	});
25
26	mobileMenuWrap.find(".open-sub").on("click", function (e) {
27		e.preventDefault();
28		$(this).toggleClass("active");
29		$(this).parent().next().slideToggle();
30	});
31
32	var $mobileUserMenu = $(".mobile-menu-wrap .menu-user-wrap");
33	var $mobileUserMenuTgr = $(".mobile-menu-wrap .menu-user-avatar");
34	$mobileUserMenuTgr.on('click', function () {
35		$mobileUserMenu.slideToggle(200);
36	});
37}
38
39//- Mega Menu Initialization
40function initMegaMenu() {
41
42	var menuWrap = $(".menu-main-wrapper");
43	var menu = menuWrap.find(".menu");
44	var menuItems = menu.find(" > .mega-menu");
45	var menuWrapWidth = menuWrap.innerWidth();
46	var menuWrapHeight = menuWrap.innerHeight();
47	var menuBg = $(".menu-main-background");
48	var menuOverlay = $(".menu-main-overlay");
49	var menuSubBg = $(".sub-bg-container");
50	var widthTimeout;
51
52	menuBg.width(menuWrapWidth);
53
54	if (!isRTL) {
55		menuSubBg.css("left", menuWrapWidth + 2);
56	} else {
57		menuSubBg.css("right", menuWrapWidth + 2);
58	}
59
60	//- Open Menu onclick
61	$(".hdr-widget--menu-main .menu-main-toggle").on("click", function (e) {
62		e.preventDefault();
63		if (!$(this).hasClass('is-active')) {
64			$(this).addClass("is-active");
65			menuWrap.addClass("is-active");
66			menuOverlay.addClass("is-active");
67		} else {
68			$(this).removeClass("is-active");
69			menuWrap.removeClass("is-active");
70			menuOverlay.removeClass("is-active");
71		}
72
73		$(".mobile-menu-wrap").slideToggle();
74	});
75
76	//- Close menu when overlay clicked
77	menuOverlay.on('click', function () {
78		menuOverlay.removeClass("is-active");
79		$(".menu-main-toggle").removeClass("is-active");
80		menuWrap.removeClass("is-active");
81	});
82
83	//- Open Menu on hover
84	$(".hdr-widget--menu-main.open-onhover").hoverIntent(function () {
85		var toggle = $(this).find(".menu-main-toggle");
86		if (!toggle.hasClass('is-active')) {
87			if (window.innerWidth > 991) {
88				toggle.addClass("is-active");
89				menuWrap.addClass("is-active");
90				menuOverlay.addClass("is-active");
91			}
92		}
93	}, function () {
94		$(this).find(".menu-main-toggle").removeClass("is-active");
95		menuWrap.removeClass("is-active");
96		menuOverlay.removeClass("is-active");
97	});
98
99	menuItems.hover(hoverIn, hoverOut);
100
101	function hoverIn() {
102		openMegaMenu(this);
103	}
104
105	function hoverOut() {
106		closeMegaMenu(this);
107	}
108
109	function openMegaMenu(el) {
110		var sub = $(el).find(">.sub-menu");
111		var subWidth = sub.innerWidth();
112		var subHeight = sub.innerHeight();
113		var hoverArea = $('<div class="hover-area"></div>');
114		var subBg = {
115			paddingBottom: $(el).data("pb") !== undefined && $(el).data("pb") !== "" ? parseInt($(el).data("pb")) : 0,
116			paddingRight: $(el).data("pr") !== undefined && $(el).data("pr") !== "" ? parseInt($(el).data("pr")) : 0,
117			background: $(el).data("bg")
118		};
119
120		clearTimeout(widthTimeout);
121
122		menuWrap.addClass("mega-open");
123
124		menuSubBg.css({
125			backgroundImage: 'url(' + subBg.background + ')',
126			opacity: 0
127		});
128
129		menuWrap.css({
130			width: menuWrapWidth + subWidth + subBg.paddingRight,
131			height: subHeight + 40 > menuWrapHeight ? subHeight + 40 + subBg.paddingBottom : menuWrapHeight + subBg.paddingBottom
132		});
133
134		menuWrap.on('transitionend', function () {
135			menuSubBg.css("opacity", 1);
136		});
137
138		$(el).append(hoverArea);
139
140		if (!isRTL) {
141			$(el).find(".hover-area").css({
142				left: menuWrapWidth,
143				top: -20,
144				width: subWidth + subBg.paddingRight,
145				height: subHeight + 40 > menuWrapHeight ? subHeight + 40 + subBg.paddingBottom : menuWrapHeight + subBg.paddingBottom
146			});
147		} else {
148			$(el).find(".hover-area").css({
149				right: menuWrapWidth,
150				top: -20,
151				width: subWidth + subBg.paddingRight,
152				height: subHeight + 40 > menuWrapHeight ? subHeight + 40 + subBg.paddingBottom : menuWrapHeight + subBg.paddingBottom
153			});
154		}
155
156		$(el).addClass('sub-open');
157		menuBg.addClass("sub-open");
158	}
159
160	function closeMegaMenu(el) {
161		$(el).removeClass("sub-open");
162
163		menuWrap.css({
164			height: menuWrapHeight
165		});
166
167		widthTimeout = setTimeout(function () {
168			menuWrap.css({
169				width: menuWrapWidth
170			});
171		}, 60);
172		menuWrap.removeClass("mega-open");
173		menuBg.removeClass("sub-open");
174		menuSubBg.css("opacity", 0);
175		$(el).find('.hover-area').remove();
176	}
177}
178
179//- Author Filterable Layout
180function authorIndexFilter() {
181	var $filterableItems = $('.author-index');
182	var $filterableNav = $('.browse-author-by-alphabet a');
183
184	$filterableItems.isotope({
185		filter: '*',
186		layoutMode: 'fitRows',
187		animationOptions: {
188			duration: 750,
189			easing: 'linear',
190			queue: false
191		}
192	});
193
194	$filterableNav.click(function (e) {
195		var selector = $(this).data('filter');
196
197		$filterableNav.removeClass('current');
198		$(this).addClass('current');
199
200		$filterableItems.isotope({
201			filter: selector
202		});
203		e.preventDefault();
204		return false;

205	});
206}
207
208//- Hero Carousel/Slider Initialization
209function initHeroCarousel() {
210	var carousel = $(".hero-carousel-wrap");
211	var carouselStyle = carousel.data("style");
212	var carouselDuration = parseInt(carousel.data("duration"));
213	var carouselFade = carousel.data('fade');
214	var carouselEl = $(".hero-carousel");
215
216	switch (carouselStyle) {
217		case 'style-2':
218			carouselEl.slick({
219				lazyload: 'ondemand',
220				slidesToShow: 1,
221				infinite: true,
222				dots: true,
223				arrows: true,
224				autoplay: true,
225				prevArrow: '<button type="button" class="no-ui slick-prev"><i class="dripicons-chevron-left"></i></button>',
226				nextArrow: '<button type="button" class="no-ui slick-next"><i class="dripicons-chevron-right"></i></button>',
227				fade: carouselFade,
228				autoplaySpeed: carouselDuration
229			});
230			break;
231
232		default:
233			carouselEl.slick({
234				lazyload: 'ondemand',
235				slidesToShow: 1,
236				centerPadding: '400px',
237				centerMode: true,
238				infinite: true,
239				dots: false,
240				arrows: false,
241				autoplay: true,
242				autoplaySpeed: carouselDuration,
243				responsive: [{
244					breakpoint: 1700,
245					settings: { centerPadding: '300px' }
246				}, {
247					breakpoint: 1600,
248					settings: { centerPadding: '200px' }
249				}, {
250					breakpoint: 1300,
251					settings: { centerPadding: '150px' }
252				}, {
253					breakpoint: 1024,
254					settings: { centerPadding: '0' }
255				}]
256			});
257
258	}
259}
260
261//- Look Inside Book Initialization
262function initLookInside() {
263
264	var el = $(".tokoo-look-inside");
265	var zoomIn = el.find(".preview-zoom-in");
266	var zoomOut = el.find(".preview-zoom-out");
267	var pages = el.find(".book-pages");
268	var box = el.find(".look-inside-box");
269	var tabDetail = el.find(".toggle-detail-tab");
270	var tabRelated = el.find(".toggle-related-tab");
271
272	$(".look-inside__close").on("click", function () {
273		el.fadeOut();
274	});
275
276	tabDetail.on("click", function () {
277		box.toggleClass("tab-detail-active");
278	});
279	tabRelated.on("click", function () {
280		box.toggleClass("tab-related-active");
281	});
282
283	zoomIn.on("click", function (e) {
284		e.preventDefault();
285		console.log("zoom in");
286		if (pages.innerWidth() > 1200) return;
287		pages.css({
288			width: pages.innerWidth() + 100
289		});
290	});
291	zoomOut.on("click", function (e) {
292		e.preventDefault();
293		console.log("zoom out");
294		if (pages.innerWidth() < 600) return;
295		pages.css({
296			width: pages.innerWidth() - 100
297		});
298	});
299}
300
301//- Product Search Goodies
302function initProductSearch() {
303	var input = $(".product-search-input input");
304
305	input.on('keyup', function () {
306		if ($(this).val() !== '') {
307			$(this).addClass('dirty');
308		} else {
309			$(this).removeClass('dirty');
310		}
311	});
312}
313
314//- Masonry layout initialization
315function initMasonryLayout() {
316	$(".post-masonry").isotope({
317		layoutMode: 'masonry'
318	});
319	if ($("html").hasClass('no-flexbox')) {
320		$(".post-grid").isotope({
321			layoutMode: 'masonry'
322		});
323	}
324}
325
326//- Parallax Goodies
327function initGoodies() {
328	var controller = new ScrollMagic.Controller();
329
330	//- Page Header
331	var pageHeader = new ScrollMagic.Scene({
332		triggerHook: 0,
333		triggerElement: '.site-header',
334		duration: '100%'
335	}).setTween(TweenMax.to('.page-header-bg .bg', 1, {
336		y: '50%'
337	})).addTo(controller);
338
339	//- Single Post Image
340	var singlePostImage = new ScrollMagic.Scene({
341		triggerHook: 0.4,
342		triggerElement: ".site-header",
343		duration: '200%'
344	}).setTween(TweenMax.to('.post__image .bg', 1, {
345		y: '50%'
346	})).addTo(controller);
347
348	$(".post__share a").on("mouseenter", function () {
349		$(this).addClass("animated").on("animationend", function () {
350			$(this).removeClass("animated");
351		});
352	});
353
354	$(".see-back").on("click", function () {
355		$(this).parents(".book-images").find(".book").toggleClass("back-view");
356	});
357}
358
359//- Init Tokoo Map initialization
360function initMap() {
361	$(".tokoo-map").each(function () {
362		var mapEl = $(this),
363		    lat = parseFloat(mapEl.data("lat")),
364		    lon = parseFloat(mapEl.data("lon")),
365		    markerImage = mapEl.data("marker-image"),
366		    style = mapEl.siblings(".map-style").length ? JSON.parse(mapEl.siblings(".map-style").html()) : [],
367		    height = parseInt(mapEl.data("height")),
368		    title = mapEl.data("title"),
369		    content = mapEl.data("content"),
370		    zoom = mapEl.data("zoom") ? mapEl.data("zoom") : 13;
371
372		mapEl.height(height);
373		mapEl.gmap3({
374			map: {
375				options: {
376					center: [lat, lon],
377					zoom: zoom,
378					mapTypeId: google.maps.MapTypeId.ROADMAP,
379					mapTypeControl: false,
380					navigationControl: true,
381					scrollwheel: false,
382					streetViewControl: false,
383					styles: style
384				}
385			},
386			marker: {
387				latLng: [lat, lon],
388				data: "<div class='tokoo-info-window'><h2>" + title + "</h2>" + content + "</div>",
389				options: {
390					icon: markerImage
391				},
392				events: {
393					click: function click(marker, event, context) {
394
395						var thisMap = $(this).gmap3("get"),
396						    infowindow = $(this).gmap3({
397							get: {
398								name: "infowindow"
399							}
400						});
401						console.log(infowindow);
402
403						if (infowindow) {
404							infowindow.open(thisMap, marker);
405							infowindow.setContent(context.data);
406						} else {
407							$(this).gmap3({
408								infowindow: {
409									anchor: marker,
410									options: {
411										content: context.data
412									}
413								}
414							});
415						}
416					}
417				}
418			}
419		});
420	});
421}
422
423//- Social Sharing System
424function initSocialShare() {
425	$(".post__share").each(function () {
426		var title = $(this).data("title"),
427		    text = $(this).data("text"),
428		    image = $(this).data("image"),
429		    url = $(this).data("url"),
430		    width = $(this).data("width"),
431		    height = $(this).data("height");
432
433		$(this).find("a").ShareLink({
434			title: title,
435			text: text,
436			image: image,
437			url: url,
438			width: width,
439			height: height
440		});
441	});
442}
443
444//- Flexslider initialization [used on tokoo widget]
445function initFlexSlider() {
446	$(".gallery-slider,.koo-image-slider").flexslider({
447		animation: 'slide',
448		controlNav: false,
449		animationLoop: false,
450		prevText: '<i class="dripicons-chevron-left"></i>',
451		nextText: '<i class="dripicons-chevron-right"></i>'
452	});
453}
454
455//- Countdown UI Initialization
456function initCountdown() {
457	$(".product-date-count-down").each(function () {
458		var dateline = $(this).data("date");
459		$(this).countdown(dateline, function (event) {
460			var $this = $(this).html(event.strftime("\n\t\t\t\t\t\t\t<div class=\"count-num\"><span class=\"timer\">%D</span><span class=\"label\">" + livre_translate.days + "</span></div>\n\t\t\t\t\t\t\t<div class=\"count-num\"><span class=\"timer\">%H</span><span class=\"label\">" + livre_translate.hr + "</span></div>\n\t\t\t\t\t\t\t<div class=\"count-num\"><span class=\"timer\">%M</span><span class=\"label\">" + livre_translate.min + "</span></div>\n\t\t\t\t\t\t\t<div class=\"count-num\"><span class=\"timer\">%S</span><span class=\"label\">" + livre_translate.sec + "</span></div>\n\t\t\t\t\t\t"));
461		});
462	});
463}
464
465//- Audio Playlist Hook
466function tokooAudioPlaylist() {
467	var musicCover = $(".music-cover-wrap");
468	var playButton = musicCover.find(".play");
469	var player = $(".product-overview").find("audio")[0];
470
471	if (musicCover.length) {
472		$(document).on('click', '.music-cover .play', function () {
473			if (player.paused) {
474				player.play();
475				musicCover.find(".music-cover").addClass("is-playing");
476			} else {
477				player.pause();
478				musicCover.find(".music-cover").removeClass("is-playing");
479			}
480		});
481		player.addEventListener('play', function () {
482			musicCover.find(".music-cover").addClass("is-playing");
483		}, false);
484		player.addEventListener('pause', function () {
485			musicCover.find(".music-cover").removeClass("is-playing");
486		}, false);
487	}
488}
489
490//- Deal tab navigation
491function dealNavTab() {
492	var el = $(".deal-tab-grid");
493
494	el.on("click", ".deal-tab-nav a", function (e) {
495		e.preventDefault();
496		var target = $(this).attr('href');
497
498		$(this).parent().siblings().removeClass('active');
499		$(this).parent().addClass('active');
500
501		el.find('.deal-tab-pane').removeClass('active');
502		$(target).addClass('active');
503	});
504}
505
506function initStickyHeader() {
507	var header = $(".site-header-wrap");
508	var headerH = header.find('.site-header').innerHeight();
509	if (header.hasClass("is-sticky")) {
510		header.css({ height: headerH + 'px' });
511	}
512}
513
514$(document).ready(function () {
515	initStickyHeader();
516	initMobileMenu();
517	initHeroCarousel();
518	initProductSearch();
519	initMasonryLayout();
520	initGoodies();
521	initMap();
522	initSocialShare();
523	initLookInside();
524	initCountdown();
525	dealNavTab();
526
527	$(".livre-lazyload").lazyload({
528		load: function load(self, elements_left, settings) {
529			$(this).addClass('lazy-loaded');
530		}
531	});
532
533	$(".see-gallery").hover(function () {
534		$(".movie-case").addClass("is-open");
535	}, function () {
536		$(".movie-case").removeClass("is-open");
537	});
538
539	$(".see-inside").on("click", function (e) {
540		e.preventDefault();
541		$(".tokoo-look-inside").fadeIn();
542	});
543
544	$(".venobox").venobox();
545
546	$(".open-login-popup").on("click", function (e) {
547		if ($("body").hasClass("woocommerce-account")) {
548			return false;

549		}
550		$(".user-auth-box").fadeIn();
551		e.preventDefault();
552	});
553
554	if ($('.user-auth-box .woocommerce-error').length) {
555		// console.log("testing");
556		// console.log($(".open-login-popup").length)
557		$(".open-login-popup").trigger('click');
558	}
559	
560	$(".user-auth-box .tokoo-popup__close").on("click", function () {
561		$(this).parents(".tokoo-popup").fadeOut();
562	});
563
564	$(".author-area").stick_in_parent().on('sticky_kit:bottom', function (e) {
565		$(this).parent().css('position', 'static');
566	}).on('sticky_kit:unbottom', function (e) {
567		$(this).parent().css('position', 'relative');
568	});
569
570	$(".hdr-widget--menu-cart").on('click', function (e) {
571		e.stopPropagation();
572		if ($(".mobile-menu-wrap").is(":visible")) {
573			$(".mobile-menu-wrap").hide();
574			$(".menu-main-overlay").removeClass("is-active");
575			$(".menu-main-toggle").removeClass("is-active");
576		}
577	});
578
579	var searchForm = $('.search-dropdown');
580	var searchInput = searchForm.find('input');
581	var searchToggle = searchForm.find('.search-dropdown-toggle');
582
583	searchToggle.click(function (e) {
584		e.preventDefault();
585		searchForm.toggleClass('search-open');
586		setTimeout(function () {
587			searchInput.focus();
588		}, 350);
589	});
590});
591
592$(window).resize(function () {
593	initStickyHeader();
594});
595
596$(window).load(function () {
597
598	initMegaMenu();
599	initMasonryLayout();
600	initFlexSlider();
601	authorIndexFilter();
602	tokooAudioPlaylist();
603	initStickyHeader();
604});