// JavaScript Document

$(document).ready(function () {
	var elm = $("#mainMenu .wrapper ul li a.active");
	var position = elm.position();
        
	if (position != null) {
		position = parseInt(position.left) + parseInt(elm.width())/2 -7 + "px";
		$("#mainMenu .wrapper").append('<div id="menuArrow"></div>');
		$("#menuArrow").css({"left" : position, "top" : "35px"});
		$("#mainMenu ul li a").hover(
			function () {
				var newPos = $(this).position();
				newPos = parseInt(newPos.left) + parseInt($(this).width())/2 -7 + "px";
				$("#menuArrow").animate({"left" : newPos}, {duration: 'slow', queue: false});
			},
			function () {}
		);
		$("#mainMenu ul").hover(
			function (){},
			function () {
				$("#menuArrow").animate({"left" : position}, {duration: 'slow', queue: false});
			}
		);
	}
	else {
		position = 0;
		$("#mainMenu .wrapper").append('<div id="menuArrow" style="display: none; top: 35px"></div>');
		$("#mainMenu ul li a").hover(
			function () {
				var newPos = $(this).position();
				newPos = parseInt(newPos.left) + parseInt($(this).width())/2 -7 + "px";
				$("#menuArrow").animate({"left" : newPos}, {duration: 'slow', queue: false}).fadeIn();
			},
			function () {}
		);
		$("#mainMenu ul").hover(
			function (){},
			function () {
				$("#menuArrow").animate({"left" : position}, {duration: 'slow', queue: false}).fadeOut();
			}
		);
	}
});