var quantidadeFotos = [20, 16, 53, 0];
var nomeMenu = ['Banheiros', 'Ambientes', 'Mobiliário'];
var modoFoto = ['retrato', 'retrato', 'retrato'];
var captionImage = [
                    '',
                    '',
                    ];



/************************ RENDER HTML ******************************/

function createGalery(){
	
	var elementDiv = document.getElementById('tabsC');
	var html = '<ul>';
	for(var i = 0; i < nomeMenu.length ; i++  ){
		html = html + '<li><a href="javascript:void(0);" onclick="createPhotoGalery(\''+ nomeMenu[i] +'\');" title= "' + nomeMenu[i] + '"><span>' + nomeMenu[i] + '</span></a></li>';				
	}
	html = html + '</ul><br/><br/>';
		
	//Criar photoGalery com o primeiro elemento do nomeMenu[]
	if(nomeMenu.length > 0){
		createPhotoGalery(nomeMenu[0]);
	}
	
	elementDiv.innerHTML = html;
	
}

function createPhotoGalery(menuName, divNameRender){
	var elementDiv = document.getElementById(divNameRender);
	var width = 0;
	var heigth = 0;
	var html = "";
	html += '<table align="center" cellpadding="20px" cellspacing="20px">';
	var countTr = 0;
	for(var i = 0; i < nomeMenu.length ; i++  ){
		if(nomeMenu[i] == menuName){	
			for(var j = 1; j <= quantidadeFotos[i]; j++){
				countTr++;
				if(countTr == 1){
					html += '<tr>';
				}
				
				if(modoFoto[i] == 'paisagem'){
					width = 200;
					height = 150;
				} else if(modoFoto[i] == 'retrato'){
					width = 150;
					height = 200;
				}
				
				html += '<td>';
				html += '<a href="imagens/'+ nomeMenu[i] + '/' + nomeMenu[i] + j + '.jpg" class="highslide" onclick="return hs.expand(this)" >'; 
				html += '<img id="imagem' + j + '" src="imagens/' + nomeMenu[i] + '/tn_' + nomeMenu[i] + j + '.jpg" alt="Carregando..."  title="Click para visualizar" width="' + width + '" height="' +  height + '" />';  
				html += '</a>';
				//html += '<div class="highslide-caption">  Caption for the image. </div>';
				html += '</td>';
				
				if(countTr == 5){
					html += '</tr>';
					countTr = 0;
				}
			}
			break;
		}
	}
	if(quantidadeFotos.length < 5){
		html += '</tr>';
	}
	html += '</table>';
	
	html += '<div id="' + divNameRender + '_pagination" align="center" style="text-align:center;"></div>';
	
	elementDiv.innerHTML = html;
	
	//Criar paginação
	$('div#' + divNameRender + ' table tr' ).quickpaginate(
			{	nextWord: "Próximo",
				prevWord: "Anterior",
				perpage: 2,  //2 linhas de imagens por pagina
				pager:$('#' + divNameRender + '_pagination')
			
			} ); 
}

function loadHomePage(){
	requestAjaxPage('home.php', 'conteudo');
}

function loadGaleryPage(){
	requestAjaxPage( 'galery.php' , 'conteudo');
}

function requestAjaxPage(url, divResult){
	printAjaxLoader(divResult);
	$.ajax({
	  url: url,
	  cache: false,
	  success: function(html){
	    //$(divResult).innerHTML = html;
		$('#' + divResult).html(html);	    
	  }
	});

}

function printAjaxLoader(divResult){
	var html = '<div>';
		html += '<img src="imagens/aplicacao/ajax-loader.gif" title="Carregando..." alt="Carregando..." />'
	html += '</div>';
	$('#' + divResult).html(html);	
}