/* global Modernizr, WOW, console */
var PxlrthemeCache = {
    $window: jQuery(window),
    $head: jQuery('#masthead'),
    $body: jQuery('body')
};


var $cs_body, $cs_main, $cs_masthead, $cs_window, $cs_document,
    cs_is_device, cs_is_sticky, cs_is_transparent, cs_is_small, cs_has_admin_bar,
    cs_is_blank, cs_no_mobile_anim, cs_sticky_height, cs_admin_bar_height, cs_header_height, cs_header_top;

var Roxtheme = (function ($) {

    return {

        initFormPlaceHolder: function () {
            if (!('placeholder' in document.createElement('input'))) {
                $('input[placeholder], textarea[placeholder]').each(function () {
                    var val = $(this).attr('placeholder');
                    if (this.value === '') {
                        this.value = val;
                    }
                    $(this).focus(function () {
                        if (this.value === val) {
                            this.value = '';
                        }
                    }).blur(function () {
                        if ($.trim(this.value) === '') {
                            this.value = val;
                        }
                    });
                });

                // Clear default placeholder values on form submit
                $('form').submit(function () {
                    $(this).find('input[placeholder], textarea[placeholder]').each(function () {
                        if (this.value === $(this).attr('placeholder')) {
                            this.value = '';
                        }
                    });
                });
            }
        },

        initTooltip: function () {
            $('a[data-toggle=tooltip]').tooltip();
        },

        showBackToTop: function () {
            var offset = 300,
                //browser window scroll (in pixels) after which the 'back to top' link opacity is reduced
                offset_opacity = 1200,
                //grab the 'back to top' link
                $back_to_top = $('.cd-top'),
                $window = $(window);

            if ($window.scrollTop() > offset) {
                $back_to_top.addClass('cd-is-visible');
                PxlrthemeCache.$body.addClass('scrolled');
            } else {
                $back_to_top.removeClass('cd-is-visible cd-fade-out');
            }

            if ($window.scrollTop() > offset_opacity) {
                $back_to_top.addClass('cd-fade-out');
            }
        },

        initBackToTop: function () {
            //smooth scroll to top
            $('.cd-top').on('click', function (event) {
                event.preventDefault();
                $('body,html').animate({
                    scrollTop: 0,
                }, 700);
            });
        },

        initTransparentHeader: function () {
            if (PxlrthemeCache.$body.hasClass('transparent-header')) {
                return;
            }
            var ht = $('#masthead').height(),
                firstRow = $('.transparent-header .page-builder .roxtheme-row:first-of-type .container:first-of-type, .transparent-header .page-builder .roxtheme-row:first-of-type .container-fluid:first-of-type');
            firstRow.css('padding-top', ht + 20);
        },


        initMobileMenu: function () {

            $('#rox-mobile-icon').on('click', function (e) {

                e.preventDefault();
                $(this).toggleClass('cs-collapse');
                $('#navigation-mobile').slideToggle(500, 'easeInOutExpo');

            });

            $('#navigation-mobile li:has(ul) > .rox-dropdown-plus').on('click', function (e) {

                e.preventDefault();

                $(this).toggleClass('cs-times');
                $(this).parent().find('> ul').slideToggle(500, 'easeInOutExpo');

            });

            $('#navigation-mobile li:has(ul) > a').on('click', function (e) {

                if ($(this).attr('href') === '#') {

                    e.preventDefault();

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

                    $parent.find('> .rox-dropdown-plus').toggleClass('cs-times');
                    $parent.find('> ul').slideToggle(500, 'easeInOutExpo');

                }

            });

        },

        staticVariables: function () {

            $roxtheme_body = $('body');
            $roxtheme_masthead = $('#masthead');
            $roxtheme_main = $('#main');
            $roxtheme_window = $(window);
            $roxtheme_document = $(document);
            roxtheme_is_device = (navigator.userAgent.toLowerCase().match(/(android|webos|blackberry|ipod|iphone|ipad|opera mini|iemobile|windows phone|windows mobile)/)) ? true : false;
            roxtheme_is_sticky = (parseInt(roxtheme_ajax.sticky)) ? true : false;
            roxtheme_has_admin_bar = ($roxtheme_body.hasClass('admin-bar')) ? true : false;
            roxtheme_sticky_height = (parseInt(roxtheme_ajax.header)) ? parseInt(roxtheme_ajax.header) : 50;
            roxtheme_admin_bar_height = (roxtheme_has_admin_bar) ? 32 : 0;
            roxtheme_header_height = ($roxtheme_masthead) ? $roxtheme_masthead.outerHeight() : 0;
            roxtheme_header_top = ($roxtheme_masthead && $roxtheme_masthead.offset()) ? $roxtheme_masthead.offset().top : 0;

        },

        dynamicVariables: function () {
            roxtheme_is_small = (window.innerWidth < parseInt(roxtheme_ajax.viewport)) ? true : false;
        },

        initStickyHeader: function () {

            if (roxtheme_is_sticky && !roxtheme_is_device) {

                var _header_top = (roxtheme_has_admin_bar) ? parseInt(roxtheme_header_top - roxtheme_admin_bar_height) : roxtheme_header_top,
                    _header_height,
                    _scroll_top;

                $roxtheme_window.scroll(function () {

                    if (!roxtheme_is_small) {

                        _header_height = roxtheme_header_height;
                        _scroll_top = $(this).scrollTop();

                        if (_scroll_top > _header_top) {
                            $roxtheme_masthead.trigger('close-modals').addClass('is-sticky');
                            $roxtheme_main.css('padding-top', _header_height);
                        } else {
                            $roxtheme_masthead.removeClass('is-sticky');
                            $roxtheme_main.removeAttr('style');
                        }

                        if (_scroll_top > (_header_height + _header_top)) {
                            $roxtheme_masthead.addClass('is-compact');
                        } else {
                            $roxtheme_masthead.removeClass('is-compact');
                        }

                    }

                });

            }

        },

        initFixSticky: function () {

            if (roxtheme_is_sticky && roxtheme_is_small) {

                $roxtheme_masthead.removeClass('is-sticky is-compact');
                $roxtheme_main.removeAttr('style');

                if (roxtheme_is_transparent) {
                    $roxtheme_body.addClass('is-transparent cs-is-small');
                    $roxtheme_window.scroll();
                }

            } else {

                $roxtheme_body.removeClass('cs-is-small');

            }

        },


        initContentProduct: function () {
            $(document).ready(function () {

                $(".largeGrid").click(function () {
                    $(this).find('a').addClass('active');
                    $('.smallGrid a').removeClass('active');

                    $('.product-item').addClass('large').each(function () {
                    });
                    setTimeout(function () {
                        $('.info-large').show();
                    }, 200);
                    setTimeout(function () {

                        $('.view_gallery').trigger("click");
                    }, 400);

                    return false;
                });

                $(".smallGrid").click(function () {
                    $(this).find('a').addClass('active');
                    $('.largeGrid a').removeClass('active');

                    $('div.product-item').removeClass('large');
                    $(".make3D").removeClass('animate');
                    $('.info-large').fadeOut("fast");
                    setTimeout(function () {
                        $('div.flip-back').trigger("click");
                    }, 400);
                    return false;
                });

                $(".smallGrid").click(function () {
                    $('.product-item').removeClass('large');
                    return false;
                });

                $('.colors-large a').click(function () {
                    return false;
                });


                $('.product-item').each(function (i, el) {

                    // Flip card to the back side
                    $(el).find('.view_gallery').click(function () {

                        $(el).find('div.carouselNext, div.carouselPrev').removeClass('visible');
                        $(el).find('.make3D').addClass('flip-10');
                        setTimeout(function () {
                            $(el).find('.make3D').removeClass('flip-10').addClass('flip90').find('div.shadow').show().fadeTo(80, 1, function () {
                                $(el).find('.product-front, .product-front div.shadow').hide();
                            });
                        }, 50);

                        setTimeout(function () {
                            $(el).find('.make3D').removeClass('flip90').addClass('flip190');
                            $(el).find('.product-back').show().find('div.shadow').show().fadeTo(90, 0);
                            setTimeout(function () {
                                $(el).find('.make3D').removeClass('flip190').addClass('flip180').find('div.shadow').hide();
                                setTimeout(function () {
                                    $(el).find('.make3D').css('transition', '100ms ease-out');
                                    $(el).find('.cx, .cy').addClass('s1');
                                    setTimeout(function () {
                                        $(el).find('.cx, .cy').addClass('s2');
                                    }, 100);
                                    setTimeout(function () {
                                        $(el).find('.cx, .cy').addClass('s3');
                                    }, 200);
                                    $(el).find('div.carouselNext, div.carouselPrev').addClass('visible');
                                }, 100);
                            }, 100);
                        }, 150);
                    });

                    // Flip card back to the front side
                    $(el).find('.flip-back').click(function () {

                        $(el).find('.make3D').removeClass('flip180').addClass('flip190');
                        setTimeout(function () {
                            $(el).find('.make3D').removeClass('flip190').addClass('flip90');

                            $(el).find('.product-back div.shadow').css('opacity', 0).fadeTo(100, 1, function () {
                                $(el).find('.product-back, .product-back div.shadow').hide();
                                $(el).find('.product-front, .product-front div.shadow').show();
                            });
                        }, 50);

                        setTimeout(function () {
                            $(el).find('.make3D').removeClass('flip90').addClass('flip-10');
                            $(el).find('.product-front div.shadow').show().fadeTo(100, 0);
                            setTimeout(function () {
                                $(el).find('.product-front div.shadow').hide();
                                $(el).find('.make3D').removeClass('flip-10').css('transition', '100ms ease-out');
                                $(el).find('.cx, .cy').removeClass('s1 s2 s3');
                            }, 100);
                        }, 150);

                    });

                    makeCarousel(el);
                });

                /* ----  Image Gallery Carousel   ---- */
                function makeCarousel(el) {
                    var carousel = $(el).find('.carousel ul');
                    var productdiv = $('.product-item');
                    var carouselSlideWidth = productdiv.outerWidth();
                    var carouselWidth = 0;
                    var isAnimating = false;
                    var currSlide = 0;
                    $(carousel).attr('rel', currSlide);

                    // building the width of the casousel
                    $(carousel).find('li').each(function () {
                        carouselWidth += carouselSlideWidth;
                    });
                    $(carousel).css('width', carouselWidth);

                    $('.carousel li').css('width', carouselSlideWidth);
                    $('.carousel').css('width', carouselSlideWidth);
                    $('.arrows-perspective').css('width', carouselSlideWidth);

                    // Load Next Image
                    $(el).find('div.carouselNext').on('click', function () {
                        var currentLeft = Math.abs(parseInt($(carousel).css("left")));
                        var newLeft = currentLeft + carouselSlideWidth;
                        if (newLeft == carouselWidth || isAnimating === true) {
                            return;
                        }
                        $(carousel).css({
                            'left': "-" + newLeft + "px",
                            "transition": "300ms ease-out"
                        });
                        isAnimating = true;
                        currSlide++;
                        $(carousel).attr('rel', currSlide);
                        setTimeout(function () {
                            isAnimating = false;
                        }, 300);
                    });

                    // Load Previous Image
                    $(el).find('div.carouselPrev').on('click', function () {
                        var currentLeft = Math.abs(parseInt($(carousel).css("left")));
                        var newLeft = currentLeft - carouselSlideWidth;
                        if (newLeft < 0 || isAnimating === true) {
                            return;
                        }
                        $(carousel).css({
                            'left': "-" + newLeft + "px",
                            "transition": "300ms ease-out"
                        });
                        isAnimating = true;
                        currSlide--;
                        $(carousel).attr('rel', currSlide);
                        setTimeout(function () {
                            isAnimating = false;
                        }, 300);
                    });
                }

                $('.sizes a span, .categories a span').each(function (i, el) {
                    $(el).append('<span class="x"></span><span class="y"></span>');

                    $(el).parent().on('click', function () {
                        if ($(this).hasClass('checked')) {
                            $(el).find('.y').removeClass('animate');
                            setTimeout(function () {
                                $(el).find('.x').removeClass('animate');
                            }, 50);
                            $(this).removeClass('checked');
                            return false;
                        }

                        $(el).find('.x').addClass('animate');
                        setTimeout(function () {
                            $(el).find('.y').addClass('animate');
                        }, 100);
                        $(this).addClass('checked');
                        return false;
                    });
                });

                //$("body").append('<div class="floating-cart"></div>');

                $('.add_to_cart').click(function () {
                    var productCard = $(this).parent();
                    var position = productCard.offset();
                    var productImage = $(productCard).find('img').get(0).src;
                    var productName = $(productCard).find('.product_name').get(0).innerHTML;

                    $("body").append('<div class="floating-cart"></div>');
                    var cart = $('div.floating-cart');
                    productCard.clone().appendTo(cart);
                    $(cart).css({
                        'top': position.top + 'px',
                        "left": position.left + 'px'
                    }).fadeIn("slow").addClass('moveToCart');
                    setTimeout(function () {
                        $("body").addClass("MakeFloatingCart");
                    }, 800);
                    // setTimeout(function(){
                    //     $('div.floating-cart').remove();
                    //     $("body").removeClass("MakeFloatingCart");
                    //
                    //
                    //     var cartItem = "<div class='cart-item'><div class='img-wrap'><img src='"+productImage+"' alt='' /></div><span>"+productName+"</span><strong>$39</strong><div class='cart-item-border'></div><div class='delete-item'></div></div>";
                    //
                    //     $("#cart .empty").hide();
                    //     $("#cart").append(cartItem);
                    //     $("#checkout").fadeIn(500);
                    //
                    //     $("#cart .cart-item").last()
                    //         .addClass("flash")
                    //         .find(".delete-item").click(function(){
                    //         $(this).parent().fadeOut(300, function(){
                    //             $(this).remove();
                    //             if($("#cart .cart-item").size() == 0){
                    //                 $("#cart .empty").fadeIn(500);
                    //                 $("#checkout").fadeOut(500);
                    //             }
                    //         })
                    //     });
                    //     setTimeout(function(){
                    //         $("#cart .cart-item").last().removeClass("flash");
                    //     }, 10 );
                    //
                    // }, 1000);
                });
            });
        },

        init: function () {
            Roxtheme.initTransparentHeader();
            Roxtheme.initTooltip();
            Roxtheme.initBackToTop();
            Roxtheme.initFormPlaceHolder();
            Roxtheme.initMobileMenu();
            Roxtheme.staticVariables();
            Roxtheme.dynamicVariables();
            Roxtheme.initStickyHeader();
            Roxtheme.initTransparentHeader();
            Roxtheme.initFixSticky();
            Roxtheme.initContentProduct();
        }
    };

}(jQuery));

PxlrthemeCache.$window.resize(Roxtheme.initTransparentHeader);

jQuery(window).scroll(function () {
    Roxtheme.showBackToTop();
});

jQuery(document).ready(function () {
    Roxtheme.init();
    const player = new Plyr('#player');
});


jQuery(document).ready(function ($) {
    var $container = $('.grid-container');
    $('.lazy').lazy({
        effect: "fadeIn",
        effectTime: 2000,
        threshold: 0,
        afterLoad: function(element) {
            if ($container.length > 0) {
                $container.imagesLoaded(function () {
                    $container.masonry({
                        itemSelector: '.post-grid-wrap',
                        percentPosition: true,
                        fitWidth: true,
                    });
                });
            }
        },

    });
});