//David Huber Internet Projects///
//Tooltip jquery Plugin v0.1  //
var ext = IE ? 'gif':'png';

(function($){
	$.fn.tooltip = function(settings) {
		var defaults = { 
			nachOben: 2,
			nachLinks: 30,
			width: 300,
			wos: 'hotel',
			textcss: {},
			blasecss: {
				color:'#444',
				position:'absolute',
				top:'0px'
			}
		};
		var settings = $.extend(defaults, settings);
		var tipHtml=  '<div class="dhip_tooltip"><table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">'
			+'<tr>'
      +'<td height="21" width="20"><img src="/img/template/tooltip/'+settings.wos+'/blase_01.'+ext+'" /></td>'
     +'<td><img src="/img/template/tooltip/'+settings.wos+'/blase_02.'+ext+'" width="100%" height="21" /></td>'
      +'<td width="40"><img src="/img/template/tooltip/'+settings.wos+'/blase_04.'+ext+'"/></td>'
   +'</tr>'
    +'<tr>'
     +'<td width="21" style="background-image:url(/img/template/tooltip/'+settings.wos+'/blase_05.'+ext+');"></td>'
     +'<td class="dhip_tooltip_text" align="left" valign="top" style="background-color:#FFFFE7;" height="20"></td>'
     +'<td style="background-image:url(/img/template/tooltip/'+settings.wos+'/blase_07.'+ext+');"></td>'
    +'</tr>'
   +'<tr>'
      +'<td width="21" height="30"><img src="/img/template/tooltip/'+settings.wos+'/blase_10.'+ext+'" /></td>'
      +'<td><img src="/img/template/tooltip/'+settings.wos+'/blase_12.'+ext+'" width="100%" height="30" /></td>'
      +'<td><img src="/img/template/tooltip/'+settings.wos+'/blase_13.'+ext+'" /></td>'
   +'</tr></table>'
   +'<div class="dhip_tooltip_pfeil" style="position:absolute;"><img src="/img/template/tooltip/'+settings.wos+'/blase_15.'+ext+'" alt="pf" /></div>'
   +'</div>';
			   
			//De instellungen kennen a direkt an di funktion übergebm werdn//
			//z.B: $('.tips').tooltip({fixedNavigation:false})
		
		var tag, //Dor Tag, der mit dor tooltipfunktion ungsprochn wert
			blase, //Die aktuelle tooltipblase
			pfeil, //Pfeil, der zur blase gehört
			text; //Es Textelement in dor Blase
		_erstellen();
		
		function _init(obj){
			tag = $(obj);
			_text();
			_position(obj);
			blase.fadeIn();
		}
		
		function _erstellen(){
			//Tooltip wert auf die Bühne gleg
			$(document.body).append(tipHtml)
			
			//Tooltip wert ungsprochn
			blase=$('.dhip_tooltip')
			//zuerscht unsichtbor mochn
			.hide()
			//css stil festlegen
			.css(settings.blasecss);
			
			//Text für tooltip
			blase.css('width',settings.width);
			text=$('.dhip_tooltip_text');
			text.css(settings.textcss);
			pfeil=$('.dhip_tooltip_pfeil');
		}
		
		function _text(){
			var hilfe = tag.attr('name');
			text.html(hilfe);
		}

		function _position(obj){
			var e=obj;
			var x=e.offsetLeft;
			var y=e.offsetTop;
			e=e.offsetParent;
			//die Schleife zun auslesn fun dor absolutn position fun tag
			while (e!=null) {
				if (e.offsetLeft!=null && e.offsetTop!=null){
					x+=e.offsetLeft;
					y+=e.offsetTop;
				}
				e=e.offsetParent;
			}
			//berechnung der position fun dor blose
			var pos=_calc({left:x, top:y});
			
			//einstellen fun dor richtign position für die tooltip-blase
			blase.css('left',pos.left);
			blase.css('top',pos.top);
			
			//position fun pfeil
			pfeil.css('left',pos.pleft);
			pfeil.css('top',pos.ptop);
		}
		
		function _calc(pos){
			var tw,th, bw, bh, pw, ph, tx, ty, top, left;
			blase.show();									//um die position auszulesn muas di blase af visible gscholtn werdn :-(
			tw=tag.attr('offsetWidth')/2;						//breite fun tag/2 wegen mittelpunkt fun spitz von blase
			th=tag.attr('offsetHeight');						//heach fun tag für position folls dor tag noch untn gekloppet wert
			
			pw=pfeil.attr('offsetWidth')/2-tw;						//breite fun Pfeil
			ph=pfeil.attr('offsetHeight');						//heach fun Pfeil
			
			bw=blase.attr('offsetWidth')/2-tw+settings.nachLinks;					//blasen mittelpunkt-tagmittelpunkt
			bh=blase.attr('offsetHeight')+ph+settings.nachOben-20;	//blasen mittelpunkt+offset nach oben
			blase.hide();										//schnell wieder hiden
			
			tx=pos.left;	//tag position
			ty=pos.top;		//tag position
			
			//Wenn di Blase zu hoch liegt >> nach unten klappen
			top=(ty-bh<5)?ty+th+settings.nachOben:ty-bh;
			
			//Wenn di Blase zu weit links liegt >> noch rechts ruckn
 			left=(tx-bw<5)?5:tx-bw;
			
			//Wenn die Blase zu weit rechts liegt >> noch links ruckn
			if(left+2*bw>document.body.offsetWidth)left=document.body.offsetWidth-((2*bw)+tw)-5;
			return {left:left, top:top, pleft:bw-pw, ptop:bh-ph};
		}
		
		function _destroy(){
			blase.hide();
		}
		
		return this.each(function() {
			$(this).mouseover(function() {
				_init(this);
				return false; 
			});
			$(this).mouseout(function() {
				_destroy();
				return false;  
			}); 
		});  
	};  
})(jQuery);