Zapatec.LiteTooltip = {};
Zapatec.LiteTooltip.tooltipContainer = null;

Zapatec.LiteTooltip.currentlyLockedElement = null;
Zapatec.LiteTooltip.currentlyShownElement = null;

Zapatec.LiteTooltip.TOOLTIP_ID = "tooltip";
Zapatec.LiteTooltip.STANDARD_TOOLTIP_OFFSET_X = 15;
Zapatec.LiteTooltip.STANDARD_TOOLTIP_OFFSET_Y = -10;
Zapatec.LiteTooltip.TOOLTIP_LOADING_TEXT = "Loading...";


Zapatec.LiteTooltip.showTooltip = function(el, text){
	var self = this;
	if(el == this.currentlyLockedElement) {
		return;
	}

	this.unlockTooltip();

	this.currentlyShownElement = el;

	el.onmouseout = function(){
		self.hideTooltip();
	};
	el.onclick = function(){
		self.lockTooltip(el);
	};
	this.tooltipContainer.innerHTML = text;
	
	this.positionTooltipWindow(el);
}

// position tooltip to the text
Zapatec.LiteTooltip.positionTooltipWindow = function(el){
	var relativeOffset = 0;
	var elementOffsetLeft = Zapatec.Utils.getElementOffset(el).left;
	var elementOffsetTop = Zapatec.Utils.getElementOffset(el).top; 
	var pageWidth = Zapatec.Utils.getWindowSize().width;
	var pageHeight = Zapatec.Utils.getWindowSize().height;
	
	var left = elementOffsetLeft + this.STANDARD_TOOLTIP_OFFSET_X;
	var top = elementOffsetTop + el.clientHeight - this.STANDARD_TOOLTIP_OFFSET_Y;


	if(pageWidth < left + this.tooltipContainer.clientWidth) {
		left = elementOffsetLeft - this.tooltipContainer.clientWidth - relativeOffset;
	}

	if(left < 0) {
		left = elementOffsetLeft + this.STANDARD_TOOLTIP_OFFSET_X;;
	}

	if(pageHeight < top + this.tooltipContainer.clientHeight) {
		top = elementOffsetTop - this.tooltipContainer.clientHeight;
	}

	if(top < 0){
		top = elementOffsetTop + el.clientHeight - this.STANDARD_TOOLTIP_OFFSET_Y;
		left += relativeOffset;
	}

	this.tooltipContainer.style.left = left + "px";
	this.tooltipContainer.style.top = top + "px";
	this.tooltipContainer.style.visibility='visible';
}

Zapatec.LiteTooltip.lockTooltip = function(el){
	var self=this;
	el.onclick = function(){
		self.unlockTooltip(el)
	};
	el.onmouseout = function(){};
	
	this.tooltipContainer.className = "tooltipLocked";
	this.currentlyLockedElement = el;
}

Zapatec.LiteTooltip.unlockTooltip = function(el){
	this.hideTooltip();
	this.currentlyLockedElement = null;
	this.tooltipContainer.className = "tooltipFloating";
}

Zapatec.LiteTooltip.hideTooltip = function(){
	this.tooltipContainer.style.left = '-1000px';
	this.tooltipContainer.style.top = '-1000px';
	this.tooltipContainer.style.visibility='hidden';
	
	this.currentlyShownElement = null;
}

// get all elements with specified classname
Zapatec.LiteTooltip.getTooltippedElements = function () {
	var children = document.getElementsByTagName('*') || document.all;
	var elements = new Array();

	for (var i = 0; i < children.length; i++) {
		var child = children[i];
		
		if (child.getAttribute("tooltip")) {
				elements.push(child);
		}
	}
	return elements;
}


Zapatec.LiteTooltip.getTooltipTextOnDemand = function(currEl){
	var self = this;
	url = currEl.getAttribute("tooltip");

	Zapatec.Transport.fetch({
		url: url,
		async: true,
		onLoad: function (objResponse) {
			var html = objResponse.responseText;
			self.tooltipContainer.innerHTML = html;
			if (self.currentlyShownElement == currEl) {
				self.showTooltip(currEl, html);
			}
			currEl.onmouseover = function(){self.showTooltip(this, html)};
		},
		onError: function(objResponse) {
			var html = "Can't retrieve data:<br>" + objResponse.statusText;
			alert(objResponse.errorDescription);
		}
	});
}

Zapatec.LiteTooltip.attachSingleTooltip = function (el) {
	var self = this;
	el.onmouseover =  function() {
		self.showTooltip(this, self.TOOLTIP_LOADING_TEXT);
		self.getTooltipTextOnDemand(el);
	};
}

Zapatec.LiteTooltip.attachTooltips = function (){
	var self = this;

	this.tooltipContainer = Zapatec.Utils.createElement("div");
	this.tooltipContainer.id = this.TOOLTIP_ID;
	this.tooltipContainer.onclick = function(){
		self.unlockTooltip();
	};
	document.body.insertBefore(this.tooltipContainer,document.body.firstChild);
	
	var els = this.getTooltippedElements();
	for(var i = 0; i < els.length; i++){
		var el = els[i];
		this.attachSingleTooltip(el);
	}
}

