"use strict";

/* ---------------------
   [Master JavaScript]
   Template Name: Softora - IT Solutions & Technology HTML Template
   Version: 1.0.0
   Author: Nano Theme
--------------------- */

/* ---------------------
   [Table of Contents]

   1. Core Features
      1.1.0 Sticky Header (sticky-header)
      1.2.0 Mobile Dropdown Menu (mobile-menu)
      1.3.0 Anchor Prevent Default (anchor-prevent)
      1.4.0 Search Form (search-form)
   2. Sliders & Carousels
      2.1.0 Service Swiper Slide (service-slide)
      2.2.0 Service Swiper Slide Two (service-slide-two)
      2.3.0 Project Swiper Slide (portfolio-swiper)
      2.4.0 Project Two Swiper Slide (portfolio-two-swiper)
      2.5.0 Testimonial Swiper Slide (testimonial-swiper)
      2.6.0 Testimonial Swiper Slide Two (testimonial-swiper-two)
      2.7.0 Testimonial Swiper Slide Three (testimonial-swiper-three)
      2.8.0 Team Swiper Slide (team-swiper)
   3. UI Enhancements
      3.1.0 Counter Up (counter-up)
      3.2.0 Scroll to Top (scroll-top)
      3.3.0 Video Popup
      3.4.0 Isotope
      3.5.0 Rotating Image
      3.6.0 Progress Bar
      3.7.0 Pricing Plan Switching
      3.8.0 Copyright Year
      3.9.0 WOW Activation
      3.10.0 Tooltip Activation
      3.11.0 Toast Activation
      3.12.0 Popover Activation
      3.13.0 Preloader
--------------------- */

// 1.1 Sticky Header

const navarToggler = document.querySelector('.navbar-toggler');
const header = document.querySelector('.header-area');

if (navarToggler) {
    navarToggler.addEventListener('click', () => {
        header.classList.toggle('mobile-menu-open');
    });
}

/*
if (header) {
    function stickyNavigation() {
        if (window.pageYOffset > 10) {
            header.classList.add('sticky-on');
        } else {
            header.classList.remove('sticky-on');
        }
    }

    window.addEventListener('load', stickyNavigation);
    window.addEventListener('scroll', stickyNavigation);
}
*/

// 1.2 Mobile Dropdown Menu

/*
function mobileDropdownMenu() {
    const sbdropdown = document.querySelectorAll('.softora-dd');
    if (sbdropdown.length > 0) {
        const navUrl = document.querySelectorAll('.navbar-nav li ul');
        navUrl.forEach(url => {
            url.insertAdjacentHTML('beforebegin', '<div class="dropdown-toggler"><i class="bi bi-caret-down-fill"></i></div>');
        });

        const ddtrogglers = document.querySelectorAll('.dropdown-toggler');
        ddtrogglers.forEach(ddtoggler => {
            ddtoggler.addEventListener('click', () => {
                const ddNext = ddtoggler.nextElementSibling;
                slideToggle(ddNext, 300);
            });
        });
    }
}
window.addEventListener('load', mobileDropdownMenu);
*/

// 1.3 Anchor Prevent Default

const anchors = document.querySelectorAll('a[href="#"]');
anchors.forEach(anchor => {
    anchor.addEventListener('click', e => e.preventDefault());
});

// 1.4 Search Form

const searchButton = document.getElementById('searchButton');
const searchClose = document.getElementById('searchClose');
const searchFormPopup = document.querySelector('.search-form-popup');
const searchOverlay = document.getElementById('searchOverlay');

if (searchButton) {
    searchButton.addEventListener('click', () => {
        searchFormPopup.classList.add('open');
        searchOverlay.classList.add('open');
    });
    searchClose.addEventListener('click', () => {
        searchFormPopup.classList.remove('open');
        searchOverlay.classList.remove('open');
    });
}

// 2.1.0 Service Swiper Slide

const serviceSwiper = document.querySelector('.service-swiper-slider');

