(function ($) {
"use strict";
/*=================================
JS Index Here
==================================*/
/*
01. On Load Function
02. Preloader
03. Mobile Menu
04. Sticky fix
05. Scroll To Top
06. Set Background Image Color & Mask
07. Global Slider
08. Ajax Contact Form
09. Search Box Popup
10. Popup Sidemenu
11. Magnific Popup
12. Section Position
13. Filter
14. Counter Up
15. Shape Mockup
16. Progress Bar Animation
17. Countdown
18. Image to SVG Code
00. Woocommerce Toggle
00. Right Click Disable
*/
/*=================================
JS Index End
==================================*/
/*
/*---------- 01. On Load Function ----------*/
$(window).on("load", function () {
$(".preloader").fadeOut();
});
// $('select').niceSelect();
if ($('.nice-select').length) {
$('.nice-select').niceSelect();
}
/*---------- 02. Preloader ----------*/
if ($(".preloader").length > 0) {
$(".preloaderCls").each(function () {
$(this).on("click", function (e) {
e.preventDefault();
$(".preloader").css("display", "none");
});
});
}
$(document).ready(function () {
setTimeout(function () {
$('#loader').addClass('loaded');
// Once the container has finished, the scroll appears
if ($('#loader').hasClass('loaded')) {
// It is so that once the container is gone, the entire preloader section is deleted
$('#preloader').delay(9000).queue(function () {
$(this).remove();
});
}
}, 3000);
});
/*---------- 03. Mobile Menu ----------*/
$.fn.thmobilemenu = function (options) {
var opt = $.extend({
menuToggleBtn: ".th-menu-toggle",
bodyToggleClass: "th-body-visible",
subMenuClass: "th-submenu",
subMenuParent: "menu-item-has-children",
thSubMenuParent: "th-item-has-children",
subMenuParentToggle: "th-active",
meanExpandClass: "th-mean-expand",
// appendElement: '',
subMenuToggleClass: "th-open",
toggleSpeed: 400,
},
options
);
return this.each(function () {
var menu = $(this); // Select menu
// Menu Show & Hide
function menuToggle() {
menu.toggleClass(opt.bodyToggleClass);
// collapse submenu on menu hide or show
var subMenu = "." + opt.subMenuClass;
$(subMenu).each(function () {
if ($(this).hasClass(opt.subMenuToggleClass)) {
$(this).removeClass(opt.subMenuToggleClass);
$(this).css("display", "none");
$(this).parent().removeClass(opt.subMenuParentToggle);
}
});
}
// Class Set Up for every submenu
menu.find("." + opt.subMenuParent).each(function () {
var submenu = $(this).find("ul");
submenu.addClass(opt.subMenuClass);
submenu.css("display", "none");
$(this).addClass(opt.subMenuParent);
$(this).addClass(opt.thSubMenuParent); // Add th-item-has-children class
$(this).children("a").append(opt.appendElement);
});
// Toggle Submenu
function toggleDropDown($element) {
var submenu = $element.children("ul");
if (submenu.length > 0) {
$element.toggleClass(opt.subMenuParentToggle);
submenu.slideToggle(opt.toggleSpeed);
submenu.toggleClass(opt.subMenuToggleClass);
}
}
// Submenu toggle Button
var itemHasChildren = "." + opt.thSubMenuParent + " > a";
$(itemHasChildren).each(function () {
$(this).on("click", function (e) {
e.preventDefault();
toggleDropDown($(this).parent());
});
});
// Menu Show & Hide On Toggle Btn click
$(opt.menuToggleBtn).each(function () {
$(this).on("click", function () {
menuToggle();
});
});
// Hide Menu On outside click
menu.on("click", function (e) {
e.stopPropagation();
menuToggle();
});
// Stop Hide full menu on menu click
menu.find("div").on("click", function (e) {
e.stopPropagation();
});
});
};
$(".th-menu-wrapper").thmobilemenu();
/*----------- 3. One Page Nav ----------*/
function onePageNav(element) {
if ($(element).length > 0) {
$(element).each(function () {
var link = $(this).find('a');
$(this).find(link).each(function () {
$(this).on('click', function () {
var target = $(this.getAttribute('href'));
if (target.length) {
event.preventDefault();
$('html, body').stop().animate({
scrollTop: target.offset().top - 10
}, 1000);
};
});
});
})
}
};
onePageNav('.onepage-nav');
onePageNav('.scroll-down');
//one page sticky menu
$(window).on('scroll', function () {
if ($('.onepage-nav').length > 0) {};
});
/*---------- 04. Sticky fix ----------*/
$(window).scroll(function () {
var topPos = $(this).scrollTop();
if (topPos > 500) {
$('.sticky-wrapper').addClass('sticky');
$('.category-menu').addClass('close-category');
} else {
$('.sticky-wrapper').removeClass('sticky')
$('.category-menu').removeClass('close-category');
}
})
$(".menu-expand").each(function () {
$(this).on("click", function (e) {
e.preventDefault();
$('.category-menu').toggleClass('open-category');
});
});
/*---------- 05. Scroll To Top ----------*/
if ($('.scroll-top').length > 0) {
var scrollTopbtn = document.querySelector('.scroll-top');
var progressPath = document.querySelector('.scroll-top path');
var pathLength = progressPath.getTotalLength();
progressPath.style.transition = progressPath.style.WebkitTransition = 'none';
progressPath.style.strokeDasharray = pathLength + ' ' + pathLength;
progressPath.style.strokeDashoffset = pathLength;
progressPath.getBoundingClientRect();
progressPath.style.transition = progressPath.style.WebkitTransition = 'stroke-dashoffset 10ms linear';
var updateProgress = function () {
var scroll = $(window).scrollTop();
var height = $(document).height() - $(window).height();
var progress = pathLength - (scroll * pathLength / height);
progressPath.style.strokeDashoffset = progress;
}
updateProgress();
$(window).scroll(updateProgress);
var offset = 50;
var duration = 750;
jQuery(window).on('scroll', function () {
if (jQuery(this).scrollTop() > offset) {
jQuery(scrollTopbtn).addClass('show');
} else {
jQuery(scrollTopbtn).removeClass('show');
}
});
jQuery(scrollTopbtn).on('click', function (event) {
event.preventDefault();
jQuery('html, body').animate({
scrollTop: 0
}, duration);
return false;
})
}
/*---------- 06. Set Background Image Color & Mask ----------*/
if ($("[data-bg-src]").length > 0) {
$("[data-bg-src]").each(function () {
var src = $(this).attr("data-bg-src");
$(this).css("background-image", "url(" + src + ")");
$(this).removeAttr("data-bg-src").addClass("background-image");
});
}
if ($('[data-bg-color]').length > 0) {
$('[data-bg-color]').each(function () {
var color = $(this).attr('data-bg-color');
$(this).css('background-color', color);
$(this).removeAttr('data-bg-color');
});
};
$('[data-border]').each(function () {
var borderColor = $(this).data('border');
$(this).css('--th-border-color', borderColor);
});
if ($('[data-mask-src]').length > 0) {
$('[data-mask-src]').each(function () {
var mask = $(this).attr('data-mask-src');
$(this).css({
'mask-image': 'url(' + mask + ')',
'-webkit-mask-image': 'url(' + mask + ')'
});
$(this).addClass('bg-mask');
$(this).removeAttr('data-mask-src');
});
};
/*----------- 07. Global Slider ----------*/
$('.th-slider').each(function () {
var thSlider = $(this);
var settings = $(this).data('slider-options');
// Store references to the navigation Slider
var prevArrow = thSlider.find('.slider-prev');
var nextArrow = thSlider.find('.slider-next');
var paginationElN = thSlider.find('.slider-pagination.pagi-number');
var paginationExternel = thSlider.siblings('.slider-controller').find('.slider-pagination');
var paginationEl = paginationExternel.length ? paginationExternel.get(0) : thSlider.find('.slider-pagination').get(0);
var paginationType = settings['paginationType'] || 'bullets';
var autoplayconditon = settings['autoplay'];
var sliderDefault = {
slidesPerView: 1,
spaceBetween: settings['spaceBetween'] || 24,
loop: settings['loop'] !== false,
speed: settings['speed'] || 1000,
autoplay: autoplayconditon || {
delay: 6000,
disableOnInteraction: false
},
navigation: {
nextEl: nextArrow.get(0),
prevEl: prevArrow.get(0),
},
pagination: {
el: paginationEl,
type: paginationType,
clickable: true,
renderBullet: function (index, className) {
var number = index + 1;
var formattedNumber = number < 10 ? '0' + number : number;
if (paginationElN.length) {
return '' + formattedNumber + '';
} else {
return '';
}
},
formatFractionCurrent: function (number) {
return number < 10 ? '0' + number : number;
},
formatFractionTotal: function (number) {
return number < 10 ? '0' + number : number;
}
},
on: {
slideChange: function () {
setTimeout(function () {
swiper.params.mousewheel.releaseOnEdges = false;
}, 500);
},
reachEnd: function () {
setTimeout(function () {
swiper.params.mousewheel.releaseOnEdges = true;
}, 750);
}
}
};
var options = JSON.parse(thSlider.attr('data-slider-options'));
options = $.extend({}, sliderDefault, options);
var swiper = new Swiper(thSlider.get(0), options); // Assign the swiper variable
if ($('.slider-area').length > 0) {
$('.slider-area').closest(".container").parent().addClass("arrow-wrap");
}
// Category slider specific wheel effect
if (thSlider.hasClass('categorySlider')) {
const multiplier = {
translate: 0.1,
rotate: 0.01
};
function calculateWheel() {
const slides = document.querySelectorAll('.single');
slides.forEach((slide) => {
const rect = slide.getBoundingClientRect();
const r = window.innerWidth * 0.5 - (rect.x + rect.width * 0.5);
let ty = Math.abs(r) * multiplier.translate - rect.width * multiplier.translate;
if (ty < 0) {
ty = 0;
}
const transformOrigin = r < 0 ? 'left top' : 'right top';
slide.style.transform = `translate(0, ${ty}px) rotate(${-r * multiplier.rotate}deg)`;
slide.style.transformOrigin = transformOrigin;
});
}
function raf() {
requestAnimationFrame(raf);
calculateWheel();
}
raf();
}
});
// Function to add animation classes
function animationProperties() {
$('[data-ani]').each(function () {
var animationName = $(this).data('ani');
$(this).addClass(animationName);
});
$('[data-ani-delay]').each(function () {
var delayTime = $(this).data('ani-delay');
$(this).css('animation-delay', delayTime);
});
}
animationProperties();
// Add click event handlers for external slider arrows based on data attributes
$('[data-slider-prev], [data-slider-next]').on('click', function () {
var sliderSelector = $(this).data('slider-prev') || $(this).data('slider-next');
var targetSlider = $(sliderSelector);
if (targetSlider.length) {
var swiper = targetSlider[0].swiper;
if (swiper) {
if ($(this).data('slider-prev')) {
swiper.slidePrev();
} else {
swiper.slideNext();
}
}
}
});
// Function to add animation classes
function animationProperties() {
$('[data-ani]').each(function () {
var animationName = $(this).data('ani');
$(this).addClass(animationName);
});
$('[data-ani-delay]').each(function () {
var delayTime = $(this).data('ani-delay');
$(this).css('animation-delay', delayTime);
});
}
animationProperties();
// Add click event handlers for external slider arrows based on data attributes
$('[data-slider-prev], [data-slider-next]').on('click', function () {
var sliderSelectors = ($(this).data('slider-prev') || $(this).data('slider-next')).split(', ');
sliderSelectors.forEach(function (sliderSelector) {
var targetSlider = $(sliderSelector);
if (targetSlider.length) {
var swiper = targetSlider[0].swiper;
if (swiper) {
if ($(this).data('slider-prev')) {
swiper.slidePrev();
} else {
swiper.slideNext();
}
}
}
});
});
var swiper = new Swiper(".heroThumbs", {
spaceBetween: 10,
slidesPerView: 2,
loop: true,
watchSlidesProgress: true,
slideToClickedSlide: true,
watchSlidesVisibility: true,
centeredSlidesBounds: true,
});
var swiper = new Swiper('.hero-slider-2', {
spaceBetween: 10,
thumbs: {
swiper: swiper,
},
effect: "fade",
pagination: {
el: '.swiper-pagination',
clickable: true
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev'
},
autoplay: {
delay: 6000,
disableOnInteraction: false
},
loop: true,
watchSlidesProgress: true
});
/* hero-3 start */
var swiper = new Swiper(".hero3Thumbs", {
spaceBetween: 10,
slidesPerView: 1,
freeMode: true,
watchSlidesProgress: true,
});
var swiper = new Swiper('.hero-slider-3', {
thumbs: {
swiper: swiper,
},
loop: true,
effect: "fade",
autoplay: {
delay: 6000,
disableOnInteraction: false
},
pagination: {
el: '.swiper-pagination',
type: 'fraction',
formatFractionCurrent: function (number) {
return '0' + number;
}
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev'
}
});
/* hero-3 end */
/* hero-6 start */
var swiper = new Swiper(".hero6Thumbs", {
spaceBetween: 3,
slidesPerView: 1,
freeMode: true,
watchSlidesProgress: true,
});
var swiper = new Swiper('.hero-slider-6', {
thumbs: {
swiper: swiper,
},
loop: true,
effect: "fade",
autoplay: {
delay: 6000,
disableOnInteraction: false
},
pagination: {
el: '.swiper-pagination',
type: 'fraction',
formatFractionCurrent: function (number) {
return '' + number;
}
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev'
}
});
/* hero-6 end */
/* hero-6 start */
var swiper = new Swiper(".hero6Thumbs", {
spaceBetween: 3,
slidesPerView: 1,
freeMode: true,
watchSlidesProgress: true,
});
var swiper = new Swiper('.hero-slider-6', {
thumbs: {
swiper: swiper,
},
loop: true,
effect: "fade",
autoplay: {
delay: 6000,
disableOnInteraction: false
},
pagination: {
el: '.swiper-pagination',
type: 'fraction',
formatFractionCurrent: function (number) {
return '' + number;
}
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev'
}
});
/* hero-6 end */
/* hero-10 start */
var swiper = new Swiper(".hero9Thumbs", {
spaceBetween: 10,
slidesPerView: 1,
freeMode: true,
watchSlidesProgress: true,
});
var swiper = new Swiper('.hero-slider-9', {
thumbs: {
swiper: swiper,
},
loop: true,
effect: "fade",
autoplay: {
delay: 6000,
disableOnInteraction: false
},
pagination: {
el: '.swiper-pagination',
type: 'fraction',
formatFractionCurrent: function (number) {
return '0' + number;
}
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev'
}
});
/* hero-3 end */
/* hero-10 start */
var swiper = new Swiper(".hero10Thumbs", {
spaceBetween: 10,
slidesPerView: 3,
freeMode: true,
watchSlidesProgress: true,
});
var swiper = new Swiper('.hero-slider-10', {
spaceBetween: 10,
thumbs: {
swiper: swiper,
},
effect: "fade",
pagination: {
el: '.swiper-pagination',
type: 'fraction',
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev'
},
autoplay: {
delay: 6000,
disableOnInteraction: false
},
loop: true,
watchSlidesProgress: true
});
/* hero-10 end */
// var swiperEl = document.querySelector('.swiper-container');
// swiperEl.addEventListener('mouseenter', function(event) {
document.addEventListener('mouseenter', event => {
const el = event.target;
if (el && el.matches && el.matches('.swiper-container')) {
// console.log('mouseenter');
// console.log('autoplay running', swiper.autoplay.running);
el.swiper.autoplay.stop();
el.classList.add('swiper-paused');
const activeNavItem = el.querySelector('.swiper-pagination-bullet-active');
activeNavItem.style.animationPlayState = "paused";
}
}, true);
document.addEventListener('mouseleave', event => {
// console.log('mouseleave', swiper.activeIndex, swiper.slides[swiper.activeIndex].progress);
// console.log('autoplay running', swiper.autoplay.running);
const el = event.target;
if (el && el.matches && el.matches('.swiper-container')) {
el.swiper.autoplay.start();
el.classList.remove('swiper-paused');
const activeNavItem = el.querySelector('.swiper-pagination-bullet-active');
activeNavItem.classList.remove('swiper-pagination-bullet-active');
// activeNavItem.style.animation = 'none';
setTimeout(() => {
activeNavItem.classList.add('swiper-pagination-bullet-active');
// activeNavItem.style.animation = '';
}, 10);
}
}, true);
/* category slider 1 start ---------------------*/
// $(document).ready(function () {
// $('.categorySlider').each(function () {
// const multiplier = {
// translate: .1,
// rotate: .01
// }
// new Swiper('.categorySlider', {
// slidesPerView: 5,
// spaceBetween: 60,
// centeredSlides: true,
// loop: true,
// grabCursor: true,
// pagination: {
// el: ".swiper-pagination",
// clickable: true,
// },
// breakpoints: {
// 300: {
// slidesPerView: 1,
// spaceBetween: 10
// },
// 600: {
// slidesPerView: 2,
// spaceBetween: 30
// },
// 768: {
// slidesPerView: 3,
// spaceBetween: 30
// },
// 1024: {
// slidesPerView: 4,
// spaceBetween: 40
// },
// 1280: {
// slidesPerView: 5,
// spaceBetween: 60
// }
// }
// });
// function calculateWheel() {
// const slides = document.querySelectorAll('.single')
// slides.forEach((slide, i) => {
// const rect = slide.getBoundingClientRect()
// const r = window.innerWidth * .5 - (rect.x + rect.width * .5)
// let ty = Math.abs(r) * multiplier.translate - rect.width * multiplier.translate
// if (ty < 0) {
// ty = 0
// }
// const transformOrigin = r < 0 ? 'left top' : 'right top'
// slide.style.transform = `translate(0, ${ty}px) rotate(${-r * multiplier.rotate}deg)`
// slide.style.transformOrigin = transformOrigin
// })
// }
// function raf() {
// requestAnimationFrame(raf)
// calculateWheel()
// }
// raf();
// });
// });
/* category slider 1 end ---------------------*/
/* category slider 2 start ---------------------*/
$(document).ready(function () {
$('.categorySlider2').each(function () {
const multiplier = {
translate: .1,
rotate: .0
}
new Swiper('.categorySlider2', {
slidesPerView: 'auto',
slidesPerView: 5,
spaceBetween: 60,
centeredSlides: true,
loop: true,
grabCursor: true,
pagination: {
el: ".swiper-pagination",
clickable: true,
},
breakpoints: {
300: {
slidesPerView: 1,
spaceBetween: 30
},
600: {
slidesPerView: 2,
spaceBetween: 30
},
768: {
slidesPerView: 3,
spaceBetween: 30
},
1024: {
slidesPerView: 4,
spaceBetween: 40
},
1280: {
slidesPerView: 5,
spaceBetween: 60
}
}
});
function calculateWheel() {
const slides = document.querySelectorAll('.single2')
slides.forEach((slide, i) => {
const rect = slide.getBoundingClientRect()
const r = window.innerWidth * .5 - (rect.x + rect.width * .5)
let ty = Math.abs(r) * multiplier.translate - rect.width * multiplier.translate
if (ty < 0) {
ty = 0
}
const transformOrigin = r < 0 ? 'left top' : 'right top'
slide.style.transform = `translate(0, ${ty}px) rotate(${-r * multiplier.rotate}deg)`
slide.style.transformOrigin = transformOrigin
})
}
function raf() {
requestAnimationFrame(raf)
calculateWheel()
}
raf();
});
});
/* category slider 3 start ---------------------*/
/* category slider 2 start ---------------------*/
$(document).ready(function () {
$('.categorySlider6').each(function () {
const multiplier = {
translate: .1,
rotate: .0
}
new Swiper('.categorySlider6', {
slidesPerView: 'auto',
slidesPerView: 5,
spaceBetween: 30,
centeredSlides: true,
loop: true,
grabCursor: true,
pagination: {
el: ".swiper-pagination",
type: "progressbar",
},
breakpoints: {
300: {
slidesPerView: 1,
spaceBetween: 30
},
575: {
slidesPerView: 2,
spaceBetween: 30
},
1024: {
slidesPerView: 3,
spaceBetween: 30
},
1200: {
slidesPerView: 4,
spaceBetween: 30
},
1380: {
slidesPerView: 5,
spaceBetween: 30
}
}
});
function calculateWheel() {
const slides = document.querySelectorAll('.single2')
slides.forEach((slide, i) => {
const rect = slide.getBoundingClientRect()
const r = window.innerWidth * .5 - (rect.x + rect.width * .5)
let ty = Math.abs(r) * multiplier.translate - rect.width * multiplier.translate
if (ty < 0) {
ty = 0
}
const transformOrigin = r < 0 ? 'left top' : 'right top'
slide.style.transform = `translate(0, ${ty}px) rotate(${-r * multiplier.rotate}deg)`
slide.style.transformOrigin = transformOrigin
})
}
function raf() {
requestAnimationFrame(raf)
calculateWheel()
}
raf();
});
});
/* category slider 2 end ---------------------*/
/*-------------- 09. Custom destination Slider -------------*/
$('.destination-list-wrap').on('click', function () {
$(this).addClass('active').siblings().removeClass('active');
});
function showNextdestination() {
var $activedestination = $('.destination-list-area .destination-list-wrap.active');
if ($activedestination.next().length > 0) {
$activedestination.removeClass('active');
$activedestination.next().addClass('active');
} else {
$activedestination.removeClass('active');
$('.destination-list-area .destination-list-wrap:first').addClass('active');
}
}
function showPreviousdestination() {
var $activedestination = $('.destination-list-area .destination-list-wrap.active');
if ($activedestination.prev().length > 0) {
$activedestination.removeClass('active');
$activedestination.prev().addClass('active');
} else {
$activedestination.removeClass('active');
$('.destination-list-area .destination-list-wrap:last').addClass('active');
}
}
$('.destination-prev').on('click', function () {
showPreviousdestination();
});
$('.destination-next').on('click', function () {
showNextdestination();
});
// Show the first tab and hide the rest
$('.accordion-item-wrapp li:first-child').addClass('active');
$('.according-img-tab').hide();
$('.according-img-tab:first').show();
// Click function
$('.accordion-item-wrapp .accordion-item-content').mouseenter(function () {
$('.accordion-item-wrapp .accordion-item-content').removeClass('active');
// $(this).addClass('active');
$('.according-img-tab').hide();
var activeTab = $(this).find('.accordion-tab-item').attr('data-bs-target');
$(activeTab).fadeIn();
return false;
});
/* offer-deals end */
/* testimonial start --------------------*/
// $(document).on('mouseover', '.hover-item', function () {
// $(this).addClass('item-active');
// $('.hover-item').removeClass('item-active');
// $(this).addClass('item-active');
// });
/* testimonial end --------------------*/
$(document).on('mouseover', '.hover-item', function () {
$(this).addClass('item-active');
$('.hover-item').removeClass('item-active');
$(this).addClass('item-active');
});
// Function to add animation classes
function animationProperties() {
$('[data-ani]').each(function () {
var animationName = $(this).data('ani');
$(this).addClass(animationName);
});
$('[data-ani-delay]').each(function () {
var delayTime = $(this).data('ani-delay');
$(this).css('animation-delay', delayTime);
});
}
animationProperties();
// Add click event handlers for external slider arrows based on data attributes
$('[data-slider-prev], [data-slider-next]').on('click', function () {
var sliderSelector = $(this).data('slider-prev') || $(this).data('slider-next');
var targetSlider = $(sliderSelector);
if (targetSlider.length) {
var swiper = targetSlider[0].swiper;
if (swiper) {
if ($(this).data('slider-prev')) {
swiper.slidePrev();
} else {
swiper.slideNext();
}
}
}
});
// var panoramaElement = document.querySelector('.panorama');
// pannellum.viewer(panoramaElement, {
// "type": "equirectangular",
// "panorama": "assets/img/hero/hero_10_1.jpg",
// "autoLoad": true
// });
/*-------------- 08. Slider Tab -------------*/
$.fn.activateSliderThumbs = function (options) {
var opt = $.extend({
sliderTab: false,
tabButton: ".tab-btn",
},
options
);
return this.each(function () {
var $container = $(this);
var $thumbs = $container.find(opt.tabButton);
var $line = $('').appendTo($container);
var sliderSelector = $container.data("slider-tab");
var $slider = $(sliderSelector);
var swiper = $slider[0].swiper;
$thumbs.on("click", function (e) {
e.preventDefault();
var clickedThumb = $(this);
clickedThumb.addClass("active").siblings().removeClass("active");
linePos(clickedThumb, $container);
clickedThumb.prevAll(opt.tabButton).addClass('list-active');
clickedThumb.nextAll(opt.tabButton).removeClass('list-active');
if (opt.sliderTab) {
var slideIndex = clickedThumb.index();
swiper.slideTo(slideIndex);
}
});
if (opt.sliderTab) {
swiper.on("slideChange", function () {
var activeIndex = swiper.realIndex;
var $activeThumb = $thumbs.eq(activeIndex);
$activeThumb.addClass("active").siblings().removeClass("active");
linePos($activeThumb, $container);
$activeThumb.prevAll(opt.tabButton).addClass('list-active');
$activeThumb.nextAll(opt.tabButton).removeClass('list-active');
});
var initialSlideIndex = swiper.activeIndex;
var $initialThumb = $thumbs.eq(initialSlideIndex);
$initialThumb.addClass("active").siblings().removeClass("active");
linePos($initialThumb, $container);
$initialThumb.prevAll(opt.tabButton).addClass('list-active');
$initialThumb.nextAll(opt.tabButton).removeClass('list-active');
}
function linePos($activeThumb) {
var thumbOffset = $activeThumb.position();
var marginTop = parseInt($activeThumb.css('margin-top')) || 0;
var marginLeft = parseInt($activeThumb.css('margin-left')) || 0;
$line.css("--height-set", $activeThumb.outerHeight() + "px");
$line.css("--width-set", $activeThumb.outerWidth() + "px");
$line.css("--pos-y", thumbOffset.top + marginTop + "px");
$line.css("--pos-x", thumbOffset.left + marginLeft + "px");
}
});
};
if ($(".product-thumb").length) {
$(".product-thumb").activateSliderThumbs({
sliderTab: true,
tabButton: ".tab-btn",
});
}
if ($(".team-thumb").length) {
$(".team-thumb").activateSliderThumbs({
sliderTab: true,
tabButton: ".tab-btn",
});
}
if ($(".testi-thumb").length) {
$(".testi-thumb").activateSliderThumbs({
sliderTab: true,
tabButton: ".tab-btn",
});
}
if ($(".testi-thumb2").length) {
$(".testi-thumb2").activateSliderThumbs({
sliderTab: true,
tabButton: ".tab-btn",
});
}
/*----------- 08. Ajax Contact Form ----------*/
var form = ".ajax-contact";
var invalidCls = "is-invalid";
var $email = '[name="email"]';
var $validation =
'[name="name"],[name="email"],[name="subject"],[name="number"],[name="message"]'; // Must be use (,) without any space
var formMessages = $(".form-messages");
function sendContact() {
var formData = $(form).serialize();
var valid;
valid = validateContact();
if (valid) {
jQuery
.ajax({
url: $(form).attr("action"),
data: formData,
type: "POST",
})
.done(function (response) {
// Make sure that the formMessages div has the 'success' class.
formMessages.removeClass("error");
formMessages.addClass("success");
// Set the message text.
formMessages.text(response);
// Clear the form.
$(
form +
' input:not([type="submit"]),' +
form +
" textarea"
).val("");
})
.fail(function (data) {
// Make sure that the formMessages div has the 'error' class.
formMessages.removeClass("success");
formMessages.addClass("error");
// Set the message text.
if (data.responseText !== "") {
formMessages.html(data.responseText);
} else {
formMessages.html(
"Oops! An error occured and your message could not be sent."
);
}
});
}
}
function validateContact() {
var valid = true;
var formInput;
function unvalid($validation) {
$validation = $validation.split(",");
for (var i = 0; i < $validation.length; i++) {
formInput = form + " " + $validation[i];
if (!$(formInput).val()) {
$(formInput).addClass(invalidCls);
valid = false;
} else {
$(formInput).removeClass(invalidCls);
valid = true;
}
}
}
unvalid($validation);
if (
!$($email).val() ||
!$($email)
.val()
.match(/^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/)
) {
$($email).addClass(invalidCls);
valid = false;
} else {
$($email).removeClass(invalidCls);
valid = true;
}
return valid;
}
$(form).on("submit", function (element) {
element.preventDefault();
sendContact();
});
/*---------- 09. Search Box Popup ----------*/
function popupSarchBox($searchBox, $searchOpen, $searchCls, $toggleCls) {
$($searchOpen).on("click", function (e) {
e.preventDefault();
$($searchBox).addClass($toggleCls);
});
$($searchBox).on("click", function (e) {
e.stopPropagation();
$($searchBox).removeClass($toggleCls);
});
$($searchBox)
.find("form")
.on("click", function (e) {
e.stopPropagation();
$($searchBox).addClass($toggleCls);
});
$($searchCls).on("click", function (e) {
e.preventDefault();
e.stopPropagation();
$($searchBox).removeClass($toggleCls);
});
}
popupSarchBox(".popup-search-box", ".searchBoxToggler", ".searchClose", "show");
/*---------- 10. Popup Sidemenu ----------*/
function popupSideMenu($sideMenu, $sideMunuOpen, $sideMenuCls, $toggleCls) {
// Sidebar Popup
$($sideMunuOpen).on('click', function (e) {
e.preventDefault();
$($sideMenu).addClass($toggleCls);
});
$($sideMenu).on('click', function (e) {
e.stopPropagation();
$($sideMenu).removeClass($toggleCls)
});
var sideMenuChild = $sideMenu + ' > div';
$(sideMenuChild).on('click', function (e) {
e.stopPropagation();
$($sideMenu).addClass($toggleCls)
});
$($sideMenuCls).on('click', function (e) {
e.preventDefault();
e.stopPropagation();
$($sideMenu).removeClass($toggleCls);
});
};
popupSideMenu('.sidemenu-wrapper', '.sideMenuToggler', '.sideMenuCls', 'show');
/*---------- 10. Popup Sidemenu ----------*/
function popupSideMenu($sideMenu2, $sideMunuOpen2, $sideMenuCls2, $toggleCls2) {
// Sidebar Popup
$($sideMunuOpen2).on('click', function (e) {
e.preventDefault();
$($sideMenu2).addClass($toggleCls2);
});
$($sideMenu2).on('click', function (e) {
e.stopPropagation();
$($sideMenu2).removeClass($toggleCls2)
});
var sideMenuChild = $sideMenu2 + ' > div';
$(sideMenuChild).on('click', function (e) {
e.stopPropagation();
$($sideMenu2).addClass($toggleCls2)
});
$($sideMenuCls2).on('click', function (e) {
e.preventDefault();
e.stopPropagation();
$($sideMenu2).removeClass($toggleCls2);
});
};
popupSideMenu('.shopping-cart', '.sideMenuToggler2', '.sideMenuCls', 'show');
/*----------- 11. Magnific Popup ----------*/
/* magnificPopup img view */
$(".popup-image").magnificPopup({
type: "image",
mainClass: 'mfp-zoom-in',
removalDelay: 260,
gallery: {
enabled: true,
},
});
/* magnificPopup video view */
$(".popup-video").magnificPopup({
type: "iframe",
});
/* magnificPopup video view */
$(".popup-content").magnificPopup({
type: "inline",
midClick: true,
});
//Image Reveal Animation
if ($('.th-anim').length) {
gsap.registerPlugin(ScrollTrigger);
let revealContainers = document.querySelectorAll(".th-anim");
revealContainers.forEach((container) => {
let image = container.querySelector("img");
let tl = gsap.timeline({
scrollTrigger: {
trigger: container,
toggleActions: "play none none none"
}
});
tl.set(container, {
autoAlpha: 1
});
tl.from(container, 1.5, {
xPercent: -100,
ease: Power2.out
});
tl.from(image, 1.5, {
xPercent: 100,
scale: 1.3,
delay: -1.5,
ease: Power2.out
});
});
}
/* cursor area start*/
if ($('.cursor').length) {
const cursor = document.querySelector(".cursor");
const follower = document.querySelector(".cursor-follower");
const gsapCursor = document.querySelectorAll(".gsap-cursor");
let posX = 0,
posY = 0,
mouseX = 0,
mouseY = 0;
TweenMax.to({}, 0.02, {
repeat: -1,
onRepeat: function () {
posX += (mouseX - posX) / 9;
posY += (mouseY - posY) / 9;
TweenMax.set(follower, {
css: {
left: posX - 20,
top: posY - 20
}
});
TweenMax.set(cursor, {
css: {
left: mouseX,
top: mouseY
}
});
}
});
document.addEventListener("mousemove", (e) => {
mouseX = e.pageX;
mouseY = e.pageY;
});
gsapCursor.forEach((el) => {
el.addEventListener("mouseenter", () => {
cursor.classList.add("active");
follower.classList.add("active");
});
el.addEventListener("mouseleave", () => {
cursor.classList.remove("active");
follower.classList.remove("active");
});
});
$(".slider-drag-wrap").hover(function () {
$('.cursor').addClass('active');
}, function () {
$('.cursor').removeClass('active');
});
$(".slider-drag-wrap a").hover(function () {
$('.cursor').removeClass('active');
}, function () {
$('.cursor').addClass('active');
});
}
/* cursor area end */
/*---------- 12. Section Position ----------*/
// Interger Converter
function convertInteger(str) {
return parseInt(str, 10);
}
$.fn.sectionPosition = function (mainAttr, posAttr) {
$(this).each(function () {
var section = $(this);
function setPosition() {
var sectionHeight = Math.floor(section.height() / 2), // Main Height of section
posData = section.attr(mainAttr), // where to position
posFor = section.attr(posAttr), // On Which section is for positioning
topMark = "top-half", // Pos top
bottomMark = "bottom-half", // Pos Bottom
parentPT = convertInteger($(posFor).css("padding-top")), // Default Padding of parent
parentPB = convertInteger($(posFor).css("padding-bottom")); // Default Padding of parent
if (posData === topMark) {
$(posFor).css(
"padding-bottom",
parentPB + sectionHeight + "px"
);
section.css("margin-top", "-" + sectionHeight + "px");
} else if (posData === bottomMark) {
$(posFor).css(
"padding-top",
parentPT + sectionHeight + "px"
);
section.css("margin-bottom", "-" + sectionHeight + "px");
}
}
setPosition(); // Set Padding On Load
});
};
var postionHandler = "[data-sec-pos]";
if ($(postionHandler).length) {
$(postionHandler).imagesLoaded(function () {
$(postionHandler).sectionPosition("data-sec-pos", "data-pos-for");
});
}
/*---------- 22. Circle Progress ----------*/
function animateElements() {
$('.feature-circle .progressbar').each(function () {
var pathColor = $(this).attr('data-path-color');
var elementPos = $(this).offset().top;
var topOfWindow = $(window).scrollTop();
var percent = $(this).find('.circle').attr('data-percent');
var percentage = parseInt(percent, 10) / parseInt(100, 10);
var animate = $(this).data('animate');
if (elementPos < topOfWindow + $(window).height() - 30 && !animate) {
$(this).data('animate', true);
$(this).find('.circle').circleProgress({
startAngle: -Math.PI / 2,
value: percent / 100,
size: 100,
thickness: 8,
emptyFill: "#E4E4E4",
lineCap: 'round',
fill: {
color: pathColor,
}
}).on('circle-animation-progress', function (event, progress, stepValue) {
$(this).find('.circle-num').text((stepValue * 100).toFixed(0) + "%");
}).stop();
}
});
$('.skill-circle .progressbar').each(function () {
var elementPos = $(this).offset().top;
var topOfWindow = $(window).scrollTop();
var percent = $(this).find('.circle').attr('data-percent');
var percentage = parseInt(percent, 10) / parseInt(100, 10);
var animate = $(this).data('animate');
if (elementPos < topOfWindow + $(window).height() - 30 && !animate) {
$(this).data('animate', true);
$(this).find('.circle').circleProgress({
startAngle: -Math.PI / 2,
value: percent / 100,
size: 100,
thickness: 8,
emptyFill: "#E0E0E0",
lineCap: 'round',
fill: {
gradient: ["#F11F22", "#F2891D"]
}
}).on('circle-animation-progress', function (event, progress, stepValue) {
$(this).find('.circle-num').text((stepValue * 100).toFixed(0) + "%");
}).stop();
}
});
}
// Show animated elements
animateElements();
$(window).scroll(animateElements);
/*----------- 15. Filter ----------*/
$(".filter-active").imagesLoaded(function () {
var $filter = ".filter-active",
$filterItem = ".filter-item",
$filterMenu = ".filter-menu-active";
if ($($filter).length > 0) {
var $grid = $($filter).isotope({
itemSelector: $filterItem,
filter: "*",
masonry: {
// use outer width of grid-sizer for columnWidth
columnWidth: 1,
},
});
// filter items on button click
$($filterMenu).on("click", "button", function () {
var filterValue = $(this).attr("data-filter");
$grid.isotope({
filter: filterValue,
});
});
// Menu Active Class
$($filterMenu).on("click", "button", function (event) {
event.preventDefault();
$(this).addClass("active");
$(this).siblings(".active").removeClass("active");
});
}
});
$(".masonary-active").imagesLoaded(function () {
var $filter = ".masonary-active",
$filterItem = ".filter-item";
if ($($filter).length > 0) {
$($filter).isotope({
itemSelector: $filterItem,
filter: "*",
masonry: {
// use outer width of grid-sizer for columnWidth
columnWidth: 1,
},
});
}
});
$(".masonary-active, .woocommerce-Reviews .comment-list").imagesLoaded(function () {
var $filter = ".masonary-active, .woocommerce-Reviews .comment-list",
$filterItem = ".filter-item, .woocommerce-Reviews .comment-list li";
if ($($filter).length > 0) {
$($filter).isotope({
itemSelector: $filterItem,
filter: "*",
masonry: {
// use outer width of grid-sizer for columnWidth
columnWidth: 1,
},
});
}
$('[data-bs-toggle="tab"]').on('shown.bs.tab', function (e) {
$($filter).isotope({
filter: "*",
});
});
});
/*----------- 14. Counter Up ----------*/
$(".counter-number").counterUp({
delay: 10,
time: 1000,
});
/*----------- 15. Shape Mockup ----------*/
$.fn.shapeMockup = function () {
var $shape = $(this);
$shape.each(function () {
var $currentShape = $(this),
shapeTop = $currentShape.data("top"),
shapeRight = $currentShape.data("right"),
shapeBottom = $currentShape.data("bottom"),
shapeLeft = $currentShape.data("left");
$currentShape
.css({
top: shapeTop,
right: shapeRight,
bottom: shapeBottom,
left: shapeLeft,
})
.removeAttr("data-top")
.removeAttr("data-right")
.removeAttr("data-bottom")
.removeAttr("data-left")
.parent()
.addClass("shape-mockup-wrap");
});
};
if ($(".shape-mockup")) {
$(".shape-mockup").shapeMockup();
}
/*----------- 16. Progress Bar Animation ----------*/
$('.progress-bar').waypoint(function () {
$('.progress-bar').css({
animation: "animate-positive 1.8s",
opacity: "1"
});
}, {
offset: '75%'
});
/*----------- 17. Countdown ----------*/
$.fn.countdown = function () {
$(this).each(function () {
var $counter = $(this),
countDownDate = new Date($counter.data("offer-date")).getTime(), // Set the date we're counting down toz
exprireCls = "expired";
// Finding Function
function s$(element) {
return $counter.find(element);
}
// Update the count down every 1 second
var counter = setInterval(function () {
// Get today's date and time
var now = new Date().getTime();
// Find the distance between now and the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor(
(distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)
);
var minutes = Math.floor(
(distance % (1000 * 60 * 60)) / (1000 * 60)
);
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// Check If value is lower than ten, so add zero before number
days < 10 ? (days = "0" + days) : null;
hours < 10 ? (hours = "0" + hours) : null;
minutes < 10 ? (minutes = "0" + minutes) : null;
seconds < 10 ? (seconds = "0" + seconds) : null;
// If the count down is over, write some text
if (distance < 0) {
clearInterval(counter);
$counter.addClass(exprireCls);
$counter.find(".message").css("display", "block");
} else {
// Output the result in elements
s$(".day").html(days);
s$(".hour").html(hours);
s$(".minute").html(minutes);
s$(".seconds").html(seconds);
}
}, 1000);
});
};
if ($(".counter-list").length) {
$(".counter-list").countdown();
}
/* ==================================================
# Load More
===============================================*/
$(function () {
$(".faq-area").slice(0, 4).show();
$("#loadMore").on("click", function (e) {
e.preventDefault();
$(".loadcontent:hidden").slice(0, 3).slideDown();
if ($(".loadcontent:hidden").length == 0) {
$("#loadMore").text("No Content").addClass("noContent");
}
});
})
/*----------- 21. Price Slider ----------*/
$(".price_slider").slider({
range: true,
min: 0,
max: 100,
values: [0, 30],
slide: function (event, ui) {
$(".from").text("$" + ui.values[0]);
$(".to").text("$" + ui.values[1]);
}
});
$(".from").text("$" + $(".price_slider").slider("values", 0));
$(".to").text("$" + $(".price_slider").slider("values", 1));
/*---------- 18. Image to SVG Code ----------*/
const cache = {};
$.fn.inlineSvg = function fnInlineSvg() {
this.each(imgToSvg);
return this;
};
function imgToSvg() {
const $img = $(this);
const src = $img.attr("src");
// fill cache by src with promise
if (!cache[src]) {
const d = $.Deferred();
$.get(src, (data) => {
d.resolve($(data).find("svg"));
});
cache[src] = d.promise();
}
// replace img with svg when cached promise resolves
cache[src].then((svg) => {
const $svg = $(svg).clone();
if ($img.attr("id")) $svg.attr("id", $img.attr("id"));
if ($img.attr("class")) $svg.attr("class", $img.attr("class"));
if ($img.attr("style")) $svg.attr("style", $img.attr("style"));
if ($img.attr("width")) {
$svg.attr("width", $img.attr("width"));
if (!$img.attr("height")) $svg.removeAttr("height");
}
if ($img.attr("height")) {
$svg.attr("height", $img.attr("height"));
if (!$img.attr("width")) $svg.removeAttr("width");
}
$svg.insertAfter($img);
$img.trigger("svgInlined", $svg[0]);
$img.remove();
});
}
$(".svg-img").inlineSvg();
//Image Reveal Animation
if ($('.th-anim').length) {
gsap.registerPlugin(ScrollTrigger);
let revealContainers = document.querySelectorAll(".th-anim");
revealContainers.forEach((container) => {
let image = container.querySelector("img");
let tl = gsap.timeline({
scrollTrigger: {
trigger: container,
toggleActions: "play none none none"
}
});
tl.set(container, {
autoAlpha: 1
});
tl.from(container, 1.5, {
xPercent: -100,
ease: Power2.out
});
tl.from(image, 1.5, {
xPercent: 100,
scale: 1.3,
delay: -1.5,
ease: Power2.out
});
});
}
/*----------- 00. Woocommerce Toggle ----------*/
// Ship To Different Address
$("#ship-to-different-address-checkbox").on("change", function () {
if ($(this).is(":checked")) {
$("#ship-to-different-address")
.next(".shipping_address")
.slideDown();
} else {
$("#ship-to-different-address").next(".shipping_address").slideUp();
}
});
// Login Toggle
$(".woocommerce-form-login-toggle a").on("click", function (e) {
e.preventDefault();
$(".woocommerce-form-login").slideToggle();
});
// Coupon Toggle
$(".woocommerce-form-coupon-toggle a").on("click", function (e) {
e.preventDefault();
$(".woocommerce-form-coupon").slideToggle();
});
// Woocommerce Shipping Method
$(".shipping-calculator-button").on("click", function (e) {
e.preventDefault();
$(this).next(".shipping-calculator-form").slideToggle();
});
// Woocommerce Payment Toggle
$('.wc_payment_methods input[type="radio"]:checked')
.siblings(".payment_box")
.show();
$('.wc_payment_methods input[type="radio"]').each(function () {
$(this).on("change", function () {
$(".payment_box").slideUp();
$(this).siblings(".payment_box").slideDown();
});
});
// Woocommerce Rating Toggle
$(".rating-select .stars a").each(function () {
$(this).on("click", function (e) {
e.preventDefault();
$(this).siblings().removeClass("active");
$(this).parent().parent().addClass("selected");
$(this).addClass("active");
});
});
// Quantity Plus Minus ---------------------------
$(".quantity-plus").each(function () {
$(this).on("click", function (e) {
e.preventDefault();
var $qty = $(this).siblings(".qty-input");
var currentVal = parseInt($qty.val(), 10);
if (!isNaN(currentVal)) {
$qty.val(currentVal + 1);
}
});
});
$(".quantity-minus").each(function () {
$(this).on("click", function (e) {
e.preventDefault();
var $qty = $(this).siblings(".qty-input");
var currentVal = parseInt($qty.val(), 10);
if (!isNaN(currentVal) && currentVal > 1) {
$qty.val(currentVal - 1);
}
});
});
// /*----------- 00.Color Scheme ----------*/
$('.color-switch-btns button').each(function () {
// Get color for button
const button = $(this);
const color = button.data('color');
button.css('--theme-color', color);
// Change theme color on click
button.on('click', function () {
const clickedColor = $(this).data('color');
$(':root').css('--theme-color', clickedColor);
});
});
$(document).on('click', '.switchIcon', function () {
$('.color-scheme-wrap').toggleClass('active');
});
// /*----------- 00. Right Click Disable ----------*/
// window.addEventListener('contextmenu', function (e) {
// // do something here...
// e.preventDefault();
// }, false);
// /*----------- 00. Inspect Element Disable ----------*/
// document.onkeydown = function (e) {
// if (event.keyCode == 123) {
// return false;
// }
// if (e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)) {
// return false;
// }
// if (e.ctrlKey && e.shiftKey && e.keyCode == 'C'.charCodeAt(0)) {
// return false;
// }
// if (e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)) {
// return false;
// }
// if (e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)) {
// return false;
// }
// }
})(jQuery);