/* Author: yangzeming
 * Date: 2013-12-10
 * Desc: 提示小弹窗
 */
define(function (require, exports, module) {
    var Tip = _.Class({
        initial: function (options) {
            this._eventStack = {};
            var defaultOp = {
				//默认的气泡样式
                template: ['<div class="eui-bubble-wrap" style="display:none;">'
					    , '<div class="eui-bubble-content" data-role="content">'
					    , '<div class="eui-bubble-body" data-role="body"></div>'
					    , '<div class="eui-bubble-closed" data-role="closeBtn"></div>'
					    , '</div><div class="eui-triangle " data-role="arrow">'
					    , '<div class="eui-triangle-outter " ><em>◆</em></div>'
					    , '<div class="eui-triangle-inner" ><em>◆</em></div>'
					    , '</div></div>'].join(""),
                content: 'hello tip',//提示框里的内容
                hasArrow: true,//是否显示箭头
                arrowOption: {
                    dir: "up",//箭头方向
                    position: {
                       
                    }
                },
                con: "body",//传入的容器
                hasCloseBtn: true,//是否显示关闭按钮
                position: {//tip的位置
                    my: "center",
                    at: "center",
                    of: "body"
                },
                css: {
                    width: "auto"
                }
            };
            this.options = $.extend(true, defaultOp, options);
            this.$con = $(this.options.con);
            this.$tip = $(this.options.template);
            this.$con.append(this.$tip);//把气泡放入传入的容器里
            this.$content = this.$tip.find('[data-role="content"]');
            this.$body = this.$tip.find('[data-role="body"]');
            this.$closeBtn = this.$tip.find('[data-role="closeBtn"]');
            this.$arrow = this.$tip.find('[data-role="arrow"]');
            this.buildTip();
            return this;

        },
        buildTip: function () {
            
            var options = this.options,
                arrowOption = options.arrowOption;
            if (options.hasCloseBtn) {
                this.$closeBtn && this.$closeBtn.show();
            }
            this.$tip.css(options.css);
            if (options.hasArrow) {
                this.$arrow && this.$arrow.show();
                if (arrowOption.dir == 'up' || arrowOption.dir == 'down') {
                    this.$content.css({
                        "width": options["css"]["width"]

                    });
                } else {
                    this.$content.css({
                        "width": options["css"]["width"] - 7

                    });
                }
                this.$arrow.addClass("eui-arrow-" + arrowOption.dir);
                this.$content.addClass("eui-bubble-" + arrowOption.dir);
                this.$arrow.css(arrowOption.position);
            } else {
                this.$arrow && this.$arrow.hide();

            }
           
            this.$body.html(options.content);
            this._bindEvent();
        },
        _bindEvent: function () {
            var options = this.options,
                self = this;
            if (options.hasCloseBtn) {
                this.$tip.delegate('[data-role="closeBtn"]', "click", function () {
				console.log($browser.msie);
                    self.trigger("onclose");
                    self.close();
                });
            }

        },
        close: function () {
            this.$tip.remove();
        },
        show: function (obj) {
		
            if (obj) {
                this.$tip.css({ "zIndex": obj.zIndex });
                this.showByTime(obj.type, obj.time);
            } else {
                this.$tip.css({ "zIndex": $.getInerzIndex() });
                this.$tip.show();
            }
			 this.$tip.position(this.options.position);
        },
		setPosition : function(position){
			$.extend(true,this.options.position,position);
		},
		setWidth : function(width){
			this.$content.css({"width": width});
		},
		setHeight : function(height){
			this.$content.css({"height": height});
		},
		hide : function(){
			this.$tip.hide();
			
		},
		setContent : function(content){
			this.$body.html(content);
		},
        showByTime: function (type, time) {
            var self = this;
            if (type == "delayShow") {
                setTimeout(function () {
                    self.$tip.show();
                }, time);
            } else if (type == "delayClose") {
                self.$tip.show();
                setTimeout(function () {
                    self.close();
                }, time);
            } else {
                self.$tip.show();
            }

        },
        hideArrow: function () {
            this.$arrow.hide();
        },
        showArrow: function () {
            this.$arrow.show();
        },
        setBubbleFixed: function () {
            if (!($.browser.msie && $.browser.version == "6.0")) {
                this.$tip.addClass("eui-bubble-wrap-fixed");
            } else {
                this.$tip.addClass("eui-bubble-fixed-hack");
            }
        },
        setBubbleNormal: function () {
            if (!($.browser.msie && $.browser.version == "6.0")) {
                this.$tip.removeClass("eui-bubble-wrap-fixed");
            } else {
                this.$tip.removeClass("eui-bubble-fixed-hack");
            }
        },
        setFixedForMessage: function () {
            var self = this, scrollTimeer;
            var bubblePos = null;
            if (scrollTimeer) clearTimeout(scrollTimeer);
            $(window).bind('scroll', function () {
                if (scrollTimeer) {
                    clearTimeout(scrollTimeer);
                }
                if (bubblePos == null) {
                    bubblePos = self.$tip.position();
                }
                scrollTimeer = setTimeout(function () {

                    self._bubleFixedSet(bubblePos);
                }, 10);
            });
        },
        _bubleFixedSet: function (originPosition) {
            var self = this, scrollTop = $(window).scrollTop(), op = this.options;

            if (scrollTop > originPosition.top) {

                self.setBubbleFixed();
                if (!($.browser.msie && $.browser.version == "6.0")) {
                    self.$tip.css({
                        "top": -5
                    });
                }

                self.$arrow.hide();


            } else {
                self.setBubbleNormal();

                self.$tip.css({
                    "top": originPosition.top
                });
                self.$arrow.show();

            }

        }



    });
    module.exports = Tip;

});