/* -------------------------------------------------------------------
	=TTip
 ------------------------------------------------------------------ */
/*
	- params: 
			node-element
			tooltip-type (tooltip or bigtip)
	- realizes a js-tooltip
	- tooltip-content taken out of element-title
	- init: every element with class "ttip" will be tooltipped
*/
var TTip = Class.create({
	initialize: function(elm, ttype){
		this.elm 			= elm;
		this.area			= null;
		this.openTimer		= null;
		this.displayed		= false;	
		this.ttype			= ttype;	
		
		this.content 	= this.elm.title;
		// no title -> no tooltip
		
		// spezielfall aufzählung im algII-rechner
		// umbrüche einfügen vor 1., 2., 3. und a), b), c)
		if(this.ttype=='bigtip')
			this.content = this.content.replace(/((\s[1-9]\.\s)|(\s[a-h])\)\s)/g, '<br />$1');
		
		
		if (!this.content)
			return;				
			
		// empty title to prevent browser-tooltip			
		this.elm.writeAttribute({title:""});		
		
		// remove alt of surrounded images
		if ((this.elm.tagName != 'INPUT') && (this.elm.down('img'))){		
			this.elm.down('img').alt="";
		}
		
		this.boundMouseMove 	= this.mousemove.bind(this);
		this.boundShow 		= this.show.bind(this);
		this.boundOut 			= this.mouseout.bind(this);
		this.boundOver 		= this.mouseover.bind(this);
								
		this.elm.observe('mouseout', this.boundOut);
		this.elm.observe('mouseover', this.boundOver);
	},
	// mousemove-handler for poisitioning of tooltip
	mousemove: function(e){
		this.xCord = Event.pointerX(e);											
		this.yCord = Event.pointerY(e);
		if (this.displayed){
			this.area.setStyle({left: this.xCord + this.deltaX + "px", top: this.yCord + this.deltaY + "px"});	
		}	
	},
	// mouseover to start tooltip-timer 
	mouseover: function(e){
		// special case: ttip actual deactivated
		if (this.elm.hasClassName('untip')) return;
		this.elm.observe('mousemove', this.boundMouseMove);											
		if (this.openTimer)
			window.clearTimeout(this.openTimer);
		
		if (!this.displayed){			
			if (this.elm.hasClassName('ttip-nodelay')){
				this.show();
			} else {
				this.openTimer = this.boundShow.delay(0.3);
			}			
		}
		this.xCord = Event.pointerX(e);											
		this.yCord = Event.pointerY(e);
		
	},
	// mouseout to hide tooltip
	mouseout: function(e){		
		if (this.elm.hasClassName('untip')) return;									
		if (this.openTimer)
			window.clearTimeout(this.openTimer);
		this.hide();
	},
	// show tooltip
	show: function(){		
		this.displayed	= true;
		if (!this.area && !(this.area=$('ttip-area'))){
			this.buildArea(this.xCord + 12, this.yCord + 12);
		}
				
		this.area.setStyle({width: 'auto'});
		this.area.down(2).update(this.content);
		
		var height = this.area.getHeight();
		var width = this.area.getWidth();

      if (width>200 && this.ttype=='tooltip'){
          this.area.setStyle({width: '250px'});
          width = 250;
      }
      else if (width>400 && this.ttype=='bigtip'){
          this.area.setStyle({width: '500px'});
          width = 500;
      }    

		this.deltaY = -height -20;
		this.deltaX = -61;
		this.area.setStyle({left: this.xCord + this.deltaX + "px", top: this.yCord + this.deltaY + "px"});																							
		
		this.area.show();
		var width = this.area.getWidth();

      if (width>200 && this.ttype=='tooltip'){
          this.area.setStyle({width: '250px'});
      }
      else if (width>400 && this.ttype=='bigtip'){
          this.area.setStyle({width: '500px'});
      }
	
		
	},
	// hide tooltip
	hide: function(){
		this.elm.stopObserving('mousemove', this.boundMouseMove); 
		this.displayed=false;		
		if (this.area)
			this.area.hide();
	},
	// construct tooltip-area, if not already done
	buildArea: function(left, top){
		this.area = new Element('div', {id:this.ttype, style:'left:'+left+'px; top:'+top+'px; display:none; position:absolute; z-index:1000;'}).insert(new Element('div').addClassName('sh-out'));
		this.area.down().insert(new Element('div').addClassName('sh-in'));
		this.area.down(1).insert(new Element('div').addClassName('sub-content'));
		document.body.insertBefore(this.area, document.body.childNodes[0]);									
		Element.extend(this.area); // IE needs element to be manually extended
	}
});

document.observe('dom:loaded', function() {
    $$('.ttip').each(function(elm) {
        new TTip(elm, 'tooltip');
    });
    $$('.ttip-big').each(function(elm) {
        new TTip(elm, 'bigtip');
    });
});