var JAMenuHover = new Class({

	initialize: function(myElement) {
		options = Object.extend({
			transition: Fx.Transitions.quadOut
		}, {});
		this.myElement = $(myElement);
		if (!this.myElement) {
			alert('no menu');return;
		}
		//create hover item
		this.lihover = new Element ('li', {'class':'nav-hover'}).adopt (new Element ('span', {'class':'nav-hover-span1'}).adopt(new Element ('span', {'class':'nav-hover-span2'})));
		this.lihover.setStyles ({
			'position': 'absolute',
			'top': 0,
			'left': 0,
			'width': 0,
			'height': 30,
			'z-index': 1,
			display: 'none'
		});
		this.myElement.setStyle('position', 'relative');
		this.lihover.injectTop (this.myElement);
		this.fx = new Fx.Styles (this.lihover, {duration: 800, transition: Fx.Transitions.Back.easeInOut, 
												onComplete: 
													function(){
														if (this.lihover.getStyle('width').toInt() < 10) 
															this.lihover.setStyle('display', 'none');
													}.bind(this)
												}
		);
		this.ulcoor = this.myElement.getCoordinates ();
		this.myElement.getChildren().each (function(li){
			if (li != this.lihover) {
				li.setStyles ({
					'position': 'relative',
					'z-index': 2
				});
				if (li.hasClass('active')) {
					var licoor = li.getCoordinates ();
					this.hvleft = licoor.left - this.ulcoor.left;
					this.hvwidth = licoor.width;
					this.lihover.setStyles ({'left': this.hvleft, 'width': this.hvwidth, 'display': 'block'});
				} else {			
					li.addEvent('mouseenter', function (){
						this.lihover.setStyle('display', 'block');
						this.fx.stop();
						var licoor = li.getCoordinates ();
						
						this.fx.start({
							'left': licoor.left - this.ulcoor.left,
							'width':licoor.width
						});
						//console.log ('in: '+this.lihover.getStyle('left').toInt()+', ' + (licoor.left - ulcoor.left));
					}.bind(this));
					
					li.addEvent('mouseleave', function (){
						this.fx.stop();
						var hvcoor = this.lihover.getCoordinates ();
						this.fx.start({
							'left': this.hvleft,
							'width':this.hvwidth
						});
						//console.log ('out: '+this.lihover.getStyle('left').toInt());
					}.bind(this));
				}
			}
		}, this);
	}
});

window.addEvent('load', function(){
var menu = $E('#ja-splitmenu ul');
if (!menu) menu = $('ja-cssmenu');
if (menu) new JAMenuHover (menu);
});