jQuery(document).ready(function($) {
    // handle preloader
    setTimeout(function() {
        $('body .blogcast_loading_box').hide();
    }, 3000);

    // header - live search
    var subscribeSection = $('.subscribe-section')
    if( subscribeSection.length > 0 ) {
        subscribeSection.on( 'click', '.search-trigger', function(){
            var _this = $(this)
            _this.siblings().show()
            _this.parent().addClass('toggled')
            _this.siblings().find('.search-field').focus()
        })

        // close search popup
        var closeButton = subscribeSection.find('.search-form-wrap')
        if( closeButton.length > 0 ) {
            closeButton.on('click', '.search-form-close', function(){
                var _thisButton = $(this), parentElement = _thisButton.parents('.search-wrap')
                parentElement.removeClass('toggled')
                _thisButton.parent().hide()
            })
        }

        // on ESC button click
        $(document).on('keydown', function( event ){
            if( event.keyCode == 27 ) {
                closeButton.hide()
                closeButton.parent().removeClass('toggled')
            }
        })
    }
    
    // header - theme mode
    var themeModeContainer = $('.mode-toggle-wrap')
    if( themeModeContainer.length > 0 ) {
        themeModeContainer.on( 'click', '.mode-toggle', function(){
            var _this = $(this), bodyElement = _this.parents('body')
            if( bodyElement.hasClass('blogcast-dark-mode') ) {
                $.cookie( 'themeMode', 'light', { path: '/' } )
                bodyElement.removeClass('blogcast-dark-mode').addClass('blogcast-light-mode')
            } else {
                $.cookie( 'themeMode', 'dark', { path: '/' } )
                bodyElement.removeClass('blogcast-light-mode').addClass('blogcast-dark-mode')
            }
        })
    }

    // header - canvas menu
    var canvasMenuContainer = $('.blogcast-canvas-menu')
    if( canvasMenuContainer.length > 0 ) {
        canvasMenuContainer.on( 'click', '.canvas-menu-icon', function() {
            var _this = $(this), bodyElement = _this.parents('body')
            bodyElement.toggleClass('blogcast-model-open');
            onElementOutsideClick( _this.siblings(), function(){
                bodyElement.removeClass( 'blogcast-model-open' )
            })
        })
    }

    // on element outside click function
    function onElementOutsideClick( currentElement, callback ) {
        $(document).mouseup(function( e ) {
            var container = $(currentElement);
            if ( !container.is(e.target) && container.has(e.target).length === 0) callback();
        })
    }

    // full-width banner
    var fullWidthBannerContainer = $('.blogcast-main-banner-section')
    if( fullWidthBannerContainer.length > 0 ) {
        var mainBannerWrapper = fullWidthBannerContainer.find('.main-banner-wrap')
        var prevIcon = ( blogcastObject.prevIcon.type == 'icon' ) ? '<i class="'+ blogcastObject.prevIcon.value +'"></i>' : '<img src="'+ blogcastObject.prevIcon.url +'">'
        var nextIcon = ( blogcastObject.nextIcon.type == 'icon' ) ? '<i class="'+ blogcastObject.nextIcon.value +'"></i>' : '<img src="'+ blogcastObject.nextIcon.url +'">'
        mainBannerWrapper.slick({
            arrows: true,
            fade: (blogcastObject.fade == 1),
            infinite: false,
            autoplay: true,
            centerMode: (blogcastObject.centerMode == 1),
            centerPadding: '80px',
            autoplaySpeed: parseInt( blogcastObject.autoplaySpeed ),
            speed: parseInt( blogcastObject.speed ),
            prevArrow: '<button type="button" class="slick-prev">' + prevIcon + '</button>',
            nextArrow: '<button type="button" class="slick-next">' + nextIcon + '</button>',
            responsive: [
              {
                breakpoint: 800,
                settings: {
                  centerMode: false,
                  centerPadding: '0px'
                },
              }
            ]

        })
    }

    // carousel
    var carouselContainer = $('.blogcast-carousel-section')
    if( carouselContainer.length > 0 ) {
        var carouselWrapper = carouselContainer.find('.carousel-wrap')
        var prevIcon = ( blogcastObject.carouselPrevIcon.type == 'icon' ) ? '<i class="'+ blogcastObject.carouselPrevIcon.value +'"></i>' : '<img src="'+ blogcastObject.carouselPrevIcon.url +'">'
        var nextIcon = ( blogcastObject.carouselNextIcon.type == 'icon' ) ? '<i class="'+ blogcastObject.carouselNextIcon.value +'"></i>' : '<img src="'+ blogcastObject.carouselNextIcon.url +'">'
        carouselWrapper.slick({
            arrows: true,
            fade: false,
            infinite: false,
            autoplay: true,
            autoplaySpeed: 2000,
            slidesToShow: parseInt( blogcastObject.carouselSlideToShow ),
            slidesToScroll: parseInt( blogcastObject.slidesToScroll ),
            speed: 3000,
            prevArrow: '<button type="button" class="slick-prev">'+ prevIcon +'</button>',
            nextArrow: '<button type="button" class="slick-next">'+ nextIcon +'</button>',
            responsive: [
              {
                breakpoint: 1100,
                settings: {
                  slidesToShow: 3,
                },
              },
              {
                breakpoint: 940,
                settings: {
                  slidesToShow: 2,
                },
              },
              {
                breakpoint: 700,
                settings: {
                  slidesToShow: 1,
                },
              }
            ]
        
        })
    }

    // scripts for archive pages
    if( blogcastObject.isArchive ) {
        // archive masonry layout 
        var masonryContainer = $("body.archive--masonry-layout #primary .blogcast-inner-content-wrap")
        masonryContainer.masonry({
            // options
            itemSelector: 'article.post, .blogcast-advertisement-block',
            gutter: 30
        })

        // handle the post gallery post format
        var postGalleryElems = $("body #primary article.format-gallery .post-thumbnail-wrapper .thumbnail-gallery-slider")
        if( postGalleryElems.length > 0 ) {
            postGalleryElems.each(function() {
                var thisGallery = $(this)
                thisGallery.slick({
                    arrows: true,
                    fade: true,
                    infinite: true,
                    autoplay: false,
                    prevArrow: '<button type="button" class="slick-prev"><i class="fa-solid fa-arrow-left-long"></i></button>',
                    nextArrow: '<button type="button" class="slick-next"><i class="fa-solid fa-arrow-right-long"></i></button>'
                })
            })
        }
    }

    // back to top script
    if( $( "#blogcast-scroll-to-top" ).length ) {
        var scrollContainer = $( "#blogcast-scroll-to-top" );
        $(window).scroll(function() {
            if ( $(this).scrollTop() > 800 ) {
                scrollContainer.addClass('show');
            } else {
                scrollContainer.removeClass('show');
            }
        });
        scrollContainer.click(function(event) {
            event.preventDefault();
            // Animate the scrolling motion.
            $("html, body").animate({scrollTop:0},"slow");
        });
    }

    // post format - gallery
    var gallery = $('.wp-block-gallery')
    if( gallery.length > 0 ) {
        if( blogcastObject.singleGalleryLightbox != 1 ) return
        gallery.each(function(){
            var _this = $(this)
            var findImageSrc = _this.find('.wp-block-image img')
            var srcArgs = []
            findImageSrc.each(function(){
                srcArgs.push({
                    src: $(this).attr('src'),
                    type: 'image'
                })
            })
            _this.magnificPopup({
                items: srcArgs,
                gallery: {
                    enabled: true
                },
                type: 'image'
            })
        })
    }

    // main header sticky
    if( blogcastObject.headerSticky ) {
        $(window).on('scroll', function(){
            var scroll = $(window).scrollTop()
            var mainHeaderContainer = $('.main-header')
            if( scroll >= 200 ) {
                mainHeaderContainer.addClass('header-sticky--enabled').removeClass('header-sticky--disabled')
            } else {
                mainHeaderContainer.addClass('header-sticky--disabled').removeClass('header-sticky--enabled')
            }
        })
    }
})