if (serviceSwiper) {
    // Check if Swiper is defined
    if (typeof Swiper !== 'undefined') {
        new Swiper('.service-swiper-slider', {
            loop: true,
            slidesPerView: 3,
            spaceBetween: 30,
            autoplay: {
                delay: 5000,
                disableOnInteraction: false,
            },
            pagination: {
                el: ".service-pagination",
                clickable: true,
            },
            breakpoints: {
                320: {
                    slidesPerView: 1,
                    spaceBetween: 0,
                },
                768: {
                    slidesPerView: 2,
                    spaceBetween: 20,
                },
                1200: {
                    slidesPerView: 3,
                    spaceBetween: 30,
                },
            },
        });
    }
}

// 2.2.0 Service Swiper Slide Two

const serviceSwiperTwo = document.querySelector('.service-swiper-slider-two');

if (serviceSwiperTwo) {
    if (typeof Swiper !== 'undefined') {
        new Swiper('.service-swiper-slider-two', {
            loop: true,
            slidesPerView: 6,
            spaceBetween: 30,
            centeredSlides: true,
            autoplay: {
                delay: 5000,
                disableOnInteraction: false,
            },
            pagination: {
                el: ".service-pagination-two",
                clickable: true,
            },
            breakpoints: {
                320: {
                    slidesPerView: 1,
                    spaceBetween: 10,
                },
                480: {
                    slidesPerView: 1.5,
                    spaceBetween: 20,
                },
                576: {
                    slidesPerView: 2,
                    spaceBetween: 20,
                },
                768: {
                    slidesPerView: 2.5,
                    spaceBetween: 20,
                },
                992: {
                    slidesPerView: 3,
                    spaceBetween: 20,
                },
                1200: {
                    slidesPerView: 4,
                    spaceBetween: 30,
                },
                1400: {
                    slidesPerView: 5,
                    spaceBetween: 30,
                },
                1800: {
                    slidesPerView: 6,
                    spaceBetween: 30,
                },
            },
        });
    }
}

// 2.3.0 Project Swiper Slide

const projectSwiper = document.querySelector('.project-swiper');

if (projectSwiper) {
    if (typeof Swiper !== 'undefined') {
        new Swiper('.project-swiper', {
            loop: true,
            slidesPerView: 4,
            spaceBetween: 30,
            navigation: {
                nextEl: '.project-button-next',
                prevEl: '.project-button-prev',
            },
            autoplay: {
                delay: 5000,
                disableOnInteraction: false,
            },
            breakpoints: {
                320: {
                    slidesPerView: 1,
                    spaceBetween: 10,
                },
                480: {
                    slidesPerView: 1,
                    spaceBetween: 20,
                },
                576: {
                    slidesPerView: 2,
                    spaceBetween: 20,
                },
                768: {
                    slidesPerView: 3,
                    spaceBetween: 20,
                },
                1200: {
                    slidesPerView: 4,
                    spaceBetween: 30,
                },
            },
        });
    }
}

// 2.4.0 Project Two Swiper Slide

const swiperInstances = [];
const projectTwoSwipers = document.querySelectorAll('.project-two-swiper');

if (projectTwoSwipers.length > 0) {
    if (typeof Swiper !== 'undefined') {
        projectTwoSwipers.forEach((swiperEl, index) => {
            const projectSwiper = new Swiper(swiperEl, {
                loop: true,
                slidesPerView: 'auto',
                spaceBetween: 30,
                pagination: {
                    el: swiperEl.querySelector('.project-two-pagination'),
                    clickable: true,
                },
                grabCursor: true,
                watchSlidesProgress: true,
            });

            swiperInstances.push(projectSwiper);

            swiperEl.querySelectorAll('.project-two-card').forEach(slide => {
                slide.addEventListener('click', () => {
                    swiperEl.querySelectorAll('.project-two-card').forEach(s => {
                        s.classList.remove('slide-expand');
                    });
                    slide.classList.add('slide-expand');
                });
            });
        });
    }
}

