var isAnimationPlaying = false; //动画是否正在播放中
$(function () {
    /*滚动条美化*/
    $(".auto-scroll").mCustomScrollbar({
        scrollbarPosition: 'inside',
        autoHideScrollbar: true,
        scrollInertia: 150,
        theme: 'minimal',
        callbacks: {
            whileScrolling: function () {
                if ($(this).attr('id') == 'history-scroll') {
                    historyScrollTo();
                }
                /* 品牌历史头部导航淡入淡出效果 */
                if ($(this).attr('id') == 'brand-history-scroll') {
                    var m = Math.abs(this.mcs.top);
                    var h = $(this).find('.banner').height() - 10;
                    if (m > h) {
                        $('.timeline-header').fadeIn();
                    } else {
                        $('.timeline-header').fadeOut();
                    }
                    historyScrollTo();
                }
                /* 日慈滚动到底部触发动画 */
                if ($(this).attr('id') == 'csr-scroll') {
                    if (isAnimationPlaying) {
                        return false;
                    }
                    var nScrollHight = this.mcs.content[0].scrollHeight; //滚动距离总长(注意不是滚动条的长度)
                    var nScrollTop = Math.abs(this.mcs.top);  //滚动到的当前位置
                    var nDivHight = $(this).height();
                    if (nScrollTop + nDivHight >= nScrollHight) {
                        isAnimationPlaying = true;
                        $('.amount').each(function (index) {
                            var number = 0;
                            if (index == 0) {
                                number = 26;
                            } else if (index == 1) {
                                number = 400;
                            } else if (index == 2) {
                                number = 32000;
                            } else if (index == 3) {
                                number = 100000;
                            } else if (index == 4) {
                                number = 320000;
                            }
                            var elementWidth = $(this).width();
                            if (index > 0) {
                                $(this).parent().width(elementWidth);
                            }
                            $('.data-block ul').fadeIn(1000);
                            var number_counter = new CountUp(this, 0, number, 0, 2, { useGrouping: false });
                            var _this = $(this);
                            setTimeout(function () {
                                !number_counter.error && number_counter.start(function () {
                                    if (index > 0) {
                                        var realText = number + '+';
                                        _this.text(realText);
                                    }
                                    isAnimationPlaying = false;
                                });
                            }, 1000);
                        });
                    } else {
                        $('.data-block ul').fadeOut(1000);
                    }
                }
            }
        }
    });
    /*头部导航菜单*/
    var nav = {};
    $('.nav-level-1 > dd').hover(function () {
        var _nav = $(this).index();
        clearTimeout(nav['timer' + _nav]);
        var _this = $(this);
        nav['timer' + _nav] = setTimeout(function () {
            _this.find('.nav-level-2').stop(true, true).fadeIn(200);
        }, 150);
    }, function () {
        var _nav = $(this).index();
        clearTimeout(nav['timer' + _nav]);
        var _this = $(this);
        nav['timer' + _nav] = setTimeout(function () {
            _this.find('.nav-level-2').stop(true, true).fadeOut(200);
        }, 150);
    });
    /*导航hover显示菜单*/
    $(".nav-level-2 dd > a").hover(function () {
        $(this).closest('dl').find('.nav-level-3').hide();
        $(this).next().show();
    });
    /*nav子菜单宽度用于对齐*/
    $('.nav-level-box-2').css('width', ($(".nav-level-1").width() - 30) + 'px');

    /*微信二维码显示关闭*/
    $(".wechat-qrcode-close").on('click', function () {
        $('.wechat-qrcode-block').fadeOut();
        return false;
    });
    $(".qrcode").on('click', function () {
        var img = $(this).children('img').attr('src');
        if (!img) {
            return false;
        }
        $('.wechat-qrcode-block .wechat-qrcode img').attr('src', img);
        var title = $(this).data('title');
        title = title ? title : '手机微信扫码，关注公众号';
        $('.wechat-qrcode-block p').text(title);
        $('.wechat-qrcode-block').fadeIn();
        return false;
    });

    $(".share-icon").hover(function () {
        $(this).removeClass('close-share').addClass('open-share');
    }, function () {
        $(this).removeClass('open-share').addClass('close-share');
    });

    /*搜索点击*/
    $('.header.default .header-right .search').on('click', function () {
        $(this).parent().addClass('header-hide');
        $(this).parent().prev().children('.nav-level-1').removeClass('header-show').addClass('header-hide');
        $(this).parent().prev().children('.header-search').removeClass('header-hide').addClass('header-show');
    });
    $('.header.default .header-search .close').on('click', function () {
        $(this).closest('.header-search').removeClass('header-show').addClass('header-hide');
        $(this).closest('.header-search').prev().removeClass('header-hide').addClass('header-show');
        $(this).closest('.nav').next().removeClass('header-hide').addClass('header-show');
    });
    $('.header.black .header-right .search').on('click', function () {
        $(this).parent().removeClass('header-show').addClass('header-hide');
        $(this).parent().prev().children('.nav-level-1').children('dd').removeClass('.header-show').addClass('header-hide');
        $(this).parent().prev().children('.header-search').removeClass('header-hide').addClass('header-show');
    });
    $('.header.black .header-search .close').on('click', function () {
        $(this).closest('.header-search').removeClass('header-show').addClass('header-hide');
        $(this).closest('.header-search').prev().children('dd').removeClass('header-hide').addClass('header-show');
        $(this).closest('.nav').next().removeClass('header-hide').addClass('header-show');
    });
    $('.header-search-input').on('keyup', function (event) {
        if (event.keyCode == "13") {
            window.location.href = headerSearchUrl + '?keyword=' + $(this).val();
        }
    });


    /* 历史头部导航定位 */
    function historyScrollTo() {
        var menu = $(".timeline-header");
        var items = $(".content").find(".item");
        var top = $(document).scrollTop();
        var currentId = "";
        items.each(function () {
            var m = $(this);
            var itemTop = m.offset().top;
            if (itemTop == 0) {
                return false;
            }
            if (top > itemTop - 100) {
                currentId = m.attr("id").replace("item", "");
            } else {
                return false;
            }
        });
        var currentLink = menu.find(".selected");
        if (currentId && currentLink.index() + 1 != currentId) {
            currentLink.removeClass("selected");
            menu.find('li:eq(' + (currentId - 1) + ')').addClass("selected");
        }
    }

    /* 字长截取 */
    function cutString(str, len) {
        var str_length = 0;
        var str_len = 0;
        str_cut = new String();
        str_len = str.length;
        for (var i = 0; i < str_len; i++) {
            a = str.charAt(i);
            str_length++;
            if (escape(a).length > 4) {
                //中文字符的长度经编码之后大于4
                str_length++;
            }
            str_cut = str_cut.concat(a);
            if (str_length >= len) {
                str_cut = str_cut.concat("...");
                return str_cut;
            }
        }
        //如果给定字符串小于指定长度，则返回源字符串；
        if (str_length < len) {
            return str;
        }
    }

    $(".show-content p").each(function () {
        var pStr = $(this).text();
        $(this).text(cutString(pStr, 246));
    });
    /* 小标题有无 */
    $(".show h3").each(function () {
        var pStr = $(this).text();
        if (pStr == '') {
            $(this).remove();
        }
    });

    /* SLIDER组件 BEGIN */
    (function ($) {
        $('.brand-carousel').on('click', '.show-slider', function () {
            $.ajax({
                type: "GET",
                url: collectionUrl + "?id=" + $(this).data('id'),
                dataType: "json",
                success: function (data) {
                    if (data) {
                        if ((data['collection_type'] == 1 && data['images'].length == 0) || (data['collection_type'] == 3 && data['images'].length == 0) || (data['collection_type'] == 2 && data['collection_video_url'] == '')) {
                            return false;
                        }
                        if (data['on_slide_show'] == 1) {
                            $('.article-header h2').html((data['brand']['brand_name'] + ' | ' + data['collection_date'] + data['collection_name']) || '&nbsp;');
                            $('.article-aside h3').html(data['collection_sub_name'] || '&nbsp;');
                            $('.article-section').html(data['collection_description'] || '&nbsp;');
                        } else {
                            $(".entry-container").hide();
                        }
                        $(".imgs-slider").css('display', 'block');
                        if (data['collection_type'] == 1 || data['collection_type'] == 3) {
                            initSlider(data);
                        } else {
                            initVideo(data);
                        }
                    }
                }
            });
        });

        $('.slider-content').on('afterChange', function (event, slick, currentSlide) {
            $('.series-description strong').text(currentSlide + 1);
        });

        function initSlider(data) {
            $(".slider-player").show();
            $('.show-video').hide();
            var html = "";
            for (var i = 0; i < data['images'].length; i++) {
                html += '<div class="img-container"><img src="' + data['images'][i]['image_url'] + '"></div>';
            }
            $(".slider-content").html(html);
            var sliderObj = $('.slider-content').slick({
                arrows: true,
                prevArrow: $('#slick-prev'),
                nextArrow: $('#slick-next'),
            }).slick('getSlick');
            var htmlStr = '<strong>1</strong>/' + sliderObj.slideCount;
            $('.series-description span').html(htmlStr);
            $('.series-description p').html((data['collection_title']) || '&nbsp;');
            if (data['brand_logo'] == '' && data['brand_name'] == '至美') {
                $('.series-description h3').html('至美');
            }
            $('.series-description').css("background-image", "url(" + data['brand_logo'] + ")");
        }

        var showVideo;

        function initVideo(data) {
            $(".slider-player").hide();
            $('.show-video').show();
            $('#show-video')[0].src = data['collection_video_url'];
            if (!showVideo) {
                showVideo = new Plyr('#show-video', {
                    iconUrl: '/images/icons/plyr.svg',
                    controls: ['play', 'progress', 'current-time', 'mute', 'volume', 'duration'],
                    fullscreen: { enabled: false, fallback: false, iosNative: false },
                });
            }
        }

        function reInit(element) {
            $('.slider-content').hasClass('slick-initialized') && $('.slider-content').slick('unslick');
            $(element).closest(".imgs-slider").css('display', 'none');
            $(element).siblings('.entry-container').show();
        }

        $('.entry .article-nav').click(function () {
            $(this).closest('.entry-container').hide();
            if ($('#show-video').is(':visible') && showVideo) {
                showVideo.play();
            }
        });

        $('.slider-close').click(function () {
            reInit(this);
            if (showVideo) {
                showVideo.stop();
            }
        });
    })(jQuery);

    /* SLIDER组件 END */
    var rootSliderFlag = null;

    function rootSlickGo(step) {
        var rootSlick = $('.carousel');
        var slideCount = rootSlick.slick('getSlick').slideCount;
        var currentSlide = rootSlick.slick('slickCurrentSlide');
        var goIndex = currentSlide + step;
        if (goIndex < 0 || goIndex > slideCount - 1) {
            return false;
        }

        function goToIndex(index) {
            rootSlick.slick('slickGoTo', index);
        }

        goToIndex(goIndex);
    }

    //鼠标滚轮滑动切换屏幕
    $(".carousel").on('mousewheel DOMMouseScroll', (function (event) {
        if (isAnimationPlaying) {
            return false;
        }
        if (event.deltaY < 0) {
            //往下滑
            if (rootSliderFlag != null) {
                clearTimeout(rootSliderFlag);
            }
            rootSliderFlag = setTimeout(function () {
                rootSlickGo(1);
            }, 200);
        } else if (event.deltaY > 0) {
            if (rootSliderFlag != null) {
                clearTimeout(rootSliderFlag);
            }
            rootSliderFlag = setTimeout(function () {
                rootSlickGo(-1);
            }, 200);
        }
    }));

    $(".carousel").on('beforeChange', (function (event, slick, currentSlide, nextSlide) {
        if(slick!=$(".carousel").slick('getSlick')){
            return false;
        }
        $('.carousel .slick-list .slick-slide').eq(nextSlide).find(".auto-scroll").mCustomScrollbar("scrollTo", "top", {
            timeout: 0
        });
    }));

    /* 声音控制 */
    $('.volume-control-container').hover(function () {
        $('.share-icon').hide();
        $('.homepage-login').hide();
    }, function () {
        $('.share-icon').show();
        $('.homepage-login').show();
    });
    $('.volume-icon').click(function () {
        var video = document.getElementById('video');
        video.muted = !video.muted;
        if (!video.muted) {
            video.volume = 0.5;
            $('.volume-icon').addClass('volume-on');
        } else {
            video.volume = 0;
            $('.volume-icon').removeClass('volume-on');
        }
        $('.volume-value').text(video.volume*100);
        $('input[type="range"]').val($('.volume-value').text()).change();
    });
});