/*TODO: Look into using dojox.fx.style and using classes*/
dojo.addOnLoad(function()
{
	dojo.query("#mainNavigation li.inactive").forEach(function(node){
		dojo.connect(node, 'onmouseover', function(event){
			targetNode = event.target;
			if(targetNode.nodeName == "LI")
			{
				targetNode = targetNode.firstChild;
			}
			
			dojo.animateProperty({
				node: targetNode,
				duration: 500,
				properties:{
				backgroundColor: function(node){
					return { start:"#464646", end:"#E3E3E3" }
				},
				color: function(node){
					return { start:"#A9A9A9", end:"#CC0000" }
			   		}
				}
			}).play();
			event.stopPropagation();
		});
		
		dojo.connect(node, 'onmouseleave', function(event){
			targetNode = event.target;
			if(targetNode.nodeName == "LI")
			{
				targetNode = targetNode.firstChild;
			}
			
			dojo.animateProperty({
				node: targetNode,
				duration: 1000,
				properties:{
					backgroundColor: function(node){
						return { start:"#E3E3E3", end:"#464646" }
					},
					color: function(node){
						return { start:"#CC0000", end:"#A9A9A9" }
			      	}
				}
			}).play();
			event.stopPropagation();
		});
	});
});