// ----------------------------------------------------------------
// Classe MooTooltip  	-  		Mike GILBLAS  		- 	 02/01/2010 
// ----------------------------------------------------------------
// Affichage d'un tooltip sur un élément
// ----------------------------------------------------------------
// Usage : 
// -------
// - inclure mootooltip.js / mootooltip.css dans la page
// - instancier MooTooltip sur un élément. 
// 		new MooTooltip(elt, 'mon texte', options);
//   ou appeler directement la méthode affTooltip() depuis l'objet
//      monElt.affTooltip('mon texte');
//
// Options : 
// ---------
// - width :  Largeur maxi du tooltip
// - duration: Durée d'affichage en ms du tooltip
// ----------------------------------------------------------------
var chemin = 'mootooltip/';	// Chemin où se trouve le script

// Définition de la classe
var MooTooltip = new Class({
	Implements: [Events, Options],

	// Options
	options: {
		width: 300,
		duration: 3000, 
		unique: true, 
		fade: true, 
		offset: { x: 0, y: 0 }
	},
	
	// Constructeur
	initialize: function(elt, texte, options){
		this.setOptions(options);
		if (this.options.unique) $$('.mooTooltip').each(function(elt) { if (elt != this.mtt) elt.getParent().dispose(); });
		this.mtt = new Element('div', { styles: { 
				opacity: 0, 
				position: 'absolute',
				maxWidth: this.options.width, 
				width: 'auto',
				height: 'auto',
				top: elt.getPosition().y + elt.getSize().y - 6 + this.options.offset.y, 
				left: elt.getPosition().x + this.options.offset.x,
				zIndex: 999
		} }).adopt(new Element('img', { src: chemin+'fleche.png', styles: { marginLeft: 8, zIndex: 2 } }))
			.adopt(new Element('div', { 'class': 'mooTooltip', html: texte, styles: { marginTop: -1, zIndex: 1 } }))
			.inject($(document.body));
		if (this.options.fade) this.mtt.fade('in'); else this.mtt.setStyle('opacity', 1);
		if (this.options.duration > 0) this.masquer.bind(this).delay(this.options.duration);
		else {
			this.mtt.addEvent('mouseleave', function(e) { this.masquer(); }.bind(this));
			elt.addEvent('mouseleave', function(e) { this.masquer(); }.bind(this));
		}
	}, 

	// Masquer le tooltip
	masquer: function() {
		if (this.mtt)  {
			if (this.options.fade) {
				var mtt = this;
				this.mtt.get('tween').start('opacity', 0).chain(function() { mtt.mtt.dispose(); });
			} else this.mtt.dispose();
		}
	}
});

// Implémentation de la classe en auto sur un objet via une méthode rattaché à l'élément
Element.implement({
	affTooltip: function(texte, options) {
		new MooTooltip(this, texte, options);
	}
});

