/**
 * Mootools External Functions Javascript Document
 * Contains code to run the nav arrow slider for the site navigation
 *
 * Copyright Richard Westenra 2009
 */

/* MooTools NavArrow Slider */
var navArrowSlider = function(navWrap, navElementsArray, activeID, arrowX) {
	var youAreHere = new Fx.Tween($(navWrap), { 
		duration: 700,
		transition: Fx.Transitions.Back.easeOut 
	});
	
	// handle the positioning of the slider on x and y axis when hovering
	$$(navElementsArray).each(function(item){  
		item.addEvent('mouseenter', function() { 
			var thisPos = item.getPosition(navWrap).y  + item.getSize().y - 16; 
			youAreHere.cancel();
			youAreHere.start('background-position', arrowX + 375 + 'px ' + thisPos + 'px'); 
		});
	});
	
	//set arrow position when not hovered
	var currentArrow = function() {
		youAreHere.cancel();
		var activePos = $(activeID).getPosition(navWrap).y  + $(activeID).getSize().y - 16; 
		youAreHere.start('background-position', arrowX + 375 + 'px ' + activePos + 'px');      
	};
	 
	//correct IE rendering problem (without this, it won't go to the active nav onload)
	var activePos = $(activeID).getPosition(navWrap).y  + $(activeID).getSize().y - 20;  
	$(navWrap).setStyle('background-position', 489 + 'px ' + -20 + 'px');       
	
	//works to set image to starting position in other browsers
	currentArrow(); 
	
	$$(navElementsArray).each(function(item){
		item.addEvent('mouseleave', currentArrow);
	});
};