var tooltipEngine = new Class({
	width: 126,
	height: 49,
	tooltip: '',
	initialize: function(containerId, targetClass) {
		this.targets = $(containerId).getElements(targetClass);
		this.targets.each(function(target) {
			//alert(this.targets.length);
			target.addEvent("click", function(event) {
				new Event(event).stop();
			}.bind(this));						
			target.addEvent("mouseenter", function(event) {
				this.show(target.className);	
			}.bind(this));
			target.addEvent("mouseleave", function(event) { 
				this.hide();
				this.updatePosition(this.mouseX(event), this.mouseY(event)); 
			}.bind(this));
			target.addEvent("mousemove", function(event) { 
				this.updatePosition(this.mouseX(event), this.mouseY(event)); 
			}.bind(this));
		}.bind(this));
	},
	//IE fix
	mouseX: function (evt) {
		if (evt.pageX) return evt.pageX;
		else if (evt.clientX)
		   return evt.clientX + (document.documentElement.scrollLeft ? 
		   document.documentElement.scrollLeft :
		   document.body.scrollLeft);
		else return null;
	},
	//IE fix
	mouseY: function (evt) {
		if (evt.pageY) return evt.pageY;
		else if (evt.clientY)
   			return evt.clientY + (document.documentElement.scrollTop ?
   			document.documentElement.scrollTop :
   			document.body.scrollTop);
		else return null;
	},
	show: function (title) {
		this.tooltip = new Element('span',{
			'styles': {
				'position': 'absolute',
				'z-index': '10000',
				'background': 'url(images/tooltip_'+title+'.gif) no-repeat',
				'display': 'block',
				'width': this.width,
				'height': this.height,
				'text-indent': '-9999px'
			},
			'class':'tooltip'
		});
		this.tooltip.setText(title);
		this.tooltip.inject($(document.body));
	},
	hide: function () {
		if (this.tooltip) {
			this.tooltip.remove();
		}
	},
	updatePosition: function (x, y) {
		if (this.tooltip) {
			this.tooltip.setStyle('top', y-this.height-4);
			this.tooltip.setStyle('left', x-this.width/2);
		}
	}
})