// JavaScript Document

window.addEvent('domready', function(){
	
	var wrap = "#loopMenu";
	var navElements = "#loopMenu ul li a";
	
	//create the fx object for the nav wrapper
	var fx = new Fx.Morph($('loopMenuIndicator'), {
		duration:300, 
		wait:false, 
		transition: Fx.Transitions.Cubic.easeOut
	});
	
	var revert = function(){
		var info = $('loopMenuCurrent').getCoordinates();
		var wrap = $('loopMenu').getCoordinates();
		var pos = wrap.left - info.left;
		
		pos = pos * -1;
		//var fx = new Fx.Styles(item, {duration:400, wait:false});
		fx.start({
			'margin-left': pos,
			'width': info.width
		});
	}
	
	//foreach of the items in the menu
	$$(navElements).each(function(item){
		item.addEvent('mouseenter', function(){
			var info = item.getCoordinates();
			var wrap = $('loopMenu').getCoordinates();
			var pos = wrap.left - info.left;
			
			pos = pos * -1;
			//var fx = new Fx.Styles(item, {duration:400, wait:false});
			fx.start({
				'margin-left': pos,
				'width': info.width
			});
		});
	});

	$('loopMenu').addEvent('mouseleave', function(){
		revert();
	});

	var startFlag = 0;
	var start = function(){
		
		if($('loopMenuCurrent')){
			var info = $('loopMenuCurrent').getCoordinates();
		}else{
			var info = $('loopMenu').getCoordinates();
		}
		var wrap = $('loopMenu').getCoordinates();
		var pos = wrap.left - info.left;
		
		//alert(pos);
		
		pos = pos * -1;
		
		document.getElementById('loopMenuIndicator').style.marginLeft = pos+"px";
		document.getElementById('loopMenuIndicator').style.width = info.width+"px";
		
		if(startFlag == 0){
			startFlag = 1;
			setTimeout(start,250);	
		}
	}

	start();

/*
	var currentArrow = function() {
		fx.cancel();
		var activePos = $(activeID).getPosition(wrap).x  + $(activeID).getSize().x - leftOffset;
		youAreHere.start('background-position', activePos + 'px ' + arrowY + 'px');
	};
*/

});