const tabSwipers = document.querySelectorAll('[data-bs-toggle="tab"]');

if (tabSwipers.length > 0) {
    tabSwipers.forEach(tabBtn => {
        tabBtn.addEventListener('shown.bs.tab', (e) => {
            const targetTab = document.querySelector(e.target.getAttribute('data-bs-target'));
            const targetSwiperEl = targetTab.querySelector('.project-two-swiper');

            if (targetSwiperEl) {
                const swiperIndex = Array.from(document.querySelectorAll('.project-two-swiper')).indexOf(targetSwiperEl);
                const projectSwiper = swiperInstances[swiperIndex];

                setTimeout(() => {
                    projectSwiper.update();
                }, 100);
            }
        });
    });
}

// 2.5.0 Testimonial Swiper Slide

const testimonialSwiper = document.querySelector('.testimonial-swiper');

if (testimonialSwiper) {
    if (typeof Swiper !== 'undefined') {
        new Swiper('.testimonial-swiper', {
            loop: true,
            spaceBetween: 0,
            slidesPerView: 1,
            autoplay: {
                delay: 5000,
                disableOnInteraction: false,
            },
            pagination: {
                el: ".testimonial-pagination",
                clickable: true,
            },
            navigation: {
                nextEl: '.testimonial-button-next',
                prevEl: '.testimonial-button-prev',
            },
        });
    }
}

// 2.6.0 Testimonial Swiper Slide Two

const testimonialSwiperTwo = document.querySelector('.testimonial-swiper-two');

if (testimonialSwiperTwo) {
    if (typeof Swiper !== 'undefined') {
        new Swiper('.testimonial-swiper-two', {
            loop: true,
            spaceBetween: 30,
            slidesPerView: 3,
            centeredSlides: true,
            autoplay: {
                delay: 5000,
                disableOnInteraction: false,
            },
            pagination: {
                el: ".testimonial-swiper-two-pagination",
                clickable: true,
            },
            breakpoints: {
                320: {
                    slidesPerView: 1,
                    spaceBetween: 10,
                },
                480: {
                    slidesPerView: 1,
                    spaceBetween: 20,
                },
                768: {
                    slidesPerView: 2,
                    spaceBetween: 20,
                },
                1200: {
                    slidesPerView: 3,
                    spaceBetween: 30,
                },
            },
        });
    }
}

// 2.7.0 Team Swiper Slide

const teamSwiper = document.querySelector('.team-swiper');

if (teamSwiper) {
    if (typeof Swiper !== 'undefined') {
        new Swiper('.team-swiper', {
            loop: true,
            spaceBetween: 30,
            slidesPerView: 4,
            autoplay: {
                delay: 5000,
                disableOnInteraction: false,
            },
            navigation: {
                nextEl: '.team-button-next',
                prevEl: '.team-button-prev',
            },
            breakpoints: {
                320: {
                    slidesPerView: 1.5,
                    spaceBetween: 10,
                },
                480: {
                    slidesPerView: 2,
                    spaceBetween: 20,
                },
                576: {
                    slidesPerView: 2.5,
                    spaceBetween: 20,
                },
                768: {
                    slidesPerView: 3,
                    spaceBetween: 20,
                },
                992: {
                    slidesPerView: 4,
                    spaceBetween: 20,
                }
            },
        });
    }
}

// 3.1.0 Counter Up

const counterElements = document.querySelectorAll('.counter');

if (counterElements.length > 0) {
    if (window.counterUp) {
        const counterUp = window.counterUp.default;

        const callback = (entries) => {
            entries.forEach(entry => {
                const counterElement = entry.target;
                if (entry.isIntersecting && !counterElement.classList.contains('is-visible')) {
                    counterUp(counterElement, {
                        duration: 2000,
                        delay: 20
                    });
                    counterElement.classList.add('is-visible');
                }
            });
        };

        const IO = new IntersectionObserver(callback, {
            threshold: 1
        });
        counterElements.forEach(element => IO.observe(element));
    }
}

