// lightbox // let gallery = new SimpleLightbox('.gallery a', {}); // gallery.on('show.simplelightbox', function () { // // do something… // }); // lightbox end // product details carousel // var galleryThumbs = new Swiper('.gallery-thumbs', { // loop: true, // loopedSlides: 1, // spaceBetween: 10, // slidesPerView: 2, // direction: 'vertical', // // centeredSlides: true, // freeMode: true, // breakpoints: { // 0: { // direction: 'horizontal', // spaceBetween: 5, // slidesPerView: 4, // centeredSlides: true, // }, // 993: { // direction: 'vertical', // spaceBetween: 15, // slidesPerView: 4, // } // } // }); // var galleryTop = new Swiper('.gallery-main', { // loop: true, // spaceBetween: 10, // loopedSlides: 1, // centeredSlides: true, // freeMode: true, // navigation: { // nextEl: '.swiper-button-next', // prevEl: '.swiper-button-prev', // }, // thumbs: { // swiper: galleryThumbs, // }, // }); // product details carousel end // fileter sidebar function // filter open button const filterOpenBtn = document.querySelector("#filter-button"); // filter close button const filterCloseBtn = document.querySelector('.filter-close-btn'); // filter sidebar container const filterContainer = document.querySelector('.filter'); // filter open open function if (filterOpenBtn && filterContainer) { filterOpenBtn.addEventListener("click", () => { filterContainer.classList.add("active") }); } // filter close button if (filterContainer && filterCloseBtn) { filterCloseBtn.addEventListener("click", () => { filterContainer.classList.remove("active") }); } // fileter sidebar function end // checkout sidebar function // checkout open desktop button const checkoutProductBtnDesktop = document.querySelector('.checkout-product-btn-desktop') // checkout open mobile button const checkoutProductBtnMobile = document.querySelector('.checkout-product-btn-mobile') // checkout close button const checkoutContainerCloseBtn = document.querySelector('.cross-btn') // checkout container const checkoutContainer = document.querySelector('.checkout-container') // checkout open function for desktop if(checkoutProductBtnDesktop && checkoutContainer && filterContainer) { checkoutProductBtnDesktop.addEventListener('click', () => { // hide fillter sidebar if open filterContainer.classList.remove("active") // open checkout sidebar checkoutContainer.style.display = "block"; }) }; // checkout open function for mobile if(checkoutProductBtnMobile && checkoutContainer && filterContainer) { checkoutProductBtnMobile.addEventListener('click', () => { // hide fillter sidebar if open filterContainer.classList.remove("active"); // open checkout sidebar checkoutContainer.style.display = "block"; }) }; // checkout close function if(checkoutContainerCloseBtn && checkoutContainer) { checkoutContainerCloseBtn.addEventListener('click', () => { checkoutContainer.style.display = "none" }) } // checkout sidebar function end // all carousel // homepage hero banner slider home page const bannerSlider = new Swiper(".bannerSlider", { spaceBetween: 30, centeredSlides: true, autoplay: { delay: 2500, disableOnInteraction: false, } }); // category slider home page const categorySlider = new Swiper('.categorySlider', { loop: false, slidesPerView: 5, spaceBetween: 30, loopedSlides: 1, breakpoints: { 0: { slidesPerView: 3, }, 576: { slidesPerView: 4, }, 993: { slidesPerView: 5, } }, navigation: { nextEl: ".swiper-button-next", prevEl: ".swiper-button-prev", }, }); // Feture brand slider home page const featuredBrands = new Swiper('.featuredBrands', { loop: false, slidesPerView: 4, spaceBetween: 30, loopedSlides: 1, navigation: false, breakpoints: { 0: { slidesPerView: 2, }, 576: { slidesPerView: 3, }, 993: { slidesPerView: 5, } }, }); // Feture brand slider home page const trendingStories = new Swiper('.trendingStories', { loop: true, slidesPerView: 3, spaceBetween: 30, loopedSlides: 1, navigation: false, breakpoints: { 0: { slidesPerView: 1, }, 576: { slidesPerView: 2, }, 993: { slidesPerView: 3, } }, navigation: { nextEl: ".swiper-button-next", prevEl: ".swiper-button-prev", }, }); // all product nav slider brand slider all product page const allProductNav = new Swiper('.all-product-nav-slider', { loop: false, slidesPerView: 8, spaceBetween: 8, loopedSlides: 1, navigation: false }); // // product details page carousel // thumb carousel var productThumb = new Swiper('.productThumb', { loop: true, loopedSlides: 1, spaceBetween: 10, slidesPerView: 2, direction: 'vertical', freeMode: true, breakpoints: { 0: { direction: 'horizontal', spaceBetween: 15, slidesPerView: 4, centeredSlides: true, }, 993: { direction: 'vertical', spaceBetween: 15, slidesPerView: 3, } } }); // productSlider carousel var productSlider = new Swiper('.productSlider', { loop: true, spaceBetween: 10, loopedSlides: 1, centeredSlides: true, freeMode: true, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', disabledClass: 'disabled_swiper_button' }, thumbs: { swiper: productThumb, }, }); // all carousel end // simple light box let gallery = new SimpleLightbox('.gallery a', {}); if(gallery) { gallery.on('show.simplelightbox', function () { // do something… }); }