var MapTips = new Class({	
	initialize : function() {
		$each( $( 'map' ).getChildren( 'a' ), this.setup.bind( this ) );
	},	
	setup : function( item ) {
		var tip = this.createTip( item ).injectInside( document.body );
		item.fx = {
			show : new Fx.Morph( tip, { duration : 300 } ),
			hide : new Fx.Morph( tip, { duration : 300 } )
		}
		tip.fx = item.fx;
		this.evIt( tip ), this.evIt( item )
	},	
	evIt : function( item ) {
		item.addGreedyEvent( 'mouseover', function( e ) {
			e.target.fx.hide.cancel();
			e.target.fx.show.start({
				opacity : 1
			})
		})
		item.addGreedyEvent( 'mouseout', function( e ) {
			e.target.fx.show.cancel();
			e.target.fx.hide.start({
				opacity : 0
			});
		})
	},	
	createTip : function( item ) {
		var x = item.getProperty( 'id' ) ? parseInt( item.getProperty( 'id' ) ) : 0;
		var e = new Element( 'div', {
			'class' : 'tooltip',
			styles : {
				position : 'absolute',
				top : item.getPosition().y - 53,
				left : item.getPosition().x - 24 + x,
				opacity : 0
			}
		})
		var a = new Element( 'a', {
			'class' : 'tool-tip',
			href : item.getProperty( 'href' ),
			html : '<span>' + item.getProperty( 'alt' ) + '</span>'
		}).injectInside( e );
		return e;
	}	
})
window.addEvent( 'domready', function() {
	new MapTips();
})