// iframe location if it is not already set on the page
blank_iframe = '/Content/CommonTemplates/Includes/html_fiostv/layers/blank.html';

// the image directory
lib_img_dir = '/content/commontemplates/images/';

/*var arrow_up=null;
var arrow_down=null;
var arrow_right=null;
var arrow_left=null;
var div=null;*/
function formtip()
{
    var arr=new Array()
    
    for(i=0;i<600;i++)
    {
        if(document.getElementById("tip"+i))
        {
            arr[i]=document.getElementById("tip"+i)
        }
        else
        {
            return arr;
        }
    }
    return  arr;
}
function tooltip_init() {
	var bases = $ES('.tooltip');

	
	var tips = formtip();
	//var tips = $ES('.tip');
	var tooltip_img_dir = lib_img_dir+'tooltips/';
	
	if (!(tips.length>0))
	{
		return;
	}
	var body  = document.getElementsByTagName('body').item(0);
	if(document.getElementById("tip_holder"))
	{
	   document.getElementById("tip_holder").outerHTML=""; 
	}
	div = document.createElement('DIV');
	div = $(div);
	div.id='tip_holder';
	div.style.left='-1000em';
	body.appendChild(div);

	var use_ishim=false;
	
	if (navigator.appVersion.indexOf("MSIE")!=-1) {
		try
		{
		document.execCommand("BackgroundImageCache", false, true); 
		}
		catch(err)
		{
		}
		tooltip_pngorgif = 'gif';
	}
	else
	{
		tooltip_pngorgif = 'png';
	}

	var temp=navigator.appVersion.split("MSIE")
	var version=parseFloat(temp[1])
	if (version>=6 && version<7)
	{
		use_ishim=true;
		body.insertAdjacentHTML('beforeEnd', '<iframe src="'+blank_iframe+'" id="tooltip_ishim" frameborder="0" scrolling="0" style="position:absolute;top:0;left:0;width:0;height:0;display:none;z-index:99;filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0);"></iframe>');
	}
	var domainURL= location.protocol+'//'+document.domain;

	var tbl = document.createElement('TABLE');
	tbl.setAttribute("cellpadding", "0");
	tbl.setAttribute("cellspacing", "0");
	tbl.setAttribute("border", "0");
	tbl.id='tip_table';
	div.appendChild(tbl);
	var tblbody = document.createElement('TBODY');
	tbl.appendChild(tblbody);

	var tr1 = document.createElement('TR');
	tblbody.appendChild(tr1);
	var tr2 = document.createElement('TR');
	tblbody.appendChild(tr2);
	var tr3 = document.createElement('TR');
	tblbody.appendChild(tr3);

	var td1 = document.createElement('TD');
	td1.setAttribute("align", "right");
	td1.setAttribute("valign", "bottom");
	var img1 = document.createElement('IMG');
	img1.src = tooltip_img_dir+tooltip_pngorgif+'/tile_top_left.'+tooltip_pngorgif;
	img1.style.width='15px';
	img1.style.height='15px';
	td1.appendChild(img1);
	tr1.appendChild(td1);

	var td2 = document.createElement('TD');
	td2.style.background = 'url('+domainURL+tooltip_img_dir+tooltip_pngorgif+'/tile_top.'+tooltip_pngorgif+') repeat-x bottom left';
	var img2 = document.createElement('IMG');
	img2.src = tooltip_img_dir+'s.gif';
	td2.appendChild(img2);
	tr1.appendChild(td2);

	var td3 = document.createElement('TD');
	td3.setAttribute("align", "left");
	td3.setAttribute("valign", "bottom");
	var img3 = document.createElement('IMG');
	img3.src = tooltip_img_dir+tooltip_pngorgif+'/tile_top_right.'+tooltip_pngorgif;
	img3.style.width='15px';
	img3.style.height='15px';
	td3.appendChild(img3);
	tr1.appendChild(td3);

	var td4 = document.createElement('TD');
	td4.style.background = 'url('+domainURL+tooltip_img_dir+tooltip_pngorgif+'/tile_left.'+tooltip_pngorgif+') repeat-y top right';
	var img4 = document.createElement('IMG');
	img4.src = tooltip_img_dir+'s.gif';
	td4.appendChild(img4);
	tr2.appendChild(td4);

	var td5 = document.createElement('TD');
	td5.id='tip_content';	
	tr2.appendChild(td5);

	var td6 = document.createElement('TD');
	td6.style.background = 'url('+domainURL+tooltip_img_dir+tooltip_pngorgif+'/tile_right.'+tooltip_pngorgif+') repeat-y top left';
	var img6 = document.createElement('IMG');
	img6.src = tooltip_img_dir+'s.gif';
	td6.appendChild(img6);
	tr2.appendChild(td6);

	var td7 = document.createElement('TD');
	td7.setAttribute("align", "right");
	td7.setAttribute("valign", "top");
	var img7 = document.createElement('IMG');
	img7.src = tooltip_img_dir+tooltip_pngorgif+'/tile_bottom_left.'+tooltip_pngorgif;
	img7.style.width='15px';
	img7.style.height='15px';
	td7.appendChild(img7);
	tr3.appendChild(td7);

	var td8 = document.createElement('TD');
	td8.style.background = 'url('+domainURL+tooltip_img_dir+tooltip_pngorgif+'/tile_bottom.'+tooltip_pngorgif+') repeat-x top left';
	var img8 = document.createElement('IMG');
	img8.src = tooltip_img_dir+'s.gif';
	td8.appendChild(img8);
	tr3.appendChild(td8);

	var td9 = document.createElement('TD');
	td9.setAttribute("align", "left");
	td9.setAttribute("valign", "top");
	var img9 = document.createElement('IMG');
	img9.src = tooltip_img_dir+tooltip_pngorgif+'/tile_bottom_right.'+tooltip_pngorgif;
	img9.style.width='15px';
	img9.style.height='15px';
	td9.appendChild(img9);
	tr3.appendChild(td9);

	arrow_down = document.createElement('IMG');
	arrow_down.src=tooltip_img_dir+tooltip_pngorgif+'/carat_bottom.'+tooltip_pngorgif;
	div.appendChild(arrow_down);
	arrow_down.id = 'tooltip_arrow_down';
	arrow_down.style.position = 'absolute';
	arrow_down.style.display = 'block';
	arrow_down.style.bottom = '0';
	arrow_down.style.left='20px';

	arrow_up = document.createElement('IMG');
	arrow_up.src=tooltip_img_dir+tooltip_pngorgif+'/carat_top.'+tooltip_pngorgif;
	div.appendChild(arrow_up);
	arrow_up.id = 'tooltip_arrow_up';
	arrow_up.style.position = 'absolute';
	arrow_up.style.display = 'block';
	arrow_up.style.top = '0';
	arrow_up.style.left='20px';

	arrow_right = document.createElement('IMG');
	arrow_right.src=tooltip_img_dir+tooltip_pngorgif+'/carat_left.'+tooltip_pngorgif;
	div.appendChild(arrow_right);
	arrow_right.id = 'tooltip_arrow_right';
	arrow_right.style.position = 'absolute';
	arrow_right.style.display = 'block';
	arrow_right.style.left = '0';
	arrow_right.style.top = '20px';

	arrow_left = document.createElement('IMG');
	arrow_left.src=tooltip_img_dir+tooltip_pngorgif+'/carat_right.'+tooltip_pngorgif;
	div.appendChild(arrow_left);
	arrow_left.id = 'tooltip_arrow_left';
	arrow_left.style.position = 'absolute';
	arrow_left.style.display = 'block';
	arrow_left.style.right = '0';
	arrow_left.style.top = '20px';

	tooltip_clear_arrows();
	
	function tooltip_ishim(show)
	{
		var ishim = $('tooltip_ishim');
		var tip_holder = $('tip_holder');
		if(show==true && use_ishim==true)
		{	
			ishim.style.display = 'block';
			var div_pos = tip_holder.getCoordinates();
			ishim.style.width = div_pos.width;
			ishim.style.height = div_pos.height;
			ishim.style.top = div_pos.top;
			ishim.style.left = div_pos.left;
		}
		
		if (show==false && use_ishim==true)
		{
			ishim.style.display = 'none';
		}
	}
	
	var reveal = new Fx.Styles(div, {
		duration: 200,
		transition: Fx.Transitions.Quad.easeIn,
		wait: true,
		fps: 24
	});

	reveal.addEvent('onStart', function(){
		tooltip_ishim(true);
	});

	var repeal = new Fx.Styles(div, {
		duration: 200,
		transition: Fx.Transitions.Quad.easeIn,
		wait: true,
		fps: 24
	});

	repeal.addEvent('onComplete', function(){
		tooltip_ishim(false);
		div.style.left='-1000em';
		tooltip_clear_arrows();
	});

	function tooltip_clear_arrows() {
		arrow_up.style.visibility='hidden';
		arrow_down.style.visibility='hidden';
		arrow_right.style.visibility='hidden';
		arrow_left.style.visibility='hidden';
	}

	function tooltip_locate(base) {
        
		div.style.padding='0';
        
        //alert(this.innerHTML);
		var content = this;//.clone();
	    content = content.cloneNode(true);
	    //alert(this.innerHTML);
	    
		content.style.position='relative';
		content.style.left='0';
		content.style.margin='0';
		
		var con_des = $('tip_content');
		tooltip_base = base;
		con_des.innerHTML='';
		//con_des.innerHTML=content.outerHTML;
		
		con_des.appendChild(content);

		var win = {'x': window.getWidth(), 'y': window.getHeight()};
		var scroll = {'x': window.getScrollLeft(), 'y': window.getScrollTop()};
		var tc = div.getCoordinates();
		var bc = base.getCoordinates();

		if (tooltip_pngorgif=='gif')
		{
			pad=9;
		}
		else
		{
			pad=11;
		}

		var tas = bc.top-scroll.y-pad;
		var bas = win.y-bc.bottom+scroll.y-pad;
		var ras = win.x+scroll.x-bc.right-pad;
		var las = bc.left-scroll.x-pad;

		var align;
		var l;
		var t;

		if (this.className.contains('bottom'))
		{
			if (tc.height<bas)
			{
				align='bottom';
			}
			else if (tc.height<tas)
			{
				align='top';
			}
			else if (tc.width<ras)
			{
				align='right';
			}
			else if (tc.width<las)
			{
				align='left';
			}
			else
			{
				align='bottom';
			}
		}
		else if (this.className.contains('right'))
		{
			if (tc.width<ras)
			{
				align='right';
			}
			else if (tc.width<las)
			{
				align='left';
			}
			else if (tc.height<tas)
			{
				align='top';
			}
			else if (tc.height<bas)
			{
				align='bottom';
			}
			else
			{
				align='right';
			}
		}
		else if (this.className.contains('left'))
		{
			if (tc.width<las)
			{
				align='left';
			}
			else if (tc.width<ras)
			{
				align='right';
			}
			else if (tc.height<tas)
			{
				align='top';
			}
			else if (tc.height<bas)
			{
				align='bottom';
			}
			else
			{
				align='left';
			}
		}
		else
		{
			if (tc.height<tas)
			{
				align='top';
			}
			else if (tc.height<bas)
			{
				align='bottom';
			}
			else if (tc.width<ras)
			{
				align='right';
			}
			else if (tc.width<las)
			{
				align='left';
			}
			else
			{
				align='top';
			}
		}
		
		var tas = tas+pad;
		var bas = bas+pad;
		var ras = ras+pad;
		var las = las+pad;

		if (align=='top')
		{
			arrow_down.style.visibility='visible';
			div.style.paddingBottom=pad+'px';
			if (bc.width<50)
			{
				l=bc.left+(bc.width/2)-37;
			}
			else
			{
				l=bc.left
			}
			t=bc.top-tc.height-pad+7;
		} 
		else if (align=='bottom')
		{
			arrow_up.style.visibility='visible';
			div.style.paddingTop=pad+'px';
			if (bc.width<50)
			{
				l=bc.left+(bc.width/2)-37;
			}
			else
			{
				l=bc.left
			}
			t=bc.bottom-pad+7;
		}
		else if (align=='right')
		{
			arrow_right.style.visibility='visible';
			div.style.paddingLeft=pad+'px';
			if (bc.height<50)
			{
				t=bc.top+(bc.height/2)-37;
			}
			else
			{
				t=bc.top;
			}
			l=bc.right-pad+7;
		}
		else if (align=='left')
		{
			arrow_left.style.visibility='visible';
			div.style.paddingRight=pad+'px';
			if (bc.height<50)
			{
				t=bc.top+(bc.height/2)-37;
			}
			else
			{
				t=bc.top;
			}
			l=bc.left-tc.width-pad+7;
		}
		
		div.style.left=l+'px';
		div.style.top=t+'px';

		reveal.start({
			'opacity': [0,1]
		});
	}
		
	bases.each(function(base,index) {
		base.addEvents({
			'mouseenter':  function(e) {

			
				$clear(tooltip_locate_to);
				var relTarg = e.relatedTarget || e.fromElement;
				while (relTarg && relTarg != base && relTarg != div && relTarg.nodeName != 'BODY')
				relTarg = relTarg.parentNode
				if (relTarg == base || relTarg == div) return;

				tooltip_locate_to = tooltip_locate.delay(500,tips[index],base);	
			},

			'mouseleave': function(e) {

				$clear(tooltip_locate_to);
				var relTarg = e.relatedTarget || e.toElement;
				while (relTarg && relTarg != base && relTarg != div && relTarg.nodeName != 'BODY')
				relTarg = relTarg.parentNode
				if (relTarg == base || relTarg == div) return;

				reveal.stop();
				repeal.start({
					'opacity': [1,0]
				});
			}
		});
	});

	var tooltip_locate_to;

	div.addEvents({
		'mouseleave': function(e) {			
			$clear(tooltip_locate_to);

			var relTarg = e.relatedTarget || e.toElement;
			while (relTarg && relTarg != tooltip_base && relTarg != div && relTarg.nodeName != 'BODY')
			relTarg = relTarg.parentNode
			if (relTarg == tooltip_base || relTarg == div) return;

			reveal.stop();
			repeal.start({
				'opacity': [1,0]
			});
		}
	});
}

window.addEvent('domready', function(){

	tooltip_init();
});