/*
* @require popImage.css
* */
define(function () {
    return function (target) {

        var Pop = new SQ.Class();
        Pop.include({
            isIE6: function () {
                var ieMode = document.documentMode;
                var isIE = !!window.ActiveXObject;
                var isIE6 = isIE && !window.XMLHttpRequest;
                var isIE7 = isIE && !isIE6 && !ieMode || ieMode == 7;
                var isIE8 = isIE && ieMode == 8;
                var isIE9 = isIE && ieMode == 9;
                return isIE6;
            },

            isIE78: function () {
                var ieMode = document.documentMode;
                var isIE = !!window.ActiveXObject;
                var isIE6 = isIE && !window.XMLHttpRequest;
                var isIE7 = isIE && !isIE6 && !ieMode || ieMode == 7;
                var isIE8 = isIE && ieMode == 8;
                var isIE9 = isIE && ieMode == 9;
                return isIE7 || isIE8;
            },

            isIE678: function () {
                var ieMode = document.documentMode;
                var isIE = !!window.ActiveXObject;
                var isIE6 = isIE && !window.XMLHttpRequest;
                var isIE7 = isIE && !isIE6 && !ieMode || ieMode == 7;
                var isIE8 = isIE && ieMode == 8;
                var isIE9 = isIE && ieMode == 9;
                return isIE6 || isIE7 || isIE8;
            },
            init: function () {
                var that = this;
                var containerWidth = $(document).width();
                var containerHeight = $(document).height();
                var cursorOnPop = false;
                var cursorOnGceil = false;
                var adjusted_change = false;
                var adjusted = false;
                var isLoading = false;
                var cursorOffset = {x: 0, y: 0};
                var prevImage;
                var gceilArea = {
                    startX: 0,
                    startY: 0,
                    endX: 48,
                    endY: 48
                };
                var originTarget = null

                function getImgNaturalDimensions(img, callback) {
                    isLoading = true;
                    var nWidth, nHeight;
                    if (that.isIE6()) { // IE6/7/8
                        var image = new Image();
                        image.src = img.src;
                        image.onload = function () {
                            callback(image.width, image.height);
                        }
                    } else if (that.isIE78()) {
                        var image = new Image();
                        image.src = $img[0].src;
                        callback(image.width, image.height);
                    } else { // 现代浏览器
                        nWidth = img.naturalWidth;
                        nHeight = img.naturalHeight;
                        callback(nWidth, nHeight);
                    }
                }

                var root = "static/images/components/popImage/pops/pop",
                    $popId = $("#popId"),
                    $img = $popId.find(".img-con img"),
                    cssObj = {};
                $(document).on("mouseenter", target, function (e) {
                    cursorOnGceil = true;
                    if (cursorOnPop) return;
                    var $ts = $(this),
                        $li = $ts.closest(".gift-item"),
                        $lis = $li.closest("ul").find(".gift-item");
                        $img.attr("src", root + $(this).data("pop") + ".png?t=0616");

                        var offset = $ts.offset();
                        offset = {
                            top: offset.top,
                            left: offset.left
                        };

                        var gceilHeight = $ts.height();
                        var gceilWidth = $ts.width();

                        gceilArea = {
                            startX: offset.left,
                            startY: offset.top,
                            endX: offset.left + gceilWidth,
                            endY: offset.top + gceilHeight
                        };
                    if (prevImage !== $(this).data("pop")){
                        prevImage = $(this).data("pop");
                        $img[0].onload = function () {
                            getImgNaturalDimensions($img[0], function (width, height) {
                                isLoading = false;
                                var index = $lis.index($li),
                                    len = $lis.length;
                                var calcLeft = offset.left + gceilWidth / 2 - width / 2;
                                var calcTop = offset.top - height;

                                /*左右边界条件*/
                                if (calcLeft < 0) {
                                    calcLeft = 0;
                                } else if (calcLeft > (containerWidth - width)) {
                                    calcLeft = containerWidth - width;
                                }
                                var origin_adjusted = adjusted;
                                adjusted = false;
                                adjusted_change = (origin_adjusted === adjusted);

                                /*上下边界条件*/

                                if (calcTop < 0) {
                                    adjusted = true;
                                    calcTop = 0;
                                }

                                if ((calcTop + height) > containerHeight) {

                                    calcTop = containerHeight - height;
                                }


                                cssObj = {
                                    left: calcLeft,
                                    top: calcTop,
                                    bottom: "auto"
                                };
                                /*   if (!$ts.closest(".gift-item").length) {
                                 // 只有一列;
                                 cssObj = {
                                 left: offset.left,
                                 bottom: 240,
                                 top: "auto"
                                 };
                                 }*/

                                $popId.css({width: width, heigth: height});
                                $popId.css(cssObj).show();
                            });
                        };
                    }else{
                        getImgNaturalDimensions($img[0], function (width, height) {
                            isLoading = false;
                            var index = $lis.index($li),
                                len = $lis.length;
                            var calcLeft = offset.left + gceilWidth / 2 - width / 2;
                            var calcTop = offset.top - height;

                            /*左右边界条件*/
                            if (calcLeft < 0) {
                                calcLeft = 0;
                            } else if (calcLeft > (containerWidth - width)) {
                                calcLeft = containerWidth - width;
                            }
                            var origin_adjusted = adjusted;
                            adjusted = false;
                            adjusted_change = (origin_adjusted === adjusted);

                            /*上下边界条件*/

                            if (calcTop < 0) {
                                adjusted = true;
                                calcTop = 0;
                            }

                            if ((calcTop + height) > containerHeight) {

                                calcTop = containerHeight - height;
                            }


                            cssObj = {
                                left: calcLeft,
                                top: calcTop,
                                bottom: "auto"
                            };
                            /*   if (!$ts.closest(".gift-item").length) {
                             // 只有一列;
                             cssObj = {
                             left: offset.left,
                             bottom: 240,
                             top: "auto"
                             };
                             }*/

                            $popId.css({width: width, heigth: height});
                            $popId.css(cssObj).show();
                        });
                    }


                }).on("mouseleave", target, function (e) {
                    var $ts = $(this);
                    cursorOnGceil = false;
                    if (cursorOnPop) return;
                    if (isLoading) {
                        setTimeout(function () {
                            if (originTarget === $ts[0] && adjusted) return;
                            originTarget = $ts[0];
                            $popId.hide();
                        })
                    } else {
                        if (originTarget === $(this)[0] && adjusted) return;
                        originTarget = $ts[0];
                        $popId.hide();
                    }
                }).on("mouseenter", ".pop-con", function (e) {
                    cursorOnPop = true;
                    if (cursorOnGceil) return;
                }).on("mouseleave", ".pop-con", function (e) {
                    cursorOnPop = false;
                    if (cursorOffset.x === e.pageX && cursorOffset.y === e.pageY) {
                        return;
                    }
                    cursorOffset.x = e.pageX;
                    cursorOffset.y = e.pageY;
                    if (cursorOnGceil) return;
                    if (adjusted) {
                        $popId.hide();
                    }
                });
            }
        })
        var pop = new Pop().init();
        return pop;
    }
});