(function($) {
    var fnName = "magnifier";
    var magnifier = {
        magnifier:".magnifier",
        //最外层的大容器
        container:".magnifier-container",
        //选择当前主图的承载容器
        containerImg:".images-cover",
        //图片的容器
        view:".magnifier-view",
        //图片放大后承载容器
        width:400,
        //图片放大后承载容器宽度
        height:400,
        //图片放大后承载容器高度
        moveView:".move-view",
        //跟随鼠标移动的容器
        moveWidth:null,
        //如果设置了移动盒子的宽度，则不计算缩放比例
        zoom:4,
        //缩放比例
        thumbnail:".magnifier-line > ul",
        //缩略图容器
        assembly:".magnifier-btn",
        //按钮组
        index:0
    };
    window[fnName] = function(magnifierAttr) {
        //设置属性值
        if (typeof magnifierAttr == "object") {
            for (var n in magnifierAttr) {
                magnifier[n] = magnifierAttr[n];
            }
        }
        var _this = this;
        //绑定容器
        _this.magnifier = $(magnifier.magnifier);
        _this.container = _this.magnifier.find(magnifier.container);
        _this.view = _this.magnifier.find(magnifier.view);
        _this.moveView = _this.magnifier.find(magnifier.moveView);
        _this.thumbnail = _this.magnifier.find(magnifier.thumbnail);
        _this.assembly = _this.magnifier.find(magnifier.assembly);
        _this.containerImg = _this.magnifier.find(magnifier.containerImg);
        var imgBox = _this.containerImg;
        //設置寬高
        _this.magnifier.css({
            width:magnifier.width
        });
        _this.container.css({
            width:magnifier.width,
            height:magnifier.height
        });
        _this.view.css({
            width:magnifier.width,
            height:magnifier.height
        });
        var boxMoveViewWidth, boxMoveViewHeight;
        if (magnifier.moveWidth) {
            boxMoveViewWidth = magnifier.moveWidth;
        } else {
            boxMoveViewWidth = magnifier.width / magnifier.zoom;
        }
        boxMoveViewHeight = boxMoveViewWidth;
        _this.moveView.css({
            width:boxMoveViewWidth,
            height:boxMoveViewHeight
        });
        //计算体积碰撞的变量
        var deviationXl, deviationXr, deviationYt, deviationYb, imgWidth, imgHieght, multiple;
        _this.eqImg = function() {
            var img = new Image(), src = _this.thumbnail.find("img").eq(magnifier.index).attr("src");
            img.src = src;
            //承载容器的宽高
            containerWidth = magnifier.width;
            containerHeight = magnifier.height;
            _this.thumbnail.find(">*").removeClass("active").eq(magnifier.index).addClass("active");
            function imgLoadEnd() {
                if (img.width == 0) {
                    img.onload = imgLoadEnd;
                }
                var styleCss;
                if (img.width > img.height) {
                    imgWidth = magnifier.width;
                    imgHieght = img.height / (img.width / magnifier.width);
                    styleCss = "top:50%;margin-top:" + -imgHieght / 2 + "px";
                } else {
                    imgWidth = img.width / (img.height / magnifier.width);
                    imgHieght = magnifier.width;
                    styleCss = "left:50%;margin-left:" + -imgWidth / 2 + "px";
                }
                imgBox.empty().append('<img src="' + src + '" width="' + imgWidth + '" height="' + imgHieght + '" style="' + styleCss + '" />');
                //重新计算移动盒子与图片的倍数
                multiple = magnifier.width / boxMoveViewWidth;
                //容器加载图片
                _this.view.empty().append('<img src="' + src + '" width="' + imgWidth * multiple + '" height="' + imgHieght * multiple + '" />');
                //偏移量
                deviationXl = (magnifier.width - imgWidth) / 2;
                deviationXr = magnifier.width - deviationXl - boxMoveViewWidth + 1;
                //这里额外+1的是要计算容器的左边框
                deviationYt = (magnifier.height - imgHieght) / 2;
                deviationYb = magnifier.height - deviationYt - boxMoveViewHeight + 1;
            }
            imgLoadEnd();
        };
        //完成后执行
        _this.eqImg();
        _this.moveFn = function(e) {
            var X = e.clientX - _this.magnifier.offset().left - boxMoveViewWidth / 2, Y = e.clientY - _this.magnifier.offset().top + $(document).scrollTop() - boxMoveViewHeight / 2;
            endX = X > deviationXl ? X < deviationXr ? X :deviationXr :deviationXl;
            endY = Y > deviationYt ? Y < deviationYb ? Y :deviationYb :deviationYt;
            //当Y轴超出容器
            endY = endY > 0 ? endY > magnifier.width - boxMoveViewHeight ? magnifier.height - boxMoveViewHeight :endY :0;
            _this.moveView.css({
                left:endX,
                top:endY,
                display:"block"
            });
            positionX = (endX - (magnifier.width - imgWidth) / 2) * multiple;
            positionY = (endY - (magnifier.height - imgHieght) / 2) * multiple;
            _this.view.css({
                display:"block"
            }).find("img").css({
                "margin-left":-positionX,
                "margin-top":-positionY
            });
        };
        _this.container.on("mousemove", function(e) {
            _this.moveFn(e);
        }).on("mouseleave", function() {
            _this.moveView.hide();
            _this.view.hide();
        });
        var thumbnailImg = _this.thumbnail.find(">*"), lineLenght = thumbnailImg.length;
        _this.imgMove = function(_boole) {
            _boole ? magnifier.index++ :magnifier.index--;
            var _deviation = Math.ceil(magnifier.width / thumbnailImg.width() / 2);
            if (lineLenght < _deviation) {
                return false;
            }
            magnifier.index < 0 ? magnifier.index = 0 :magnifier.index > lineLenght - _deviation ? magnifier.index = lineLenght - _deviation :magnifier.index;
            var endLeft = thumbnailImg.width() * magnifier.index - thumbnailImg.width();
            _this.thumbnail.css({
                left:(endLeft > 0 ? -endLeft :0) + "px"
            });
        };
        //按钮组动作
        _this.assembly.find(">*").on("click", function() {
            _this.imgMove($(this).index());
        });
        thumbnailImg.on("click", function() {
            magnifier.index = $(this).index();
            //显示图片
            _this.eqImg();
            //缩略图位置移动
            _this.imgMove(magnifier.index);
        });
        _this.setIndex = function(n) {
            magnifier.index = n ? n :0;
        };
        return _this;
    };
})(jQuery);