// 3.2.0 Scroll to Top

const scrollButton = document.getElementById('scrollTopButton');
const topDistance = 600;

if (scrollButton) {
    window.addEventListener('scroll', () => {
        if (document.body.scrollTop > topDistance || document.documentElement.scrollTop > topDistance) {
            scrollButton.classList.add('scrolltop-show');
            scrollButton.classList.remove('scrolltop-hide');
        } else {
            scrollButton.classList.add('scrolltop-hide');
            scrollButton.classList.remove('scrolltop-show');
        }
    });

    scrollButton.addEventListener('click', () => {
        window.scrollTo({
            top: 0,
            left: 0,
            behavior: 'smooth'
        });
    });

    function updateScrollProgress() {
        const scrollY = window.scrollY;
        const windowHeight = window.innerHeight;
        const documentHeight = document.documentElement.scrollHeight;
        const scrollPercent = (scrollY / (documentHeight - windowHeight)) * 100;
        scrollButton.style.setProperty('--scroll-progress', `${scrollPercent}%`);
    }

    window.addEventListener('scroll', updateScrollProgress);
}

// 3.3.0 Video Popup

const videoPopup = document.getElementById("videoPopup");
const videoFrame = document.getElementById("videoFrame");
const closeBtn = document.getElementById("videoCloseButton");
const videoBtns = document.querySelectorAll(".video-btn");

if (closeBtn && videoBtns.length > 0) {
    videoBtns.forEach(button => {
        button.addEventListener("click", function () {
            let videoUrl = this.getAttribute("data-video");

            if (videoUrl) {
                let separator = videoUrl.includes("?") ? "&" : "?";

                if (videoUrl.includes("youtu.be")) {
                    let videoId = videoUrl.split("/").pop();
                    videoUrl = `https://www.youtube.com/embed/${videoId}`;
                }

                if (videoUrl.includes("youtube.com/watch")) {
                    let videoId = new URL(videoUrl).searchParams.get("v");
                    videoUrl = `https://www.youtube.com/embed/${videoId}`;
                }

                if (videoUrl.includes("youtube.com") || videoUrl.includes("vimeo.com")) {
                    videoUrl += `${separator}autoplay=1`;
                }

                videoFrame.src = videoUrl;
                videoFrame.setAttribute("allow", "autoplay; encrypted-media");
                videoPopup.style.display = "flex";
            }
        });
    });

    closeBtn.addEventListener("click", () => {
        videoPopup.style.display = "none";
        videoFrame.src = "";
    });

    window.addEventListener("click", (event) => {
        if (event.target === videoPopup) {
            videoPopup.style.display = "none";
            videoFrame.src = "";
        }
    });
}

// 3.4.0 Isotope

const grids = document.querySelectorAll('.softora-filter');

if (grids.length > 0) {
    if (typeof Isotope !== 'undefined' && typeof imagesLoaded !== 'undefined') {
        grids.forEach(grid => {
            imagesLoaded(grid, () => {
                const iso = new Isotope(grid, {
                    itemSelector: '.filter-item',
                    percentPosition: true,
                    layoutMode: 'masonry',
                    masonry: {
                        columnWidth: '.filter-item'
                    }
                });

                const filtersElem = grid.closest('.softora-container').querySelector('.softora-filter-nav');

                if (filtersElem) {
                    filtersElem.addEventListener('click', (event) => {
                        if (!event.target.matches('button')) return;
                        const filterValue = event.target.getAttribute('data-filter');
                        iso.arrange({
                            filter: filterValue
                        });
                    });

                    const radioButtonGroup = (buttonGroup) => {
                        buttonGroup.addEventListener('click', (event) => {
                            if (!event.target.matches('button')) return;
                            buttonGroup.querySelector('.active').classList.remove('active');
                            event.target.classList.add('active');
                        });
                    };

                    radioButtonGroup(filtersElem);
                }
            });
        });
    }
}

