window.initMetatron = function () { (function ($) { "use strict"; var windowOn = $(window); /*====================================== Preloader activation ========================================*/ if ($('#preloader').length > 0) { $('#preloader').delay(500).fadeOut(500); } /*====================================== button hover ========================================*/ $('.btn-hover').off('mouseenter mouseout').on('mouseenter', function (e) { var parentOffset = $(this).offset(), relX = e.pageX - parentOffset.left, relY = e.pageY - parentOffset.top; $(this).find('span').css({ top: 0, left: 0 }) $(this).find('span').css({ top: relY, left: relX }) }).on('mouseout', function (e) { var parentOffset = $(this).offset(), relX = e.pageX - parentOffset.left, relY = e.pageY - parentOffset.top; $(this).find('span').css({ top: 0, left: 0 }) $(this).find('span').css({ top: relY, left: relX }) }); /*====================================== Mobile Menu Js ========================================*/ $('#mobile-menu').meanmenu({ meanMenuContainer: '.mobile-menu', meanScreenWidth: "991", meanExpand: [''], }); $("#mobile-menu-2").meanmenu({ meanMenuContainer: ".mobile-menu-2", meanScreenWidth: "4000", meanExpand: [''], }); /*====================================== Sidebar Toggle ========================================*/ $(".offcanvas__close,.offcanvas__overlay").off("click").on("click", function () { $(".offcanvas__info").removeClass("info-open"); $(".offcanvas__overlay").removeClass("overlay-open"); }); $(".sidebar__toggle").off("click").on("click", function () { $(".offcanvas__info").addClass("info-open"); $(".offcanvas__overlay").addClass("overlay-open"); }); /*====================================== Body overlay Js ========================================*/ $(".body-overlay").off("click").on("click", function () { $(".offcanvas__area").removeClass("offcanvas-opened"); $(".df-search-area").removeClass("opened");; $(".body-overlay").removeClass("opened"); }); /*====================================== Search Header Js ========================================*/ $(".search-toggle-open").off("click").on("click", function () { $(".df-search-area").addClass("opened"); $(".body-overlay").addClass("opened"); }); $(".tp-search-close-btn").off("click").on("click", function () { $(".df-search-area").removeClass("opened"); $(".body-overlay").removeClass("opened"); }); /*====================================== Sticky Header Js ========================================*/ $(window).off("scroll.sticky").on("scroll.sticky", function () { if ($(this).scrollTop() > 250) { $("#header-sticky").addClass("sticky"); } else { $("#header-sticky").removeClass("sticky"); } }); /*====================================== Data Css js ========================================*/ $("[data-background").each(function () { $(this).css("background-image", "url( " + $(this).attr("data-background") + " )"); }); $("[data-width]").each(function () { $(this).css("width", $(this).attr("data-width")); }); $("[data-bg-color]").each(function () { $(this).css("background-color", $(this).attr("data-bg-color")); }); /*====================================== Cart Quantity Js ========================================*/ $(".cart-minus").off("click").click(function () { var $input = $(this).parent().find("input"); var count = parseInt($input.val()) - 1; count = count < 1 ? 1 : count; $input.val(count); $input.change(); return false; }); $(".cart-plus").off("click").click(function () { var $input = $(this).parent().find("input"); $input.val(parseInt($input.val()) + 1); $input.change(); return false; }); /*====================================== MagnificPopup image view ========================================*/ $('.popup-image').magnificPopup({ type: 'image', gallery: { enabled: true } }); if ($(".post-filter").length) { var postFilterList = $(".post-filter li"); // for first init $(".filter-layout").isotope({ filter: ".filter-item", animationOptions: { duration: 500, easing: "linear", queue: false } }); // on click filter links postFilterList.off("click").on("click", function () { var Self = $(this); var selector = Self.attr("data-filter"); postFilterList.removeClass("active"); Self.addClass("active"); $(".filter-layout").isotope({ filter: selector, animationOptions: { duration: 500, easing: "linear", queue: false } }); return false; }); } /*====================================== MagnificPopup video view ========================================*/ $(".popup-video").magnificPopup({ type: "iframe", }); /*====================================== Counter Js (Robust Re-triggering) ========================================*/ const initCounters = () => { const counterElements = document.querySelectorAll('.counter'); const animateCounter = (el) => { const target = parseFloat(el.dataset.target.replace(/,/g, '')); if (isNaN(target)) return; const duration = 2000; const stepTime = 20; const steps = duration / stepTime; const increment = target / steps; let current = 0; const timer = setInterval(() => { current += increment; if (current >= target) { el.innerText = target.toLocaleString() + (el.dataset.suffix || ''); clearInterval(timer); } else { el.innerText = Math.floor(current).toLocaleString() + (el.dataset.suffix || ''); } }, stepTime); el.dataset.counterTimer = timer; }; const observer = new IntersectionObserver((entries) => { entries.forEach(entry => { const el = entry.target; if (entry.isIntersecting) { if (el.dataset.counterTimer) clearInterval(el.dataset.counterTimer); animateCounter(el); } else { if (el.dataset.counterTimer) clearInterval(el.dataset.counterTimer); el.innerText = '0' + (el.dataset.suffix || ''); } }); }, { threshold: 0.1 }); counterElements.forEach(el => { const text = el.innerText; const match = text.match(/([\d,.]+)(\+?)/); if (match) { el.dataset.target = match[1]; el.dataset.suffix = match[2] || ''; } else { el.dataset.target = text; } observer.observe(el); }); }; initCounters(); /*====================================== Wow Js ========================================*/ if (typeof WOW !== 'undefined') { new WOW().init(); } /*====================================== Back To Top Js ========================================*/ var progressPath = document.querySelector('.backtotop-wrap path'); if (progressPath) { 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).off("scroll.backtotop").on('scroll.backtotop', updateProgress); var offset = 150; var duration = 550; $(window).off("scroll.backtotop_active").on('scroll.backtotop_active', function () { if ($(this).scrollTop() > offset) { $('.backtotop-wrap').addClass('active-progress'); } else { $('.backtotop-wrap').removeClass('active-progress'); } }); $('.backtotop-wrap').off('click').on('click', function (event) { event.preventDefault(); $('html, body').animate({ scrollTop: 0 }, duration); return false; }) } /*====================================== For language Js ========================================*/ if ($("#header-lang-toggle").length > 0) { window.addEventListener('click', function (e) { if (document.getElementById('header-lang-toggle').contains(e.target)) { $(".header-lang ul").toggleClass("lang-list-open"); } else { $(".header-lang ul").removeClass("lang-list-open"); } }); } /*====================================== For header header Js ========================================*/ if ($("#header-currency-toggle").length > 0) { window.addEventListener('click', function (e) { if (document.getElementById('header-currency-toggle').contains(e.target)) { $(".tp-header-currency ul").toggleClass("tp-currency-list-open"); } else { $(".tp-header-currency ul").removeClass("tp-currency-list-open"); } }); } /*====================================== For header setting Js ========================================*/ if ($("#header-setting-toggle").length > 0) { window.addEventListener('click', function (e) { if (document.getElementById('header-setting-toggle').contains(e.target)) { $(".tp-header-setting ul").toggleClass("tp-setting-list-open"); } else { $(".tp-header-setting ul").removeClass("tp-setting-list-open"); } }); } /*====================================== For before-after Js ========================================*/ if ($(".beforeAfter").length > 0) { $('.beforeAfter').beforeAfter({ movable: true, clickMove: true, position: 50, separatorColor: '#fafafa', bulletColor: '#fafafa', onMoveStart: function (e) { console.log(event.target); }, onMoving: function () { console.log(event.target); }, onMoveEnd: function () { console.log(event.target); }, }); } /*====================================== Testimonial slider Js Metatron Home One ========================================*/ if ($('.testimonial-active-1').length > 0 && $('.testimonial-active-1 .swiper-slide').length > 0) { new Swiper('.testimonial-active-1', { slidesPerView: 1, spaceBetween: 30, loop: $('.testimonial-active-1 .swiper-slide').length >= 1, roundLengths: true, autoplay: { delay: 3000, }, navigation: { nextEl: ".testimonial-1-button-next", prevEl: ".testimonial-1-button-prev", }, breakpoints: { '1400': { slidesPerView: 1 }, '1200': { slidesPerView: 1 }, '992': { slidesPerView: 1 }, '768': { slidesPerView: 1 }, '576': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, }); } if ($('.testimonial-active-2').length > 0 && $('.testimonial-active-2 .swiper-slide').length > 0) { new Swiper('.testimonial-active-2', { slidesPerView: 2, spaceBetween: 20, loop: $('.testimonial-active-2 .swiper-slide').length >= 2, roundLengths: true, autoplay: { delay: 3000, }, pagination: { el: ".testimonial-swiper-dot", clickable: true, }, navigation: { nextEl: ".testimonial-button-next", prevEl: ".testimonial-button-prev", }, breakpoints: { '1400': { slidesPerView: 2 }, '1200': { slidesPerView: 2 }, '992': { slidesPerView: 2 }, '768': { slidesPerView: 1 }, '500': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, }); } if ($('.testimonial-active-3').length > 0 && $('.testimonial-active-3 .swiper-slide').length > 0) { new Swiper('.testimonial-active-3', { slidesPerView: 4, spaceBetween: 24, loop: $('.testimonial-active-3 .swiper-slide').length >= 4, roundLengths: true, autoplay: { delay: 3000, }, pagination: { el: ".bd-swiper-dot", clickable: true, }, navigation: { nextEl: ".testimonial-button-next", prevEl: ".testimonial-button-prev", }, breakpoints: { '1400': { slidesPerView: 4 }, '1200': { slidesPerView: 3 }, '992': { slidesPerView: 2 }, '768': { slidesPerView: 2 }, '500': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, }); } if ($('.team-active-3').length > 0 && $('.team-active-3 .swiper-slide').length > 0) { new Swiper('.team-active-3', { slidesPerView: 3, spaceBetween: 24, loop: $('.team-active-3 .swiper-slide').length >= 3, roundLengths: true, autoplay: { delay: 3000, }, pagination: { el: ".bd-swiper-dot", clickable: true, }, navigation: { nextEl: ".team-3-button-next", prevEl: ".team-3-button-prev", }, breakpoints: { '1400': { slidesPerView: 3 }, '1200': { slidesPerView: 3 }, '992': { slidesPerView: 2 }, '768': { slidesPerView: 2 }, '500': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, }); } /*====================================== Review slider Js ========================================*/ if ($('.review-active').length > 0 && $('.review-active .swiper-slide').length > 0) { new Swiper('.review-active', { slidesPerView: 1, spaceBetween: 30, loop: $('.review-active .swiper-slide').length >= 1, roundLengths: true, observer: true, observeParents: true, autoplay: { delay: 3000, }, navigation: { nextEl: ".review-button-prev", prevEl: ".review-button-next", }, }); } if ($(".review-active-two").length > 0) { $(".review-active-two").slick({ infinite: true, vertical: true, speed: 1000, autoplaySpeed: 2000, slidesToShow: 1, autoplay: true, arrows: true, prevArrow: '', nextArrow: '', appendArrows: $(".review-slider-navigation"), slidesToScroll: 1, responsive: [ { breakpoint: 1400, settings: { slidesToShow: 1 } }, { breakpoint: 1200, settings: { slidesToShow: 1 } }, { breakpoint: 992, settings: { slidesToShow: 1 } }, { breakpoint: 768, settings: { slidesToShow: 1 } }, { breakpoint: 480, settings: { slidesToShow: 1 } }, ], }); } /*====================================== product slider Js ========================================*/ if ($('.product-active').length > 0 && $('.product-active .swiper-slide').length > 0) { new Swiper('.product-active', { slidesPerView: 4, spaceBetween: 15, loop: $('.product-active .swiper-slide').length >= 4, roundLengths: true, autoplay: { delay: 3000, }, pagination: { el: ".bd-swiper-dot", clickable: true, }, breakpoints: { '1200': { slidesPerView: 4 }, '992': { slidesPerView: 3 }, '768': { slidesPerView: 3 }, '576': { slidesPerView: 2 }, '0': { slidesPerView: 1 }, }, }); } if ($('.discount-active').length > 0 && $('.discount-active .swiper-slide').length > 0) { new Swiper('.discount-active', { slidesPerView: 5, spaceBetween: 15, loop: $('.discount-active .swiper-slide').length >= 5, roundLengths: true, observer: true, observeParents: true, autoplay: { delay: 3000, }, pagination: { el: ".bd-swiper-dot", clickable: true, }, navigation: { nextEl: ".discount-slider-button-prev", prevEl: ".discount-slider-button-next", }, breakpoints: { '1400': { slidesPerView: 5 }, '1200': { slidesPerView: 4 }, '992': { slidesPerView: 4 }, '768': { slidesPerView: 3 }, '576': { slidesPerView: 2 }, '0': { slidesPerView: 1 }, }, }); } /*====================================== brand slider Js Metatron Home One ========================================*/ if ($('.brand-active').length > 0 && $('.brand-active .swiper-slide').length > 0) { new Swiper('.brand-active', { slidesPerView: 5, spaceBetween: 99, loop: $('.brand-active .swiper-slide').length >= 5, roundLengths: true, autoplay: { delay: 3000, }, breakpoints: { '1400': { slidesPerView: 5 }, '1200': { slidesPerView: 4 }, '992': { slidesPerView: 4 }, '768': { slidesPerView: 4 }, '576': { slidesPerView: 3 }, '500': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, speed: 1000, }); } /*====================================== service slider Js Metatron Home One ========================================*/ if ($('.service-active-2').length > 0 && $('.service-active-2 .swiper-slide').length > 0) { new Swiper('.service-active-2', { slidesPerView: 4, spaceBetween: 30, loop: $('.service-active-2 .swiper-slide').length >= 4, autoplay: { delay: 3000, }, pagination: { el: ".bd-swiper-dot", clickable: true, }, navigation: { nextEl: ".service-active-2-button-next", prevEl: ".service-active-2-button-prev", }, breakpoints: { '1200': { slidesPerView: 4 }, '992': { slidesPerView: 3 }, '768': { slidesPerView: 2 }, '576': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, }); } /*====================================== Project slider Js Metatron Home One ========================================*/ if ($('.project-active-1').length > 0) { new Swiper('.project-active-1', { slidesPerView: 4, spaceBetween: 30, loop: $('.project-active-1 .swiper-slide').length >= 4, autoplay: { delay: 3000, }, navigation: { nextEl: ".project-1-button-next", prevEl: ".project-1-button-prev", }, breakpoints: { '1400': { slidesPerView: 4 }, '1200': { slidesPerView: 3 }, '992': { slidesPerView: 2 }, '768': { slidesPerView: 2 }, '576': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, speed: 1000, }); } if ($('.service-active-1').length > 0 && $('.service-active-1 .swiper-slide').length > 0) { new Swiper('.service-active-1', { slidesPerView: 3, spaceBetween: 30, loop: $('.service-active-1 .swiper-slide').length >= 3, roundLengths: true, autoplay: { delay: 3000, }, navigation: { nextEl: ".service-1-button-next", prevEl: ".service-1-button-prev", }, breakpoints: { '1400': { slidesPerView: 3 }, '1200': { slidesPerView: 3 }, '992': { slidesPerView: 2 }, '768': { slidesPerView: 1 }, '576': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, speed: 1500, }); } if ($('.service-one-home__carousel').length > 0 && $('.service-one-home__carousel .swiper-slide').length > 0) { new Swiper('.service-one-home__carousel', { slidesPerView: 3, spaceBetween: 30, loop: $('.service-one-home__carousel .swiper-slide').length >= 3, roundLengths: true, autoplay: { delay: 3000, }, pagination: { el: ".bd-swiper-dot", clickable: true, }, breakpoints: { '1400': { slidesPerView: 3 }, '1200': { slidesPerView: 3 }, '992': { slidesPerView: 2 }, '768': { slidesPerView: 2 }, '500': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, speed: 1500, }); } /*====================================== slider Js ========================================*/ if (jQuery(".slider-active").length > 0 && jQuery(".slider-active .swiper-slide").length > 0) { let sliderActive1 = ".slider-active"; let sliderInit1 = new Swiper(sliderActive1, { slidesPerView: 1, slidesPerColumn: 1, paginationClickable: true, fadeEffect: { crossFade: true }, loop: jQuery(".slider-active .swiper-slide").length >= 1, effect: 'fade', autoplay: { delay: 5000 }, navigation: { nextEl: ".slider-button-prev", prevEl: ".slider-button-next", }, pagination: { el: ".banner-dot-2", clickable: true, }, a11y: false, }); function animated_swiper(selector, init) { let animated = function animated() { $(selector + " [data-animation]").each(function () { let anim = $(this).data("animation"); let delay = $(this).data("delay"); let duration = $(this).data("duration"); $(this) .removeClass("anim" + anim) .addClass(anim + " animated") .css({ webkitAnimationDelay: delay, animationDelay: delay, webkitAnimationDuration: duration, animationDuration: duration, }) .one( "webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend", function () { $(this).removeClass(anim + " animated"); } ); }); }; animated(); init.on("slideChange", function () { $(sliderActive1 + " [data-animation]").removeClass("animated"); }); init.on("slideChange", animated); } animated_swiper(sliderActive1, sliderInit1); } if (jQuery(".banner-active").length > 0 && jQuery(".banner-active .swiper-slide").length > 0) { let sliderActive1 = ".banner-active"; let sliderInit1 = new Swiper(sliderActive1, { slidesPerView: 1, slidesPerColumn: 1, paginationClickable: true, fadeEffect: { crossFade: true }, loop: jQuery(".banner-active .swiper-slide").length >= 1, effect: "fade", autoplay: { delay: 5000 }, navigation: { nextEl: ".slider__button-prev", prevEl: ".slider__button-next", }, pagination: { el: ".banner-dot", clickable: true, }, a11y: false, }); function animated_swiper_banner(selector, init) { let animated = function animated() { $(selector + " [data-animation]").each(function () { let anim = $(this).data("animation"); let delay = $(this).data("delay"); let duration = $(this).data("duration"); $(this) .removeClass("anim" + anim) .addClass(anim + " animated") .css({ webkitAnimationDelay: delay, animationDelay: delay, webkitAnimationDuration: duration, animationDuration: duration, }) .one( "webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend", function () { $(this).removeClass(anim + " animated"); } ); }); }; animated(); init.on("slideChange", function () { $(sliderActive1 + " [data-animation]").removeClass("animated"); }); init.on("slideChange", animated); } animated_swiper_banner(sliderActive1, sliderInit1); } /*====================================== Postbox slider Js ========================================*/ if ($('.postbox__slider').length > 0 && $('.postbox__slider .swiper-slide').length > 0) { new Swiper('.postbox__slider', { slidesPerView: 1, spaceBetween: 0, loop: $('.postbox__slider .swiper-slide').length >= 1, autoplay: { delay: 3000 }, navigation: { nextEl: ".postbox-slider-button-next", prevEl: ".postbox-slider-button-prev", }, breakpoints: { '1200': { slidesPerView: 1 }, '992': { slidesPerView: 1 }, '768': { slidesPerView: 1 }, '576': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, }); } /*====================================== whyChoose slider Js ========================================*/ if ($('.why-choose-active').length > 0 && $('.why-choose-active .swiper-slide').length > 0) { new Swiper('.why-choose-active', { slidesPerView: 1, spaceBetween: 0, loop: $('.why-choose-active .swiper-slide').length >= 1, autoplay: { delay: 3000 }, pagination: { el: ".bd-swiper-dot", clickable: true, }, breakpoints: { '1200': { slidesPerView: 3 }, '992': { slidesPerView: 3 }, '768': { slidesPerView: 1 }, '576': { slidesPerView: 1 }, '0': { slidesPerView: 1 }, }, }); } /*====================================== SECTION ACTIVE ========================================*/ $(document).off('mouseover', '.icon-box-area').on('mouseover', '.icon-box-area', function () { $('.icon-box-area').removeClass('active'); $(this).addClass('active'); }); /*====================================== Countdown slider Js ========================================*/ if ($(".countdown-wrapper").length > 0) { function updateCountdown() { const second = 1000, minute = second * 60, hour = minute * 60, day = hour * 24; let today = new Date(); let dd = String(today.getDate()).padStart(2, "0"); let mm = String(today.getMonth() + 1).padStart(2, "0"); let yyyy = today.getFullYear(); let nextYear = yyyy + 1; let dayMonth = "12/30/"; let birthday = dayMonth + yyyy; today = mm + "/" + dd + "/" + yyyy; if (today > birthday) { birthday = dayMonth + nextYear; } const countDownDate = new Date(birthday).getTime(); const x = setInterval(function () { const now = new Date().getTime(); const distance = countDownDate - now; const days = Math.floor(distance / day); const hours = Math.floor((distance % day) / hour); const minutes = Math.floor((distance % hour) / minute); const seconds = Math.floor((distance % minute) / second); if (document.getElementById("days")) document.getElementById("days").innerText = days; if (document.getElementById("hours")) document.getElementById("hours").innerText = hours; if (document.getElementById("minutes")) document.getElementById("minutes").innerText = minutes; if (document.getElementById("seconds")) document.getElementById("seconds").innerText = seconds; if (distance < 0) { clearInterval(x); if (document.getElementById("headline")) document.getElementById("headline").innerText = "It's my birthday!"; if (document.getElementById("countdown")) document.getElementById("countdown").style.display = "none"; } }, 1000); } updateCountdown(); } })(jQuery); }; // Initial call if not in a React environment or for the first load if (typeof window !== 'undefined' && !window.next) { window.initMetatron(); }