/* Declarações globais */
/* Divs que conterão as fotos e textos a serem animados */
divs = null;

/* Divs alvo da mudança de fotos e textos */
tgts = null;

/*
**	Quantidade de fotos e de textos a serem animados. Podem ser diferentes,
** mas é melhor que a quantidade de fotos seja múltipla da quantidade de 
** imagens.
*/
quantas_imgs = document.getElementById("preload_img").getElementsByTagName("img").length;
quantos_txts = document.getElementById("preload_txt").getElementsByTagName("div").length;

/* Índice para imagens e textos */
idx = 0;


/* Animação a 25 quadros/segundo */
taxa_animacao = 25;
/* Duração de cada quadro de animação, em milissegundos */
duracao_animacao = (1000 / taxa_animacao);

/* Fator de opacidade */
opacidade = 0;
/* 99% força efeito antialias */
opacidade_maxima = 99;

/* Referência à chamada de setInterval para temporizar a animação */
intervalo = null;

function modifica_opacidade(op) {
	/* Força efeito antialias */
	if (op == 100)
		op = opacidade_maxima;

	/*
	**	Aqui, tanto para as imagens quanto para os textos, modificamos o
	** grau de opacidade das divs atual e próxima. Os graus de opacidade
	** da atual e da próxima devem ser recíprocos.
	*/
	for (var i = 0; i < divs.length; i++){
		divs[i].atual.style["opacity"] =
		divs[i].atual.style["-moz-opacity"] =
			(opacidade_maxima - op)/100;

		divs[i].atual.style["filter"] =
			"alpha(opacity=" + (opacidade_maxima - op) + ")";

		divs[i].prox.style["opacity"] =
			divs[i].prox.style["-moz-opacity"] = op/100;

		divs[i].prox.style["filter"] =
			"alpha(opacity=" + op + ")";
	}
}

function fade() {
	modifica_opacidade(opacidade)

	if (opacidade == 100)
		clearInterval(intervalo);

	/*
	**	Gradação da opacidade: 100 níveis diferentes (0 a 100%),
	** divididos pela taxa de quadros de animação.
	*/
	opacidade += 100 / taxa_animacao;

}

function troca_imagens() {
	/*
	**	Cópias das divs de fotos e textos pré-carregadas. Não pode-se usar
	** essas divs diretamente porque os nodos em excesso são removidos do
	** documento.
	*/
	divs = [
		{ /* Fotos */
			"atual" : document.getElementById("foto" + idx).cloneNode(false),
			"prox" : document.getElementById("foto" +  ((idx + 1) % quantas_imgs)).cloneNode(false)
		},
		{ /* Textos. Requer clonagem completa para incluir o nodo de texto interno à div. */
			"atual" : document.getElementById("txt" + (idx % quantos_txts)).cloneNode(true),
			"prox" : document.getElementById("txt" + ((idx + 1) % quantos_txts)).cloneNode(true)
		}
	];

	/* Valor inicial de opacidade antes da animação */
	modifica_opacidade(0);

	/* Divs alvo da mudança de fotos e textos */
	tgts = [
		{"elem" : document.getElementById("foto"), "tag": "img"},
		{"elem" : document.getElementById("txt"), "tag" :"div"}
	];
	
	for (i = 0; i < tgts.length; i++ ) {
		/* Insere os dois nodos no final da div alvo */
		tgts[i].elem.appendChild(divs[i].atual);
		tgts[i].elem.appendChild(divs[i].prox);

		/* Remove os nodos em excesso que sobraram no início da div alvo */
		while (tgts[i].elem.getElementsByTagName(tgts[i].tag).length > 2) 
			tgts[i].elem.removeChild(tgts[i].elem.getElementsByTagName(tgts[i].tag)[0]);
	}

	/*
	** Duração de um quadro de animação à taxa de 25 quadros por segundo.
	** Unidade de milissegundos.
	*/
	intervalo = setInterval("fade()", duracao_animacao);
}

function anima() {
//	alert("versao nova");
	clearInterval(intervalo);
	troca_imagens();

	/*
	**	Termina a animação depois de no máximo 5,5 segundos e prepara a próxima
	*/
	opacidade = 0;
	idx = (idx+1) % quantas_imgs; //, 5500
}