// ##########################################################
// Quick titles 0.2
// depend on framework prototype 1.6  
// @author Jan Kapusta - flym.sk 
// @abstract - Quicktitle (QT) is special feature applicable for all DOM elements. 
//             QT get element-title and show it close to mouse pointer immediately
//			   element-title is in DIV element which can be styled by CSS as well.
// @use    
//   basic QT 
// 		<a href="http://www.myweb.com"  title="My webpage is here" onmouseover="QTbasic(this,'css-class-tostyle-it-eg-moving-title' )"  >www.myweb.com</a>
//	 or 
//  QT with shadows
//	     <a href="http://www.myweb.com"  title="My webpage is here" onmouseover="QTwithshadow(this,'css-class-tostyle-it-eg-moving-title' )"  >www.myweb.com</a>
//
// ##########################################################


function QTbasic(element,className)
{	 	
	
	// inicialisation QT - create QTcontainer (where is saved some needed data)
	QTstart();
	// create FLY (flying element) and save it into container
	if(!$('QTflyBasic'))
	{
		var flyElm = new Element('div'); 
		flyElm.writeAttribute('id','QTflyBasic');		
		$('QTcontainer').insert(flyElm);	
		$('QTcontainer').currentFly=flyElm;
		$('QTcontainer').currentFlyInside=flyElm;			
	}		
	element = Element.extend(element);
	QTsetElement(element,className);	
}

function QTwithshadow(element,className)
{	 	
	
	// inicialisation QT - create QTcontainer (where is saved some needed data)
	QTstart();
	// create FLY (flying element) and save it into container
	if(!$('QTflyWithshadow'))
	{
		var flyElm = new Element('div'); 
		flyElm.writeAttribute('id','QTflyWithshadow');		
		$('QTcontainer').insert(flyElm);	
		$('QTcontainer').currentFly=flyElm;
		
		// insert special HTML into fly elm ---
		// and set $('QTcontainer').currentFlyInside to element where the text (from watched element) shold be
		var elmInside= new Element('div');
		$('QTcontainer').currentFlyInside=elmInside;
		elmInside.addClassName('qt-cnt s-clr');
		flyElm.insert(elmInside);
		flyElm.insert({'bottom':'<i class="shwd-right" ></i><i class="shwd-cor" ></i><i class="shwd-bottom" ></i>'});		
	}		
	element = Element.extend(element);
	QTsetElement(element,className);	
}

// YOU could add similar function here eg QTmyspecial(element,className) with special HTML inside FLY element.







// #########################################################################
// -- DONT change this part ----------------------------------------------

function QTsetElement(element,className)
{
	// zmena akutalneho elementu
	if(!element.qtAct)
	{
		// vrat povodny element do povodneho stavu
		if($('QTcontainer').currentWatchedElm)
		{
			$('QTcontainer').currentWatchedElm.qtAct=false;
			$('QTcontainer').currentWatchedElm.writeAttribute('title',$('QTcontainer').currentTitle);
		}
		// nastavit novy aktualny element
		var titleTxt=element.readAttribute('title');
		element.qtAct=true;
		$('QTcontainer').currentWatchedElm=element;
		$('QTcontainer').currentTitle=titleTxt;			
		$('QTcontainer').currentFly.addClassName(className);
		$('QTcontainer').currentFlyInside.update(titleTxt);			
		//$('QTcontainer').currentFly.absolutize();
		element.writeAttribute('title','');
	}
}


function QTstart()
{	 	
	if(!$('QTcontainer'))
	{
		var containerElm = new Element('div'); 
		containerElm.writeAttribute('id','QTcontainer');
		document.body.appendChild(containerElm);	
		document.observe('mousemove', QTrespondToMove);				
	}			
}


function QTrespondToMove(event) 
{ 
	if( Position.within($('QTcontainer').currentWatchedElm, event.pointerX(),event.pointerY()) )
	{
	  $('QTcontainer').currentFly.show().setStyle({
			  	position:'absolute',
			  	left:(event.pointerX()+8)+'px',
			  	top: (event.pointerY()+8)+'px'
	  });	  
	}
	else
		$('QTcontainer').currentFly.hide();
}