// ToolTips - show tooltips on hover - version 0.1, MooTools version 1.2.1
// author Constantin Boiangiu <info [at] constantinb.com>

var MooTooltips=new Class({Implements: [Options],options:{container:null,hovered:null,extra:null,ToolTipClass:'ToolTips',toolTipPosition:1,showDelay:500,sticky:false,
fromTop:0,fromLeft:0,duration:100,fadeDistance:20},initialize:function(options) {this.setOptions(options||null);if(!this.options.hovered && !this.options.extra) return;if( this.options.hovered) this.elements=$(this.options.container||document.body).getElements(this.options.hovered);if(!$defined(this.elements)) this.elements=new Array();var e = new Hash(this.options.extra);e.each(function(el){$(el.id).set( 'rel', JSON.encode(el) );this.elements.include($(el.id));},this);this.currentElement = null;this.attach();},attach: function(){this.elements.each(function(elem, key){var t = new Hash(JSON.decode(elem.getProperty('rel')));t.include('visible',0);var tooltip=this.createContainer(t.sticky||this.options.sticky);if(t.content)tooltip.message.set({'html':$(t.content).get('html')});else if(t.text) tooltip.message.set({'html':t.text});else if(t.ajax){tooltip.message.set({'html':t.ajax_message||'Loading... please wait.'});new Element('div',{'class':'loading'}).injectInside(tooltip.message);}if(!t.position)t.position=this.options.toolTipPosition;if(t.position==-1){tooltip.header.set({'class':'dockTopHeader'});tooltip.footer.set({'class':'dockTopFooter'});}tooltip.container.store('properties',t);elem.store('tip',tooltip.container);$(document.body).adopt(tooltip.container);elem.removeProperties('title','rel');var over=this.enter.bindWithEvent(this,elem);var out=this.leave.bindWithEvent(this,elem);var startEvent=t.focus ? 'focus' :'mouseenter'; var endEvent=t.focus ? 'blur' :'mouseleave';elem.addEvent(startEvent,over);if(t.sticky || this.options.sticky){tooltip.close.addEvent('click',this.hide.pass(tooltip.container).bind(this) );}elem.addEvent(endEvent,out.pass(tooltip.container));},this);},enter:function(event,element){var tip=element.retrieve('tip');var elProperties=tip.retrieve('properties');if(elProperties.visible==1) return;if(elProperties.ajax && !elProperties.loaded){new Request.HTML({url:elProperties.ajax,update:tip.getElement('.message'),onFailure:function(){elProperties.set('loaded',0);}}).get();elProperties.set('loaded',1);}var showAfter=elProperties.target ? $(elProperties.target) :element;var elSize=showAfter.getCoordinates();var tipSize=tip.getCoordinates();this.fromTop=0;if(elProperties.position==-1)this.fromTop=elSize.top - this.options.fromTop - tipSize.height;else this.fromTop=elSize.top+this.options.fromTop+elSize.height;var top_dist=this.fromTop+(elProperties.position||this.options.toolTipPosition) * this.options.fadeDistance ;tip.setStyles({'top':top_dist,'left':elSize.left+this.options.fromLeft,'z-index':'110000'});elProperties.set('leave',top_dist);this.currentElement=tip;this.timer=$clear(this.timer);this.timer=this.show.delay(this.options.showDelay,this);},leave:function(element){var elProperties=element.retrieve('properties');if((elProperties.sticky || this.options.sticky) && elProperties.visible){return;}this.hide(element);},hide:function(element){this.timer=$clear(this.timer);var elProperties=element.retrieve('properties');element.morph({'opacity':0,'top':elProperties.leave});elProperties.visible=0;},show:function(){this.currentElement.setStyles({'display':'block','opacity':0,'z-index':100000});this.currentElement.morph({'opacity':1,'top':this.fromTop});this.setVisible();},setVisible:function(){var elProperties=this.currentElement.retrieve('properties');elProperties.visible=1;},createContainer:function(sticky){var container=new Element('div').set({'class':this.options.ToolTipClass,'styles':{'position':'absolute','top':0,'left':0,'opacity':0,'z-index':'100000'},'morph':{duration:this.options.duration,link:'cancel',transition:Fx.Transitions.Sine.easeOut}});var header=new Element('div',{'class':'dockBottomHeader'});if(sticky){var closeBtn=new Element('div',{'class':'sticky_close'}).injectInside(header);}var message=new Element('div',{'class':'message'});var footer=new Element('div',{'class':'dockBottomFooter'});container.adopt(header,message,footer);return {'container':container,'header':header,'message':message,'footer':footer,'close':closeBtn||null};}});