var json;
var slideShowId;
var slideShowElement;
var slideShowIdx;
var slideShowTotal;
var interval;


$(document).ready(function () {
	
		$("#"+menuID).addClass("selected");
	
		$.getJSON(jsonUrl, function(data){
			json = data;
			param=$.url().param('p');
			if(param!=null) {
				showProject(param);
			} else {
				showBoxes();
			}		
		});
     });



// render das boxes de projectos e events para os links (slideshow)
function showBoxes(){
	$(".projectNav").hide();
	$(".content").hide();
	$.each(json.home, function(i,item){
		$(".content").append(fillBox(item, i));
	});
	$(".content").append('<footer>Copyright &copy; Prote&iacute;na Design 2011</footer>');
	$(".content").fadeIn();
	
	$(".box a").hover(
  		function () {
			slideShowElement = $(this).parent();
			slideShowId= $(this).parent().attr("id"); 
			slideShowIdx = 0;
			slideShowTotal = json.home[slideShowId].thumbs.length;
			if(slideShowTotal>1){
				thumbSlideShow();
				interval = setInterval('thumbSlideShow()', 1000);
			}
 		 },
  		function () {
    		slideShowIdx=0;
			clearInterval(interval);
			$(this).parent().find("img").attr("src",'images/projectos/thumbs/'+json.home[$(this).parent().attr("id")].thumbs[0].img).show();
			
			 
			 
  		}
		
		
	);
}

// funcao generica para swap de imgs
$.fn.swapImg = function( src ) {
        	var $img = this;
        	//var actions = 2;
			$img.hide();
        	//$img.fadeTo( 200, 0.0, function() {
			 var img = $('<img src="' + src + '" />').load(next);
			//	} );
			
        	function next() {
            		$img.show();
            		$img.attr({ src: src});//.fadeTo( 200, 1.0 );
					return;
        	}
    	};

// slideshowthumbs
function thumbSlideShow() {
	if (slideShowIdx<slideShowTotal-1){
		slideShowIdx++;
	} else {
		slideShowIdx=0;	
		}
	$(slideShowElement).find("img").swapImg('images/projectos/thumbs/'+json.home[slideShowId].thumbs[slideShowIdx].img);
}

// mostrar projecto
function showProject(idx){
	$(".content").hide();
	$(".content").html(fillProject(json.home[idx], idx));
	$(".content").append('<footer>Copyright &copy; Prote&iacute;na Design 2011</footer>');
	$(".content").fadeIn();	
	$(".projectNav").show(); 
}
		
function fillBox(data, i) {
	// boxes dos projectos
	
	boxHtml ="<div class='box' id='"+i+"'>";
	boxHtml +="<a class='image' href='?p="+i+"#"+data.titulo.replace(/\s/g, '_')+"'>";
	boxHtml +="<img src='images/projectos/thumbs/"+data.thumbs[0].img+"' width='200' height='135' alt='"+data.titulo+"' border='0'></a>";
    boxHtml +="<a href='?p="+i+"#"+data.titulo.replace(/\s/g, '_')+"' class='boxTitle'>"+data.titulo+"</a>";
   	boxHtml +=data.descricao;
   	boxHtml +="</div>";
	return boxHtml;
}
		
function fillProject(data, i){
	
	// botoes menu, next e previous 
	prevIdx = i*1-1;
	nextIdx = i*1+1;

	if (i<json.home.length-1) {
		$(".nextBtn").show();
		$(".nextBtn").attr("href", "?p="+nextIdx+"#"+data.titulo.replace(/\s/g, '_'));
	} else {
		$(".nextBtn").hide();
	}
	
	if (i>0){
		$(".prevBtn").show();
		$(".prevBtn").attr("href", "?p="+prevIdx+"#"+data.titulo.replace(/\s/g, '_'));
	} else {
		$(".prevBtn").hide();
	}
	
	$(".menuBtn").attr("href", homeUrl);
	
	/// conteudo pagina
	projectHtml = '<div class="project">';
	projectHtml += '<h1>'+data.evento+'</h1>';
	projectHtml += '<h2>';
	//if (data.cliente!=""){	projectHtml += data.cliente+'<br/>';}
	if (data.evento!=""){	projectHtml += data.cliente+'<br/>';}
	if (data.trabalho!=""){	projectHtml += data.trabalho+'<br/>';}
	if (data.date!=""){		projectHtml += data.date;}
	projectHtml += '</h2>';
    projectHtml += data.texto;
	
    // imagens dos projectos		
	$.each(data.imgs, function(i,item){
   		projectHtml += '<img src="images/projectos/'+item.img+'" />';
	});
			
    projectHtml +='</div>';
	return projectHtml;
}