123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524 |
- window.addEventListener('scroll', function(){
- var header = document.querySelector('.header');
- header.classList.toggle("sticky", window.scrollY > 0);
- })
- const searchBar = document.querySelector(".search")
- const searchButton = document.querySelector(".search-btn-mobile")
- if ( searchBar && searchButton) {
- searchButton.addEventListener("click", () => {
- searchBar.classList.toggle("active")
- })
- }
-
- const megaMenuContainer = document.querySelectorAll(".megamenu-parrent");
- const menuItemsAll = document.querySelectorAll(".menu-items");
-
- function megamenuClickToggle () {
- if(megaMenuContainer) {
- megaMenuContainer.forEach(container => {
-
- const megaButton = container.querySelector(".collapse-buton");
-
- const menuItems = container.querySelector(".menu-items")
-
- if(megaButton && menuItems) {
- megaButton.addEventListener("click", () => {
- menuItems.classList.toggle("active");
-
- menuItemsAll.forEach(item => {
- if (item !== menuItems) {
- item.classList.remove("active")
- }
- })
- })
- }
- })
- }
- };
-
- function megamenuHoverOpen () {
- if(megaMenuContainer) {
- megaMenuContainer.forEach(container => {
-
- const menuItems = container.querySelector(".menu-items")
- container.addEventListener("mouseover", () => {
- menuItems.classList.add("active");
- menuItemsAll.forEach(item => {
- if (item !== menuItems) {
- item.classList.remove("active")
- }
- })
- })
- })
- }
- };
-
- function megamenuHoverClose () {
- if(megaMenuContainer) {
- megaMenuContainer.forEach(container => {
-
- const menuItems = container.querySelector(".menu-items")
- container.addEventListener("mouseleave", () => {
- console.log("first")
- menuItems.classList.remove("active");
- })
- })
- }
- };
- const resizeFunction = () => {
- console.log(window.innerWidth)
- if(window.innerWidth > 1199) {
- megamenuHoverOpen();
- megamenuHoverClose();
- } else {
- megamenuClickToggle();
- }
- };
- resizeFunction();
- window.addEventListener("resize", ()=> {
- resizeFunction()
- });
-
-
-
- const megaSubMenu = document.querySelectorAll('.megamenu-submenu .items');
- const subMenuItemsAll = document.querySelectorAll('.megamenu-submenu .submenu-items')
- if(megaSubMenu) {
- megaSubMenu.forEach(menu => {
- const subMenuBtn = menu.querySelector('.submenu-buton');
- const subMenuItems = menu.querySelector('.submenu-items')
-
- if (subMenuItems && subMenuBtn) {
-
- subMenuBtn.addEventListener('click', () => {
- subMenuItems.classList.toggle('active')
-
- subMenuItemsAll.forEach(item => {
- if (item !== subMenuItems) {
- item.classList.remove("active")
- }
- })
- })
-
- }
- })
- }
-
-
- const burgerMenu = document.querySelector(".burger-menu");
- const burgerMenuClose = document.querySelector(".burger-close-btn");
- const mainNav = document.querySelector(".main-nav")
-
-
- if(burgerMenu && mainNav) {
- burgerMenu.addEventListener("click", () => {
- mainNav.classList.add("active")
- })
- }
-
- if(burgerMenuClose && mainNav) {
- burgerMenuClose.addEventListener("click", () => {
- mainNav.classList.remove("active")
- })
- }
-
-
- const filterOpenBtn = document.querySelector("#filter-button");
-
- const filterCloseBtn = document.querySelector('.filter-close-btn');
-
- const filterContainer = document.querySelector('.filter');
-
- if (filterOpenBtn && filterContainer) {
- filterOpenBtn.addEventListener("click", () => {
- filterContainer.classList.add("active")
- });
- }
-
-
- if (filterContainer && filterCloseBtn) {
- filterCloseBtn.addEventListener("click", () => {
- filterContainer.classList.remove("active")
- });
- }
-
-
- const checkoutProductBtnDesktop = document.querySelector('.checkout-product-btn-desktop')
-
- const checkoutProductBtnMobile = document.querySelector('.checkout-product-btn-mobile')
-
- const checkoutContainerCloseBtn = document.querySelector('.cross-btn')
-
- const checkoutContainer = document.querySelector('.checkout-container')
-
- if(checkoutProductBtnDesktop && checkoutContainer) {
- checkoutProductBtnDesktop.addEventListener('click', () => {
-
- if (filterContainer) {
- filterContainer.classList.remove("active")
- }
-
- checkoutContainer.style.display = "block";
- })
- };
-
- if(checkoutProductBtnMobile && checkoutContainer ) {
- checkoutProductBtnMobile.addEventListener('click', () => {
-
-
- if (filterContainer) {
- filterContainer.classList.remove("active")
- }
-
- checkoutContainer.style.display = "block";
- })
- };
-
- if(checkoutContainerCloseBtn && checkoutContainer) {
- checkoutContainerCloseBtn.addEventListener('click', () => {
- checkoutContainer.style.display = "none"
- })
- }
-
-
-
- const bannerSlider = new Swiper(".bannerSlider", {
- spaceBetween: 30,
- centeredSlides: true,
- autoplay: {
- delay: 2500,
- disableOnInteraction: false,
- }
- });
-
- const categorySlider = new Swiper('.categorySlider', {
- loop: false,
- slidesPerView: 5,
- spaceBetween: 30,
- loopedSlides: 1,
- breakpoints: {
- 0: {
- slidesPerView: 5,
- spaceBetween: 10,
- },
- 576: {
- slidesPerView: 4,
- },
- 993: {
- slidesPerView: 6,
- }
- },
- navigation: {
- nextEl: ".swiper-button-next",
- prevEl: ".swiper-button-prev",
- },
- });
-
- 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,
- }
- },
- });
-
- 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",
- },
- });
-
- const allProductNav = new Swiper('.all-product-nav-slider', {
- loop: false,
- slidesPerView: 8,
- spaceBetween: 8,
- loopedSlides: 1,
- navigation: false
- });
-
-
- 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,
- }
- }
- });
-
- 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,
- },
- });
-
- let gallery = new SimpleLightbox('.gallery a', {});
- if(gallery) {
- gallery.on('show.simplelightbox', function () {
-
- });
- }
-
- const step = document.getElementsByClassName("step");
- if (step) {
- var currentTab = 0;
- showTab(currentTab);
-
- function showTab(n) {
-
- var x = document.getElementsByClassName("step");
- x[n].style.display = "block";
-
- if (n == 0) {
- document.getElementById("prevBtn").style.display = "none";
- } else {
- document.getElementById("prevBtn").style.display = "inline";
- }
- if (n == (x.length - 1)) {
- document.getElementById("nextBtn").innerHTML = "Submit";
- } else {
- document.getElementById("nextBtn").innerHTML = "Next";
- }
-
- fixStepIndicator(n)
- }
-
- function nextPrev(n) {
-
- var x = document.getElementsByClassName("step");
-
- if (n == 1 && !validateForm()) return false;
-
- x[currentTab].style.display = "none";
-
- currentTab = currentTab + n;
-
- if (currentTab >= x.length) {
-
- document.getElementById("checkoutForm").submit();
- return false;
- }
-
- showTab(currentTab);
- }
-
- function validateForm() {
-
- var x, y, z, w, i, valid = true;
- x = document.getElementsByClassName("step");
- y = x[currentTab].getElementsByTagName("input");
- z = x[currentTab].getElementsByTagName("select");
- w = x[currentTab].getElementsByTagName("textarea");
-
- for (i = 0; i < y.length; i++) {
-
- if (y[i].value == "") {
-
- y[i].className += " invalid";
-
- valid = false;
- }
- }
- for (i = 0; i < z.length; i++) {
-
- if (z[i].value == "") {
-
- z[i].className += " invalid";
-
- valid = false;
- }
- }
- for (i = 0; i < w.length; i++) {
-
- if (w[i].value == "") {
-
- w[i].className += " invalid";
-
- valid = false;
- }
- }
-
- if (valid) {
- document.getElementsByClassName("stepIndicator")[currentTab].className += " finish";
- }
- return valid;
- }
-
- function fixStepIndicator(n) {
-
- var i, x = document.getElementsByClassName("stepIndicator");
- for (i = 0; i < x.length; i++) {
- x[i].className = x[i].className.replace(" active", "");
- }
-
- x[n].className += " active";
- }
- }
|