(function ($) {
    $.fn.jun3d = function (options) {
        var settings = $.extend({
            selector: null,
            shine: false,	// 阴影
            t: 17,			// 太阳的旋转时间
            range: 12,			// 不凡学院牌子的活动幅度
            _clientH:600
        }, options);

        // ===================================以上可能是重复代码================
        var oriBoxWidth = $('.fixBox')[0].offsetWidth;
        var oriBoxHeight = $('.fixBox')[0].offsetHeight;

//            $('.container .banner').css('height', settings._clientH);
        // 获取banner背景图片来源
        var realWidth = 2000, realHeight = 770;

        // 改变原图大小
        $('.fixBox').css({width: '100%', height: settings._clientH});

        var currBoxHeight = $('.fixBox')[0].offsetHeight;
        var currBoxWidth = $('.fixBox')[0].offsetWidth;

        var rate = currBoxHeight / oriBoxHeight;
        // 全屏高度与原图的比例
        var ratet = currBoxHeight / realHeight;
        // 全屏高度下原图的宽
        var currRealWidth = realWidth * ratet;
        // 全屏高度下原图的宽与可视区域的宽的差值
        var ratew = currRealWidth / oriBoxWidth;
        var val = (currRealWidth - currBoxWidth) / 2;

        var arrW = [];
        var arrT = [];
        var arrL = [];
        for (var i = 0; i < $('.banner .swiper-slide img').length; i++) {
            arrW.push($('.banner .swiper-slide img').eq(i).css('width'));
            arrT.push($('.banner .swiper-slide img').eq(i).css('top'));
            arrL.push($('.banner .swiper-slide img').eq(i).css('left'));
        }
        ;

        arrW.forEach(function (item, index, array) {
            var newWidth = parseInt(item) * rate + 'px';
            var newTop = parseInt(arrT[index]) * rate + 'px';
            var newLeft = parseInt(arrL[index]) * ratew - val + 'px';
            var $img = $('.banner .swiper-slide img').eq(index);
            $img.css('width', newWidth);
            $img.css('top', newTop);
            if ($img.attr('data-left')) {
                $img.attr('data-left', parseInt(newLeft));
            }
            if ($img.attr('data-right') || $img.attr('data-top')) {
                if ($img.attr('data-top')) {
                    $img.css('right', parseInt($img.css('right')) * ratew - val + 'px');
                } else {
                    $img.css('right', parseInt($img.css('right')) * ratew - val + 'px');
                    $img.attr('data-right', parseInt($img.css('right')));
                }
            } else {
                $img.css('left', newLeft);
            }
        });
        var $this = $(this), l, r, t;
        initMouseEvent();
        if (settings.shine) {
            $this.append('<div class="shine"></div>');
        }
        var $shine = $this.find('.shine');
        $shine.css({
            position: "absolute",
            top: 0,
            left: 0,
            bottom: 0,
            right: 0,
            "z-index": 9
        });

        function initMouseEvent() {
            var isSafari = navigator.userAgent.indexOf("Safari") > -1 && navigator.userAgent.indexOf("Chrome") == -1; //判断是否Safari浏览器
            if(isSafari) return;
            $this.on('mousemove', function (e) {
                var w = $this[0].offsetWidth;
                var h = $this[0].offsetHeight;
                // 求原点
                var x1 = $this.offset().left + w / 2;
                var y1 = $this.offset().top + h / 2;
                /* 求鼠标距离原点的差值 */
                var x2 = x1 - e.clientX;
                var y2 = y1 - e.clientY;
                var dx = e.offsetX - w / 2;
                var dy = e.offsetY - h / 2;
                // 阴影相关值
                var theta = Math.atan2(dy, dx);
                var angle = theta * 180 / Math.PI - 90;
                if (angle < 0) {
                    angle = angle + 360;
                }
                $shine.css('background', 'linear-gradient(' + angle + 'deg, rgba(180,180,180,' + event.offsetY / h * .3 + ') 0%,rgba(255,255,255,0) 100%)');

                $this.children().each(function (index, ele) {
                    if ($(this).attr('data-reverse')) {
                        if ($(this).attr('data-left')) {
                            l = $(this).attr('data-left');
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                transform: "perspective(3000px) rotateX(" + -(y2 / h * 8) + "deg) rotateY(" + (x2 / w * 8) + "deg)",
                                webkitTransform: "perspective(3000px) rotateX(" + -(y2 / h * 8) + "deg) rotateY(" + (x2 / w * 8) + "deg)",
                                left: (l - (x2 / w * 40)) + "px"
                            });
                        } else if ($(this).attr('data-right')) {
                            r = $(this).attr('data-right');
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                transform: "perspective(3000px) rotateX(" + -(y2 / h * 8) + "deg) rotateY(" + (x2 / w * 8) + "deg)",
                                webkitTransform: "perspective(3000px) rotateX(" + -(y2 / h * 8) + "deg) rotateY(" + (x2 / w * 8) + "deg)",
                                right: (r - (x2 / w * 50)) + "px"
                            });
                        } else if ($(this).attr('data-top')) {
                            t = $(this).attr('data-top');
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                webkitTransform: "perspective(3000px) rotateX(" + -(y2 / h * 8) + "deg) rotateY(" + (x2 / w * 8) + "deg)",
                                top: (t - (y2 / h * 50)) + "px"
                            });
                        } else if ($(this).attr('data-rotate')) {
                            var name = $(this).attr('data-rotate');
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                animation: name + " " + settings.t + "s linear infinite both",
                                webkitAnimation: name + " " + settings.t + "s linear infinite both"
                            });
                        } else if ($(this).attr('data-sport')) {
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                transform: "perspective(3000px) rotateX(" + -(y2 / h * settings.range) + "deg) rotateY(" + (x2 / w * settings.range) + "deg)",
                                webkitTransform: "perspective(3000px) rotateX(" + -(y2 / h * settings.range) + "deg) rotateY(" + (x2 / w * settings.range) + "deg)"
                            });
                        }
                    } else {
                        if ($(this).attr('data-left')) {
                            l = $(this).attr('data-left');
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                transform: "perspective(3000px) rotateX(" + (y2 / h * 8) + "deg) rotateY(" + (-x2 / w * 8) + "deg)",
                                webkitTransform: "perspective(3000px) rotateX(" + (y2 / h * 8) + "deg) rotateY(" + (-x2 / w * 8) + "deg)",
                                left: (l - (x2 / w * 40)) + "px"
                            });
                        } else if ($(this).attr('data-right')) {
                            r = $(this).attr('data-right');
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                transform: "perspective(3000px) rotateX(" + (y2 / h * 8) + "deg) rotateY(" + (-x2 / w * 8) + "deg)",
                                webkitTransform: "perspective(3000px) rotateX(" + (y2 / h * 8) + "deg) rotateY(" + (-x2 / w * 8) + "deg)",
                                right: (r - (x2 / w * 50)) + "px"
                            });
                        } else if ($(this).attr('data-top')) {
                            t = $(this).attr('data-top');
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                transform: "perspective(3000px) rotateX(" + (y2 / h * 8) + "deg) rotateY(" + (-x2 / w * 8) + "deg)",
                                webkitTransform: "perspective(3000px) rotateX(" + (y2 / h * 8) + "deg) rotateY(" + (-x2 / w * 8) + "deg)",
                                top: (t - (y2 / h * 50)) + "px"
                            });
                        } else if ($(this).attr('data-rotate')) {
                            var name = $(this).attr('data-rotate');
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                animation: name + " " + settings.t + "s linear infinite both",
                                webkitAnimation: name + " " + settings.t + "s linear infinite both"
                            });
                        } else if ($(this).attr('data-sport')) {
                            $(this).css({
                                transition: '',
                                webkitTransition: '',
                                transform: "perspective(3000px) rotateX(" + (y2 / h * 3) + "deg) rotateY(" + (-x2 / w * 3) + "deg) translateZ(100px)",
                                webkitTransform: "perspective(3000px) rotateX(" + (y2 / h * 3) + "deg) rotateY(" + (-x2 / w * 3) + "deg) translateZ(100px)"
                            });
                        }
                    }
                });
            })
            $this.on('mouseleave', function (e) {
                $this.children().each(function (index, ele) {
                    if ($(this).attr('data-left')) {
                        $(this).css({
                            transition: "all .4s linear",
                            webkitTransition: "all .4s linear",
                            transform: "perspective(3000px) rotateX(0deg) rotateY(0deg)",
                            webkitTransform: "perspective(3000px) rotateX(0deg) rotateY(0deg)",
                            left: l + ";"
                        });
                    } else if ($(this).attr('data-right')) {
                        $(this).css({
                            transition: "all .4s linear",
                            webkitTransition: "all .4s linear",
                            transform: "perspective(3000px) rotateX(0deg) rotateY(0deg)",
                            webkitTransform: "perspective(3000px) rotateX(0deg) rotateY(0deg)",
                            right: r + ";"
                        });
                    } else if ($(this).attr('data-rotate')) {
                        $(this).css("animation", "");
                    } else if ($(this).attr('data-sport')) {
                        $(this).css({
                            transition: "all .4s linear",
                            webkitTransition: "all .4s linear",
                            transform: "perspective(3000px) rotateX(0deg) rotateY(0deg)",
                            webkitTransform: "perspective(3000px) rotateX(0deg) rotateY(0deg)"
                        });
                    }
                })
            });
        }

    }

})(jQuery);
