dojo.declare("Popup", null, {
	constructor: function(){
	},

	update: function(pos, text, width){
		if (text) this.text.innerHTML = text;
		if (width) this.domNode.style.width = width;
		this.domNode.style.left = pos.x + "px";
		this.domNode.style.top = pos.y + "px";
	},

	show: function(){
		this.domNode.style.display = "";
	},

	hide:function(){
		if (this.tooltipTimeout)
			clearTimeout(this.tooltipTimeout);
		this.domNode.style.display = "none";		
	},

	onShow: function(){
		if (this.tooltipTimeout)
			clearTimeout(this.tooltipTimeout);						 
		this.tooltipTimeout = setTimeout(dojo.hitch(this, "show"), 200);
	},

	onHide: function(){
		if (this.tooltipTimeout)
			clearTimeout(this.tooltipTimeout);				   
		this.tooltipTimeout = setTimeout(dojo.hitch(this, "hide"), 200);
	},

	onUpdate: function(e){
		var node = e.target;
		if (!dojo.hasClass(node, "tip")) {
			if (dojo.hasClass(node.parentNode, "tip"))
				node = e.target.parentNode;			
		}			   
		var text = node.getAttribute("tip");
		var dx = parseInt(node.getAttribute("dx"));
		var dy = parseInt(node.getAttribute("dy"));
		var width = node.getAttribute("tipwidth");
		var offset = {dx: ((dx)? dx : 0), dy: ((dy)? dy : 0)};
		var pos = dojo.coords(node, true);
		pos.x += offset.dx;
		pos.y += offset.dy;

		this.update(pos, text, width);
		this.onShow();
	}
});

dojo.declare("Tooltip", Popup, {
	constructor: function(){
		this.domNode = dojo.byId("tooltip");
//		this.text = wrike.util.elemByClass(this.domNode, 'content', 'DIV');
		var res = dojo.query('DIV' + ('content'? ("." + 'content'): ""), this.domNode);
		this.text = res[0];
		this.domNode.className = "popup tooltip";
		this.attachToolTips(document);
	},

	attachToolTips: function(content) {
//		var tips = wrike.util.elemsByClass(content, 'tip', '*');
		var tips = dojo.query('*' + ('tip' ? ("." + 'tip'): ""), content);
		for (var i=0; i<tips.length; i++) {
			dojo.connect(tips[i], 'onmouseover', this, dojo.hitch(this, "onUpdate"));
			dojo.connect(tips[i], 'onmouseout', this, dojo.hitch(this, "onHide"));
		}
	}
});

dojo.declare("UpgradeToNewVersionTooltip", Popup, {

    constructor : function() {
		this.domNode = dojo.byId("upgrade-to-new-version-popup");
		this.domNode.className = "popup tooltip upgrade-to-new-version-popup";
		var res = dojo.query('div.content', this.domNode);
		this.text = res[0];
    },

    checkShowNecessity : function() {
        var me = this;

        dojo.xhrPost({
            url : '/ws_servlet/uistore',
            content : {key : "upgradeToNewVersionTooltipClosed"},
            load : function(result) {
                if (result != '1') {
                    var html = wrikeI18n["upgrade_to_new_version_message_html"],
                        bodyWidth = dojo.contentBox(dojo.body()).w;

                    me.update({x: 0, y: 0}, html);
                    dojo.style(me.domNode, {
                        "left" : ( bodyWidth - 400 ) / 2 + 'px'
                    });
                    dojo.connect(dojo.query('.upgrade-to-new-version-popup-close', me.domNode)[0], 'onclick', me, function() {
                        me.hide();
                        dojo.xhrPost({
                            url : '/ws_servlet/uistore',
                            content : {key : "upgradeToNewVersionTooltipClosed", value : 1}
                        });
                        return false;
                    });
                    me.show();                    
                }
            }
        });
    }
});

dojo.declare("TaskListTooltip", Popup, {
	constructor: function(toolbar){
		this.domNode = dojo.byId("tooltip");
//		this.text = wrike.util.elemByClass(this.domNode, 'content', 'DIV');
		var res = dojo.query('DIV' + ('content'? ("." + 'content'): ""), this.domNode);
		this.text = res[0];
		this.domNode.className = "popup tooltip";
		this.attachToolTips(toolbar);
		this.domNode.style.display = "";
		this.domNode.style.width = "auto";
		this.hide();
	},

	attachToolTips: function(content) {
//		var tips = wrike.util.elemsByClass(content, 'tip', '*');
		var tips = dojo.query('*' + ('tip' ? ("." + 'tip'): ""), content);
		for (var i=0; i<tips.length; i++) {
			dojo.connect(tips[i], 'onmousemove', this, dojo.hitch(this, "onUpdate"));
			dojo.connect(tips[i], 'onmouseleave', this, dojo.hitch(this, "onHide"));
			dojo.connect(tips[i], 'onmouseenter', this, dojo.hitch(this, "onEnter"));
		}
	},

	onUpdate: function(e){
		if (!e) return;
		
		var pos = {x: e.clientX, y: e.clientY};

		pos.x += 10;
		pos.y += 10;

		this.domNode.style.top = pos.y + "px";

        if (this.viewPort && pos.x + this.domNode.offsetWidth > this.viewPort.w)
			this.leftX = pos.x + -(pos.x + this.domNode.offsetWidth - this.viewPort.w) + "px";			
		else
			this.leftX = pos.x + "px";

		this.onShow();
	},

	onEnter: function(e) {
		var node = e.target;
		if (!dojo.hasClass(node, "tip"))
			if (dojo.hasClass(node.parentNode, "tip"))
				node = e.target.parentNode;
		var text = node.getAttribute("tip");
		if (text)
			this.text.innerHTML = text;
		if (this.tooltipTimeout)
			clearTimeout(this.tooltipTimeout);
		this.viewPort = dijit.getViewport();
		this.tooltipTimeout = setTimeout(dojo.hitch(this, "letIsGo"), 400);
	},

	letIsGo: function() {
		this.canShow = true;
		this.show();
	},

	show: function(){
		this.domNode.style.left = this.leftX;		
	},

	hide:function(){
		if (this.tooltipTimeout)
			clearTimeout(this.tooltipTimeout);
		//this.domNode.style.display = "none";
		this.domNode.style.left = '-10000px';
	},

	onShow: function(){
		if (this.canShow)
			this.show();
	},

	onHide: function(e){
		if (this.tooltipTimeout)
			clearTimeout(this.tooltipTimeout);
		//if (!dojo.hasClass(e.target.parentNode, "tip")) {
//			this.hide();
//		}
		this.canShow = false;
		this.hide();
		//console.debug(e.target, dojo.hasClass(e.target, "tip"), dojo.hasClass(e.target.parentNode, "tip"));
	}
});