// 3.5.0 Rotating Image

const rotatingImages = document.querySelectorAll('.rotatingImage');

if (rotatingImages.length > 0) {
    window.addEventListener('scroll', () => {
        const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
        const rotateValue = scrollTop % 360;
        rotatingImages.forEach(image => {
            image.style.transform = `rotate(${rotateValue}deg)`;
        });
    });
}

// 3.6.0 Progress Bar

const progressBars = document.querySelectorAll('.progress-bar');

if (progressBars.length > 0) {
    progressBars.forEach(function (progressBar) {
        const value = parseInt(progressBar.getAttribute('data-value'), 10); // Added radix

        progressBar.style.width = value + '%';
        const spanElements = progressBar.closest('.progress-item').querySelectorAll('.progress-info span');
        if (spanElements.length > 1) {
            const percentSpan = spanElements[1];
            percentSpan.textContent = value + '%';
            percentSpan.style.marginRight = (100 - value) + '%';
        }
    });
}

// 3.7.0 Pricing Plan Switching

const switchButtons = document.querySelectorAll(".pricing-plan-switching .btn");
const priceCards = document.querySelectorAll(".price-table-one");

if (switchButtons.length > 0 && priceCards.length > 0) {
    switchButtons.forEach(btn => {
        btn.addEventListener("click", () => {
            switchButtons.forEach(b => b.classList.remove("active"));
            btn.classList.add("active");

            const isYearly = btn.textContent.trim().toLowerCase() === "yearly";

            priceCards.forEach(card => {
                const priceDisplay = card.querySelector(".price-display");
                const priceAmountEl = card.querySelector(".price-amount");
                const priceTypeEl = card.querySelector(".price-type");
                priceDisplay.classList.add("fade-out");

                setTimeout(() => {
                    const newPrice = isYearly ? card.dataset.yearly : card.dataset.monthly;
                    const newLabel = isYearly ? "/Year" : "/Month";
                    priceAmountEl.textContent = `$${newPrice}`;
                    priceTypeEl.textContent = newLabel;
                    priceDisplay.classList.remove("fade-out");
                    priceDisplay.classList.add("fade-in");
                    setTimeout(() => {
                        priceDisplay.classList.remove("fade-in");
                    }, 400);
                }, 300);
            });
        });
    });
}

// 3.8.0 Copyright Year

const year = document.getElementById("year");
if (year) {
    const currentYear = new Date().getFullYear();
    year.textContent = currentYear;
}

// 3.9.0 WOW Activation

const wowjs = document.querySelectorAll('.wow').length;

if (wowjs > 0) {
    if (typeof WOW !== 'undefined') {
        new WOW().init();
    }
}

// 3.10 Tooltip Activation

if (typeof bootstrap !== 'undefined') {
    let softoraTooltip = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
    let tooltipList = softoraTooltip.map(function (sbTooltip) {
        return new bootstrap.Tooltip(sbTooltip);
    });

    // 3.11 Toast Activation

    let softoraToast = [].slice.call(document.querySelectorAll('.toast'));
    let toastList = softoraToast.map(function (sbToast) {
        return new bootstrap.Toast(sbToast);
    });
    toastList.forEach(toast => toast.show());

    // 3.12 Popover Activation

    let softoraPopover = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'))
    let popoverList = softoraPopover.map(function (sbPopover) {
        return new bootstrap.Popover(sbPopover);
    });
}

// 3.13 Preloader

const preloader = document.getElementById('preloader');

if (preloader) {
    window.addEventListener('load', function () {
        let fadeOut = setInterval(function () {
            if (!preloader.style.opacity) {
                preloader.style.opacity = 1;
            }
            if (preloader.style.opacity > 0) {
                preloader.style.opacity -= 0.1;
            } else {
                clearInterval(fadeOut);
                preloader.remove();
            }
        }, 100);
    });
}