/*
* Script para movimentar a bola abaixo dos ítens do menu
*
*/

var duracaoHover = 1000;
var duracaoLeave = 1200;
var easeHover = 'easeOutElastic';
var easeLeave = 'easeOutElastic';
var currentLink;
linkPadding = 8;//Padding da tag 'a' --fazer dinâmico, pegando a propriedade direto da tag
var widthInicial;
var leftInicial;
var altura;
var topInicial;

$(document).ready(function () {

	//cria a imagem "bola" e insere no div #header
	$("#masthead").append("<img id='bola'/>")
	//seta as propriedades da imagem
	bola = $("#bola");

	bola.attr("src", "wp-content/themes/netsoft/images/bolaVermelha.png");

	//Pega a posição do link(tag 'a' dentro da tag 'li'...)
	currentLink = $("div.menu-header li.current_page_item a");

	//pega a largura do link
	widthInicial = Math.round( currentLink.outerWidth() );

	atualizaPosicaoBola();

	$(window).resize(atualizaPosicaoBola);

	$("div.menu-header li a").hover( function(){

		var currentWidth = Math.round( $(this).width() );
		var currentLeft = Math.round( $(this).offset().left + currentWidth/2 + linkPadding );
		$("#bola").stop().animate({left: currentLeft},{duration: duracaoHover, easing: easeHover, queue: false});

	});

	$("div.menu-header li a").mouseleave(function () {

		bola.stop(false, false).animate(
									{left: leftInicial},
									{duration: duracaoLeave, easing: easeLeave, queue: false});

	});

	$("div.menu-header li a").click( function(){

		var currentWidth = Math.round( $(this).width() );
		var currentLeft = Math.round( $(this).offset().left + currentWidth/2 + linkPadding  );
		leftInicial = currentLeft;
		$("#bola").css({left: currentLeft});

	});

});



function atualizaPosicaoBola(){

	//pega coordenadas para setar a posição iniciao da bola
	leftInicial = Math.round( currentLink.offset().left + widthInicial/2 - linkPadding/2 );
	altura = Math.round( $("div.menu-header li").height() );
	topInicial = Math.round( currentLink.offset().top + altura - 5);

	//seta a posição iniciao da bola
	bola.css( {
		left: leftInicial,
		top: topInicial
		});

}