//configs banner
//localizaçao das tags
var carrossel= "#destaques a";
var paginacao= "#destaques .inf .right ul li a";
var div_paginacao= "#destaques .inf .right";
var titulo= "#destaques .inf .left .nome";
var subtitulo= "#destaques .inf .left .desc";

//parâmetros da animaçao
var duracao_animacao= 1000;
var intervalo_animacao= 5000;

//textos
var arr_titulo= new Array();
var arr_sub_titulo= new Array();

//quantidade de fotos
var qtde;

//largura das imagens do banner
var width;
	
//propriedade css left da div carrossel
var val_left_atual;

function mudaDadosBanner(){
	
	val_left_atual= Math.abs($(carrossel).css("left").substr(0, ($(carrossel).css("left").length-2)));
	var pagina_atual;
			
	$(paginacao).parent().removeClass("ativo");
	
	$(paginacao).each(function(){
		if($(this).html() == ((val_left_atual/width)+1)){
			$(this).parent().addClass("ativo");
			pagina_atual= $(this).html();
		}
	});
	
	$(titulo).html(arr_titulo[pagina_atual]);
	$(subtitulo).html(arr_sub_titulo[pagina_atual]);
}
function moveBanner(val, duracao){
	$(carrossel).animate({
		left: val
	}, duracao, function(){
		//depois de fazer a animaçao, altera a paginaçao e titulo/subtitulo
		mudaDadosBanner();
	});
}
function animacaoBanner(pular_para){
	
	if(pular_para){
	
		moveBanner(-((pular_para-1)*width), duracao_animacao);
		return false;
	
	}else{
	
		var intervalo= window.setInterval(function(){
			//paga left atual e retira os 2 ultimos caracteres(pt ou px)
			val_left_atual= $(carrossel).css("left").substr(0, ($(carrossel).css("left").length-2));
			
			moveBanner('-='+width, duracao_animacao);
			
			if(val_left_atual <= -((qtde-1)*width)){
				//volta banner para o início sem animaçao
				moveBanner('0', 0);
			}
			
		}, intervalo_animacao);
		
		return intervalo;
	}		
}

function iniciaBanner() {
	
	//quantidade de fotos
	qtde= $(carrossel+" img").size();
	
	//pego largura da primeira já que todas tem mesma largura
	width = $(carrossel+" img:first").css("width").substr(0, ($(carrossel+" img:first").css("width").length-2));
	
	//seta largura da div carrossel para que as imagens fiquem uma do lado da outra
	$(carrossel).css("width", ((qtde+1)*width));
	
	//Define textos para os banners
	var cont= 1;
	$(carrossel+" img").each(function(){
		arr_aux= $(this).attr("alt").split("/");
		arr_titulo[cont]= arr_aux[0];
		arr_sub_titulo[cont]= arr_aux[1];
		cont++; 
	});
	
	//duplica a primeira imagem inserindo ao final para fazer efeito cíclico
	$(carrossel+" img:first").clone().appendTo(carrossel);
		
	//insere paginaçao
	$("<ul></ul>").appendTo(div_paginacao);
	for(i=1; i<=qtde; i++){
		$("<li><a href=\"javascript:void(0);\">"+i+"</a></li>").appendTo(div_paginacao+" ul");
	}
	//número 1 é ativo no início
	$(div_paginacao+" ul li:first").addClass("ativo");
	
	
	//titulo e subtitulo iniciais
	//sao os da primeira imagem
	$(titulo).html(arr_titulo[1]);
	$(subtitulo).html(arr_sub_titulo[1]);
		
	//inicia a animaçao
	var anima= animacaoBanner(false);
	
	//mouse em cima para a animaçao
	$("#banner").mouseenter(function(){
		clearInterval(anima);		
	});
	
	//mouse fora reinicia a animaçao
	$("#banner").mouseleave(function(){
		anima= animacaoBanner(false);	
	});
	
	//clicando no número pula para o respectivo banner
	$("#banner div.texto div.paginacao ul li a").click(function(){
		animacaoBanner($(this).html());
	});
}
