"use strict";
// sticky step section
gsap.registerPlugin(ScrollTrigger);

const parallax_box = document.querySelectorAll("[data-parallax]");
parallax_box.forEach(function (prel) {
    const parallax_el = prel.querySelectorAll("[data-speed]");
    parallax_el.forEach(function (el) {
        let smoothVal = Number(el.dataset.speed === 0 ? 1 : el.dataset.speed) * 100;
        gsap.to(el, {
            yPercent: -smoothVal,
            ease: "none",
            scrollTrigger: {
                trigger: prel,
                scrub: 1.1
            },
        });
    })
})

jQuery(document).ready(function ($) {
    // document start


    // Navbar
    $("<span class='clickD'></span>").insertAfter(".navbar-nav li.menu-item-has-children > a");
    $('.navbar-nav li .clickD').click(function (e) {
        e.preventDefault();
        var $this = $(this);
        if ($this.next().hasClass('show')) {
            $this.next().removeClass('show');
            $this.removeClass('toggled');
        }
        else {
            $this.parent().parent().find('.sub-menu').removeClass('show');
            $this.parent().parent().find('.toggled').removeClass('toggled');
            $this.next().toggleClass('show');
            $this.toggleClass('toggled');
        }
    });

    $(window).on('resize', function () {
        if ($(this).width() < 1025) {
            $('html').click(function () {
                $('.navbar-nav li .clickD').removeClass('toggled');
                $('.toggled').removeClass('toggled');
                $('.sub-menu').removeClass('show');
            });
            $(document).click(function () {
                $('.navbar-nav li .clickD').removeClass('toggled');
                $('.toggled').removeClass('toggled');
                $('.sub-menu').removeClass('show');
            });
            $('.navbar-nav').click(function (e) {
                e.stopPropagation();
            });
        }
    });
    // Navbar end



    /* ===== For menu animation === */
    $(".navbar-toggler").click(function () {
        $(".navbar-toggler").toggleClass("open");
        $(".navbar-toggler .stick").toggleClass("open");
        $('body,html').toggleClass("open-nav");
    });

    // Navbar end


    // Sticky Nav
        $(window).scroll(function() {     
            var scroll = $(window).scrollTop();     
            if (scroll > 0) { 
                $(".main-head").addClass("fixed"); 
            } 
            else {
            $(".main-head").removeClass("fixed"); 
            }
        })
    

    // back to top
    if ($("#scroll").length) {
        $(window).scroll(function () {
            if ($(this).scrollTop() > 200) {
                $('#scroll').fadeIn(200);
            } else {
                $('#scroll').fadeOut(200);
            }
        });
        $('#scroll').click(function () {
            $("html, body").animate({ scrollTop: 0 }, 500);
            return false;
        });
    }

    // $("#top_btn").on("click", function (e) {
    //     e.preventDefault();
    //     $("body, html").animate({
    //         scrollTop: $($(this).attr('href')).offset().top - $(".main-head").outerHeight()
    //     }, 500);
    // });


    $('.responsive').slick({
        dots: true,
        infinite: false,
        speed: 300,
        slidesToShow: 4,
        slidesToScroll: 4,
        responsive: [
            {
                breakpoint: 1024,
                settings: {
                    slidesToShow: 3,
                    slidesToScroll: 3,
                    infinite: true,
                    dots: true
                }
            },
            {
                breakpoint: 600,
                settings: {
                    slidesToShow: 2,
                    slidesToScroll: 2
                }
            },
            {
                breakpoint: 480,
                settings: {
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            }
            // You can unslick at a given breakpoint now by adding:
            // settings: "unslick"
            // instead of a settings object
        ]
    });




    if ($(".banner-slider").length) {
        $('.banner-slider').slick({
            dots: false,
            arrows: false,
            infinite: true,
            speed: 1500,
            autoplay: true,
            autoplaySpeed: 3500,
            slidesToShow: 1,
            slidesToScroll: 1,
            fade: true,
            pauseOnHover:false,
            // vertical: true,
            cssEase: 'ease-in-out',
        });
    }

    $('.navbar-nav a[href*="#"]').click(function () {
        $(".navbar-collapse").removeClass("show");
        $(".navbar-toggler").removeClass("open");
        $(".navbar-toggler .stick").removeClass("open");
        $('body,html').removeClass("open-nav");
    });

    // jQuery(function ($) {
    //     var topMenuHeight = $(".main-head").outerHeight();
    //     $(".navbar-collapse").menuScroll(topMenuHeight);
    // });



    // splitting text
    Splitting({
        target: "[data-splitting]",
        by: "chars",
    });
    // splitting text end

    // reveal animation
    if ($(".reveal").length) {
        var reveal = gsap.utils.toArray(".reveal > *");

        reveal.forEach((elem, i) => {
            ScrollTrigger.create({
                trigger: elem,
                start: "top 90%",
                end: "top 15%",
                //toggleActions: "play reverse",
                onEnter() {
                    elem.classList.add('play-reveal');
                },
                // onLeave() {
                //   elem.classList.remove('play-reveal');
                // },
                // onEnterBack() {
                //   elem.classList.add('play-reveal');
                // },
                // onLeaveBack() {
                //   elem.classList.remove('play-reveal');
                // }
            });


        })
    }
    // reveal animation end


    // equal height 
    function equal_height() {
        $('.service-card .service-text').matchHeight({ property: 'min-height' });
    }
    equal_height();
    $(window).on('load', function (event) {
        equal_height();
    });
    $(window).resize(function (event) {
        equal_height();
    });




    if ($(".feature-sec").length) {
        var featureRevel = document.querySelector(".feature-sec");
        let Tl = gsap.timeline({
            scrollTrigger: {
                trigger: ".feature-sec",
                start: "top 20%",
                end: "bottom 50%",
                scrub: 1,
                onEnter() {
                    $(".feature-sec").addClass('play-reveal');
                }
            }
        })
    }

    setTimeout(() => {
        if ($('[data-anim="parent-anim-sec"]').length) {
            const parentAnimation = document.querySelectorAll('[data-anim="parent-anim-sec"]');
            parentAnimation.forEach((elem, index) => {
                let moveUpElem = elem.querySelectorAll("[data-move]");
                let slideElem = elem.querySelectorAll("[data-slide]");
                let moveTl = gsap.timeline();
                let slideTl = gsap.timeline();
                moveUpElem.forEach(function (elem2, index2) {
                    if (elem2.dataset.move == "up") {
                        gsap.set(elem2, { y: 60, opacity: 0 });
                        moveTl.to(elem2, {
                            ease: "none",
                            duration: 0.6,
                            y: 0,
                            opacity: 1,
                        })
                    }

                    if (elem2.dataset.move == "scale-up") {
                        gsap.set(elem2, { y: 50, scale: 0 });
                        slideTl.to(elem2, {
                            ease: "Power3.easeOut",
                            duration: 0.8,
                            scale: 1,
                            opacity: 1,
                            delay: () => {
                                if (elem2.dataset.delay) {
                                    return elem2.dataset.delay;
                                } else {
                                    return 0;
                                }
                            },
                            y: 0,
                        }, "=-0.2")
                    }
                    if (elem2.dataset.move == "pop-up") {
                        gsap.set(elem2, { opacity: 0, scale: 0.7, y: 40, });
                        slideTl.to(elem2, {
                            ease: "bounce",
                            duration: 0.8,
                            scale: 1,
                            opacity: 1,
                            y: 0,
                            delay: () => {
                                if (elem2.dataset.delay) {
                                    return elem2.dataset.delay;
                                } else {
                                    return 0;
                                }
                            },
                        }, "=-0.2")
                    }
                    moveTl.pause();
                    ScrollTrigger.create({
                        trigger: elem2,
                        start: "top 95%",
                        animation: moveTl,
                        //markers:true,
                    })
                });

                slideElem.forEach(function (elem2, index2) {
                    if (elem2.dataset.slide == "right") {
                        gsap.set(elem2, { x: -100, opacity: 0, });
                        slideTl.to(elem2, {
                            //   stagger: 0.2,
                            ease: "Power3.easeOut",
                            duration: 0.8,
                            opacity: 1,
                            x: 0,
                        }, (index2 == 0 ? "" : "-=0.7"))
                    }
                    if (elem2.dataset.slide == "left") {
                        gsap.set(elem2, { x: 100, opacity: 0, });
                        slideTl.to(elem2, {
                            //   stagger: 0.2,
                            ease: "Power3.easeOut",
                            duration: 0.8,
                            opacity: 1,
                            x: 0,
                        }, (index2 == 0 ? "" : "-=0.7"))
                    }

                    ScrollTrigger.create({
                        trigger: elem2,
                        start: "top 85%",
                        animation: slideTl,
                        //markers:true,
                    })
                });

            })
        }
    }, 10);

    if ($(".risk-management-sec").length) {
        let redLine = document.querySelector('.red-bar');
        let redDrawTl = gsap.timeline({});
        gsap.set([redLine], {
            clipPath: "polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%)",
        })

        redDrawTl.to(redLine, {
            clipPath: "polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)",
            duration: 0.5,
            ease: "none",
            delay: 0.5,
        })
        redDrawTl.pause();
        ScrollTrigger.create({
            trigger: redLine,
            start: "top 80%",
            animation: redDrawTl,
        })
    }

    if ($("[data-parallax]").length) {
        document.querySelectorAll("[data-parallax]").forEach((el) => {
            let pr_val = Number(el.dataset.parallax) * 100;
            gsap.to(el, {
                yPercent: pr_val,
                duration: 1,
                ease: "none",
                scrollTrigger: {
                    trigger: el,
                    start: "top bottom",
                    end: "bottom top",
                    scrub: 1.3,
                    invalidateOnRefresh: true,
                    // markers: true,
                },
            });
        });

    }

    $(window).on('load', function () {
        handlePreloader();
    });
    
    function handlePreloader() {
        if ($('.preloader').length) {
            $('.preloader').delay(200).fadeOut(1000);
        }
    }
    // document end

})

const lengthCounter = document.querySelectorAll(".counter").length;
if (lengthCounter) {
    const counterUp = window.counterUp.default
    const callback = entries => {
        entries.forEach(entry => {
            const el = entry.target
            if (entry.isIntersecting && !el.classList.contains('is-visible')) {
                counterUp(el, {
                    duration: 3000,
                    delay: 16,
                })
                el.classList.add('is-visible')
            }
        })
    }

    const IO = new IntersectionObserver(callback, { threshold: 1 })

    const allel = document.querySelectorAll('.counter')
    allel.forEach(function (el) {
        IO.observe(el);
    });
}




