$(window).on('load', function () {
    commonScripts();
    mainSlider();
    mobileExpander();

    // Home Collection Slider
    $(".collection-slider").owlCarousel({
        loop: 0,
        margin: 10,
        nav: 0,
        dots: 0,
        items: 1,
        stagePadding: 35,
        autoplay: 0,
        responsive: {
            768: {
                items: 2,
            },
            1200: {
                items: 4,
                margin: 50,
                stagePadding: 0,
                dots: 0,
                nav: 1,
                navText: [
                    '<svg aria-hidden="true"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#arr_left"></use></svg>',
                    '<svg aria-hidden="true"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#arr_right"></use></svg>'
                ],
            },
        },
    });

    // Home Community Slider
    $(".community-slider").owlCarousel({
        loop: 0,
        margin: 10,
        nav: 0,
        dots: 0,
        items: 1,
        stagePadding: 35,
        autoplay: 0,
        responsive: {
            768: {
                items: 2,
            },
            1200: {
                items: 2,
                margin: 70,
                stagePadding: 0,
                dots: 0,
                nav: 1,
                navText: [
                    '<svg aria-hidden="true"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#arr_left"></use></svg>',
                    '<svg aria-hidden="true"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#arr_right"></use></svg>'
                ],
            },
        },
    });

    $(".explore-more-slider").owlCarousel({
        loop: 0,
        margin: 10,
        nav: 0,
        dots: 0,
        items: 1,
        stagePadding: 20,
        autoplay: 0,
        responsive: {
            768: {
                items: 2,
            },
            1200: {
                items: 4,
                margin: 45,
                stagePadding: 0,
                dots: 0,
                nav: 1,
                navText: [
                    '<svg aria-hidden="true"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#arr_left"></use></svg>',
                    '<svg aria-hidden="true"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#arr_right"></use></svg>'
                ],
            },
        },
    });

    // Technique Slider Mobile only
    var techSlider = $('.technique-slider');
    var techArgs = {
        items: 1,
        dots: 0,
        loop: 1,
        nav: 0,
        stagePadding: 30,
        autoplay: 0,
        margin: 10,
        responsive: {
            768: {
                items: 2,
            },
        },
    }
    slidrerOnlyMobile(techSlider, 1200, techArgs);
});

$(window).scroll(function () {
    var currentPoint = $(this).scrollTop();
    if (currentPoint > 80) {
        $(".navigation").addClass("fixed");
        $(".main-banner").addClass("fixed");
    } else {
        $(".navigation").removeClass("fixed");
        $(".main-banner").removeClass("fixed");
    }
    if (currentPoint > 120) {
    $(".navigation").addClass("anim");
    } else {
        $(".navigation").removeClass("anim");
    }
});

$(document).ready(function () {
    var $mainMenuState = $('#main-menu-state');
    if ($mainMenuState.length) {
        // animate mobile menu
        $mainMenuState.change(function(e) {
            var $menu = $('#mobile-menu');
            var $bookingBtn = $('.booking-button');

            if (this.checked) {
                $menu.hide().slideDown(80, function() { $menu.css('display', ''); });
                $('.mega-menu').addClass('visible');
                $bookingBtn.addClass('book-bg');
            } else {
                $menu.show().slideUp(80, function() { $menu.css('display', ''); });
                $('.mega-menu').removeClass('visible');
                $bookingBtn.removeClass('book-bg');
            }
        });

        // hide mobile menu beforeunload
        $(window).on('beforeunload unload', function() {
            if ($mainMenuState[0].checked) {
                $mainMenuState[0].click();
            }
        });
    }

    var windowInnerHeight = $(window).innerHeight();
    $('.main-banner.home-page').css('height', windowInnerHeight);

    /**************
    * Site Search *
    ***************/
    $('.search-button').on('click', function (e) {
        e.stopPropagation();
        $('.search-bar').toggleClass('active');
    });

    $(document).on('click', function (e) {
        if (!$(e.target).closest('.search-bar, .search-button').length) {
            $('.search-bar').removeClass('active');
        }
    });

    $(document).on('keydown', function (e) {
        if (e.key === "Escape") {
            $('.search-bar').removeClass('active');
        }
    });

    // Hide all descriptions initially
    $('.technique-banner .desc').hide();

    $('.technique-banner').on('click', '.title', function () {

        const $item = $(this).closest('.items');

        // Toggle current item
        $item.find('.desc').stop(true, true).slideToggle(300);
        $item.toggleClass('active');

    });
});

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

	var $select = $('select[name="attribute_pa_size"]');

	if ($select.length) {

		// Hide original select
		$select.hide();

		// Create custom buttons wrapper
		var html = '<div class="size-options">';

		// Skip first option (Choose an option)
		$select.find('option:not(:first)').each(function(){

			var value = $(this).val();
			var text  = $(this).text();

			html += '<button type="button" class="size-btn" data-value="'+value+'">'+text+'</button>';

		});

		html += '</div>';

		// Add buttons after select
		$select.after(html);
	}

    $(document).on('click', '.product-details .acc-head', function(){

        var $parent = $(this).parent();

        if ($parent.hasClass('active')) {

            $parent.removeClass('active');
            $parent.find('.acc-body').slideUp();

        } else {

            $('.product-details .acc-item').removeClass('active');
            $('.product-details .acc-body').slideUp();

            $parent.addClass('active');
            $parent.find('.acc-body').slideDown();

        }

    });


	// Click size button
	$(document).on('click', '.size-btn', function(){

		var value = $(this).data('value');

		// Active state
		$('.size-btn').removeClass('active');
		$(this).addClass('active');

		// Update WooCommerce select
		$('select[name="attribute_pa_size"]')
			.val(value)
			.trigger('change');

	});


	// Quantity buttons
	$(document).on('click', '.quantity-wrapper .plus, .quantity-wrapper .minus', function(e) {

		e.preventDefault();

		var $btn = $(this);
		var $input = $btn.closest('.quantity-wrapper').find('.qty');

		var step = parseFloat($input.attr('step')) || 1;
		var min  = parseFloat($input.attr('min'));
		var max  = parseFloat($input.attr('max'));
		var val  = parseFloat($input.val()) || 0;

		if ($btn.hasClass('plus')) {

			var newVal = val + step;

			if (!isNaN(max) && newVal > max) {
				newVal = max;
			}

		} else {

			var newVal = val - step;

			if (!isNaN(min) && newVal < min) {
				newVal = min || 1;
			}

			if (newVal < 1) {
				newVal = 1;
			}
		}

		$input.val(newVal).trigger('change');
	});

});

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

    // Open Filter
    $(document).on('click', '#filterToggle', function () {

        $('.filter-sidebar').addClass('active');
        $('.filter-overlay').addClass('active');
        $('body').addClass('no-scroll');

    });

    // Close Filter
    $(document).on('click', '.close-filter, .filter-overlay', function () {

        $('.filter-sidebar').removeClass('active');
        $('.filter-overlay').removeClass('active');
        $('body').removeClass('no-scroll');

    });

});

