/* DI-ToolTip
 * prototype.js 1.6.0.3
 * scriptaculous 1.8.2 (optional)
 */
 
 
 var DITooltip = Class.create({
	element : null,
	tooltipBox : null,
	options : { 
		tipContent : null,
		tipClassName : 'tip-default',
		effect : false,
		distance : 20,
		defaultPosition : 'bottom-right',
		defaultX : 'center',
		defaultY : 'middle'
	},
	
	initialize : function(element,options){
		if(typeof(element) == 'string') this.element = $(element);
		else if(typeof(element) == 'object') this.element = element;
		
		Object.extend(this.options, options);
		
		this.options.tipContent = this.options.tipContent || this.element.readAttribute('title');
	
		if(this.options.defaultPosition.indexOf('top') >= 0) this.options.defaultY = 'top';
		if(this.options.defaultPosition.indexOf('bottom') >= 0) this.options.defaultY = 'bottom';
		if(this.options.defaultPosition.indexOf('left') >= 0) this.options.defaultX = 'left';
		if(this.options.defaultPosition.indexOf('right') >= 0) this.options.defaultX = 'right';
		this.setTooltipBox();
		
		this.element.observe('mouseover',this.openTooltip.bindAsEventListener(this));
		this.element.observe('mouseout',this.closeTooltip.bindAsEventListener(this));
	},
		
	
	setTooltipBox : function(){
		if(this.options.tipContent != null && this.options.tipContent != ''){
			this.tooltipBox = new Element('div', {
				className : 'di-tooltip',
				style : 'display:none; position:absolute;'
			}).update(this.options.tipContent);
			this.tooltipBox.addClassName(this.options.tipClassName);
			$$('body')[0].insert({bottom: this.tooltipBox});
			if(this.element.readAttribute('title') != ''){
				this.options.title = this.element.readAttribute('title');
				this.element.removeAttribute('title');
			}
			if(this.element.down('img').readAttribute('alt') != ''){
				//this.options.title = this.element.readAttribute('alt');
				this.element.down('img').removeAttribute('alt');
			}
		}
	},
	
	positionTooltip : function(){
		
		this.element.observe('mousemove',function(event){
			var windowDim = document.viewport.getDimensions();
			var boxDim = this.tooltipBox.getDimensions();
			
			currentX = this.options.defaultX;
			currentY = this.options.defaultY;
			
			/* Si la ligne du haut dépasse */
			if(event.pointerY() <= (boxDim.height + this.options.distance) && event.pointerY() > (boxDim.height / 2)){
				if(currentY == 'top'){
					if(currentX == 'center') currentY = 'bottom';
					else currentY = 'middle';
				}
				
			}
			/* Si la ligne du milieu dépasse en haut */
			if(event.pointerY() <= (boxDim.height / 2)) currentY = 'bottom';
			/* Si la ligne du milieu dépasse en bas */
			if(event.pointerY() >= (windowDim.height - (boxDim.height / 2))) currentY = 'top';
			/* Si la ligne du bas dépasse */
			if(event.pointerY() >= (windowDim.height - boxDim.height - this.options.distance) && event.pointerY() < (windowDim.height - (boxDim.height / 2))){
				if(currentY == 'bottom'){
					if(currentX == 'center') currentY = 'top';
					else currentY ='middle';
				}
			}
			
			/* Si la colonne de gauche dépasse */
			if(event.pointerX() <= (boxDim.width + this.options.distance) && event.pointerX() > (boxDim.width / 2)){
				if(currentX == 'left'){
					if(currentY == 'middle') currentX = 'right';
					else currentX = 'center';
				}
			}
			/* Si la colonne du milieu dépasse à gauche */
			if(event.pointerX() <= (boxDim.width / 2)) currentX = 'right';
			/* Si la colonne du milieu dépasse à droite */
			if(event.pointerX() >= (windowDim.width - (boxDim.width / 2))) currentX = 'left';
			/* Si la colonne de droite dépasse */
			if(event.pointerX() >= (windowDim.width - boxDim.width - this.options.distance) && event.pointerX() < (windowDim.width - (boxDim.width / 2))){
				if(currentX == 'right'){
					if(currentY == 'middle') currentX = 'left';
					else  currentX = 'center';
				}
			}
			
			positionX = this.setPosition(currentX);
			positionY = this.setPosition(currentY);
			
			this.tooltipBox.setStyle({
				top : event.pointerY() + positionY +'px',
				left : event.pointerX() + positionX +'px'
			});
		}.bindAsEventListener(this));
	},
	setPosition : function(position){
		var windowDim = document.viewport.getDimensions();
		var boxDim = this.tooltipBox.getDimensions();
		var value = 0;
		switch(position){
			case 'top' :
				value = (this.options.distance + boxDim.height) * (-1);
			break;
			
			case 'middle' : 
				value = (boxDim.height / 2) * (-1);
			break;
			
			case 'bottom' :
				value = (this.options.distance);
			break;
			
			case 'left' : 
				value = (this.options.distance + boxDim.width) * (-1);
			break;
			
			case 'center' :
				value = (boxDim.width / 2) * (-1);
			break;
			case 'right' :
				value = (this.options.distance );
			break;
		}
		return value;
	},
	openTooltip : function(e){
		/* le mouseover/out se déclenche quand on survol les enfants de l'élément. on vérifie que les éléments survolés ne sont ni les enfants, ni l'élément lui même */
		if(e.relatedTarget && e.relatedTarget.ancestors().indexOf(this.element) < 0){
			if(this.tooltipBox.getStyle('display') == 'none'){
				if(this.options.effect){
					if(typeof(this.FX) != 'undefined') this.FX.cancel();
					this.FX = Effect.Appear(this.tooltipBox,{delay: 0, duration: 0.25});
				}
				else{
					this.tooltipBox.show();
				}
			}
			this.positionTooltip();
		}
	},
	
	closeTooltip: function(e){
		/* le mouseover/out se déclenche quand on survol les enfants de l'élément. on vérifie que les éléments survolés ne sont ni les enfants, ni l'élément lui même */
		if(e.relatedTarget && e.relatedTarget.ancestors().indexOf(this.element) < 0 && e.relatedTarget != this.element){
			if(this.options.effect && typeof(this.FX) != 'undefined') this.FX.cancel();
			this.tooltipBox.hide();
			this.element.stopObserving('mousemove');
		}
	}
	
});