allToolTips = new Array();

//fix for tooltips + select boxes in IE6
var tooltipIE6 = false /*@cc_on || @_jscript_version < 5.7 @*/;

Event.observe(window, 'load', function() {
	//sometimes IE domLoaded fires too early
	//elms aren't ready.
	//this is to recal the create
	buildTips();
	Event.observe(window, 'resize', onWindowResize);
});

var ttipsBuilt = false;
function buildTips(){
	if(!ttipsBuilt){
		$$('.ttip').each(function(elm){
			ttipsBuilt = true					  
			var tip = new ttipH(elm);
			tip.init();
			allToolTips.push(tip);
			
			//get children anchor tages. ie: one may be assigned to question mark.
			elm.getElementsBySelector('a').each( function(anchorElm){
														 
				//now lets make sure to cancel an anchor for the hover element if its href="#"
				Event.observe(anchorElm, 'click', stopHashAnchorClick, false);											
			})
		})
	}
}
function onWindowResize(){
	for(i=0;i<allToolTips.length;i++){
		allToolTips[i].position();
	}
}

function stopHashAnchorClick(e) {
	if (this.readAttribute('href') == '#') Event.stop(e);
}
function ttipH(elm){
	
	var _inFade = "none";
	var _fadeDown = {cancel:function(){}};
	var _timeOut = "";
	var _isIE = (navigator.appName == 'Microsoft Internet Explorer');
	var _parentElm = elm.select('a img')[0];
	var _ttipElm = elm.select('.ttipHolder')[0];
	var _ttipId=String(largeRandom())+'id';
	
	this.init = function(){
		//wrap element with encasing for CSS
		var front = '<div class="tTipUpper"><div class="tTipLower"><div class="tTipMain">';
		var back = '</div></div></div>';
		
		var ttipHtml = front + _ttipElm.innerHTML + back;
		//console.log(ttipHtml);
		var classes = _ttipElm.readAttribute('class');
	
		new Insertion.Bottom($$('body')[0], new Element('div').writeAttribute({ 'class': classes , 'id' : _ttipId}).update(ttipHtml));
		//take out old elemetn
		_ttipElm.remove();
		
		//only reason we needed an ID is so we can grab it here.
		_ttipElm = $(_ttipId);
		this.position();
		this.bindEvents();
	}
	
	this.position = function(){
		
		
		//console.log('in init');
		//function gets left and right position as if absolute
		var offSets = _parentElm.cumulativeOffset() ;
		
		//safari won't detect height/widght without opactiy.
		_ttipElm.setOpacity(.01);
		_ttipElm.setStyle({display:'block'});
		
		//calculate new top and left
		var newTop = offSets.top - stringReplace(_ttipElm.getStyle('height') , 'px') ;
		var newLeft = offSets.left - (stringReplace(_ttipElm.getStyle('width') , 'px') / 2) + 7 ;
		
		//set top and left
		_ttipElm.setStyle({
			top: newTop + 'px',
			left: newLeft + 'px',
			display:'none'//,
		});
		//set parentElm back to regular positionion again
		//_parentElm.setStyle({'position':'static'});
		
		_ttipElm.setOpacity(0);
	}
	this.bindEvents = function(){
		//bind events into the scope of this class
		Event.observe(_parentElm, 'mouseover', this.ttipOver.bindAsEventListener(this), true);
		Event.observe(_parentElm, 'mouseout', this.ttipClose.bindAsEventListener(this), true);
	}
	
	this.ttipOver = function(event){
		this.position();
		_ttipElm.setOpacity(1);
		_ttipElm.setStyle({display:'block'});
		
		if (tooltipIE6) {
			//hide all selects
			$$('select').each(function(elm){
				$(elm).setStyle({
					visibility: 'hidden'
				})
			});
		}
		
	}
	this.ttipClose = function(){
		_ttipElm.setStyle({display:'none'})		
		
		
		if (tooltipIE6) {
			//show all selects
			$$('select').each(function(elm){
				$(elm).setStyle({
					visibility: 'visible'
				})
			//$(elm).setOpacity(1);
			});
		}
	}
}

function stringReplace (orig, remove , insert){
	if (insert == null) insert = "";
	return orig.split(remove).join(insert);
}
		
function largeRandom (length){
	if(length == null)length = 1000000000;
	return Math.floor(Math.random() * length);
}