$(document).ready(function()
{
	var randImagem = Math.floor(Math.random()*4);
	var imgArquivo = "img/fundo/images_0"+randImagem+"/fundo_";
	var cols = 10; // Quantidade de colunas
	var lins = 10; // Quantidade de linhas
	var imgLarg = 192; //Define a largura da imagem
	var imgAlt = 108; // Define a altura da imagem
	var telaLarg = $(window).width(); // Pega a largura da tela
	var telaAlt = $(window).height(); // Pega a altura da tela
	var tempoFade = 50; // Tempo do efeito FadeIn
	var quadroAtual = 0;
	var xPos = 0;
	var yPos = 0;	

	// ---------- Definindo tamanho da tela para criar array de quadros
	var imgQuadro = new Array();
	var extQuadro = new Array();
	var colunasExibir = Math.ceil(telaLarg / imgLarg)+1;
	var linhasExibir = Math.ceil(telaAlt / imgAlt)+1;
	var mr, st, ctCols, ctLins;
	mr = 1;
	st = cols - colunasExibir;
	for (ctLins=1;ctLins<=lins;ctLins++)
	{
		for(ctCols=1;ctCols<=cols;ctCols++)
		{
			// Filtra as imagens que cobrem a área da tela...
			(ctCols < colunasExibir && ctLins < linhasExibir)?imgQuadro.push(mr):extQuadro.push(mr);
			mr++;
		}
	}
	
	// Coloca a lista em ordem aleatória
	imgQuadro.sort(random_sort);
	extQuadro.sort(random_sort);
	// Une as duas listas
	$.merge(imgQuadro, extQuadro);	


	// Inicia o processo de mostgragem
	inserirQuadro();

	// Inserir na tela
	function inserirQuadro()
	{
		xPos = (((imgQuadro[quadroAtual] % cols == 0)?cols:imgQuadro[quadroAtual] % cols)-1) * imgLarg;
		yPos = Math.floor((imgQuadro[quadroAtual] -1)/ lins) * imgAlt;
		
		var quadro = $("<div class='quadro' style='left: "+xPos+"px; top: "+yPos+"px; z-index: -1;'></div>");
		var img = $("<img src='"+imgArquivo+pad2(imgQuadro[quadroAtual])+".jpg' width='"+imgLarg+"' height='"+imgAlt+"' />").hide();

		quadro.append(img);
		$('body').append(quadro);
		
		quadroAtual++;
		
		// Posicionamentos
		xPos += imgLarg;
		if ((quadroAtual-1)%cols == 0) {
			xPos = 0;
			yPos += imgAlt;
		}
		// bind para quando a função terminar de ser carregada
		img.bind("load", function() {
			mostrarFade(quadro, img);
		});
	}
	
	
	// Mostrar com fade
	function mostrarFade(obj, obj2)
	{
		// Mostra o Div com fundo branco
		obj.css("display", "block");
		// Executa o FadeIn na imagem
		obj2.fadeIn(tempoFade, function() { if (quadroAtual < (cols * lins) ) { inserirQuadro(); } });
	}
	
	// Numero com 2 digitos no mínimo
	function pad2(number) {
     	return (number < 10 ? '0' : '') + number;
	}
	// Ordenar aleatório
		function random_sort(data_A, data_B)
	{
		return 0.5 - Math.random();
	}
});