/* When documents is resize */
$(window).on('resize',function(event){
    var windowInnerHeight = $(window).innerHeight();
    bannerHeight(windowInnerHeight);
});

function bannerHeight(windowInnerHeight){
    $('.banner.home-page').css('height', windowInnerHeight);
}

// All the common js goes here
function commonScripts() {}

// Main slider all functionality including video slider

function mainSlider(){
    if ( rest_of_slide.length ){
        var mainSliderArgs = {
            items: 1,
            dots: false,
            nav: false,
            autoplay: false,
            loop: false,
            animateIn: 'fadeIn',
            animateOut: 'fadeOut',
            
            onChanged: function(event){
                var $owlItem = $(event.target).find(".owl-item").eq(event.item.index);
                var $videoEl = $owlItem.find('video');

                if ($videoEl.length) {
                    $(event.target).trigger('stop.owl.autoplay');

                    // Remove src from all videos to reset
                    $("video").each(function() {
                        $(this).removeAttr("src").removeAttr("id").get(0).pause();
                    });

                    var isMobile = window.matchMedia("(max-width: 767px)").matches;
                    var videoSrc = isMobile ? $videoEl.data("link-mobile") : $videoEl.data("link");

                    if (videoSrc) {
                        $videoEl.attr("src", videoSrc);
                        var objectid = $videoEl.data("id");
                        $videoEl.attr("id", "vid-" + objectid);
                        var vid = document.getElementById("vid-" + objectid);
                        vid.play();
                        vid.addEventListener("ended", function() {
                            $(event.target).trigger('play.owl.autoplay');
                        }, { once: true });
                    } else {
                        $(event.target).trigger('play.owl.autoplay');
                    }
                }
            }
        }
        $('.main-banner').html(rest_of_slide).owlCarousel(mainSliderArgs);
    }
}

function slidrerOnlyMobile(elem, breakpoint, args) {
	
    if ($(elem)[0]) {
        var s = $(elem);
        
        if (window.innerWidth < breakpoint) {
            s.owlCarousel(args)
		} else s.addClass("off"); 
		
        $(window).resize(function (e) {
            if (window.innerWidth < breakpoint) {
                if ($(elem).hasClass("off")) {
                    s.owlCarousel(args);
                    s.removeClass("off")
                }
            } else $(elem).hasClass("off") || (s.addClass("off").trigger("destroy.owl.carousel"), s.find(".owl-stage-outer").children(":eq(0)").unwrap())
        })
    }
}

function mobileExpander() {
    var svgElePlus = '<svg width="30" height="30" aria-hidden="true"><use xmlns:xlink="//www.w3.org/1999/xlink"  xlink:href="#menu_plus"></use></svg>';
    var svgEleMinus = '<svg width="30" height="30" aria-hidden="true"><use xmlns:xlink="//www.w3.org/1999/xlink"  xlink:href="#menu_minus"></use></svg>';

    // Append .expicon for both #desktop-menu and #mobile-menu
    $('#desktop-menu li.menu-item-has-children, #mobile-menu li.menu-item-has-children').each(function () {
        $(this).find('a').first().after('<div class="expicon">' + svgElePlus + '</div>');
    });

    $('#mobile-menu li.menu-item-has-children').hover(
        function () {
            $(this).addClass('hovered');
        },
        function () {
            $(this).removeClass('hovered');
        }
    );

    $('.hasExpanded').mouseleave(function () {
        $(this).find('.expicon').first().html(svgElePlus);
        $(this).find('.sub-menu').slideUp();
    });

    if (window.matchMedia("(min-width: 1200px)").matches) {
        $("#desktop-menu li, #mobile-menu li").each(function () {
            if ($(this).hasClass('menu-item-has-children')) {
                $(this).addClass('hasExpanded');
            }
        });

        $('.hasExpanded').mouseenter(function () {
            $(this).find('.expicon').first().html(svgEleMinus);
            $(this).find('.sub-menu').addClass('active');
        });

        $('.hasExpanded').mouseleave(function () {
            $(this).find('.expicon').first().html(svgElePlus);
            $(this).find('.sub-menu').removeClass('active');
        });

    } else {
        $('.menu-item-has-children .expicon').on('click', function () {
            $(this).parent().find('.sub-menu').first().slideToggle();
            $(this).toggleClass('active');
            if ($(this).hasClass('active')) {
                $(this).html(svgEleMinus);
            } else {
                $(this).html(svgElePlus);
            }
        });
    }
}