var siteMarginTop = 0;
var menuTopHeight = 60;
var siteXml;
var scrollMax = 0;
var menuIndex = 0;
var disableScrollListener = false;
var intervalId;
var miniMode = false;

//var projectIndex = 1;
//var sectionIndex = 2;

var menuIndex = 1;
var menuBgIndex = 1;
//-----------------------------------
$(document).ready(function(){
	document.body.style.visibility='hidden';
	document.getElementById("content").innerHTML = "";
	
	$.get('xml/site.xml', function(data){
		siteXml = data;
		//init
		$('link[rel*=style]').each(function() {
         	$(this).attr('rel', 'stylesheet');
    	});
		
		var sections = buildSectionTpl(siteXml, "WEBSITE",2, projectIndex) +
					   buildSectionVideoTpl(siteXml, "MOVIE",3, projectIndex) +
					   buildSectionTpl(siteXml, "CAMPAIGN",4, projectIndex) +
					   buildSectionTpl(siteXml, "PRINT",5, projectIndex) +
					   buildSectionTpl(siteXml, "PHOTO",6, projectIndex, true);
					   		   	   
		$("#content").html(startTpl + sections + endTpl);
		//
		$(".menu .boton-2").data("section", "WEBSITE");
		$(".menu .boton-3").data("section", "MOVIE");
		$(".menu .boton-4").data("section", "CAMPAIGN");
		$(".menu .boton-5").data("section", "PRINT");
		$(".menu .boton-6").data("section", "PHOTO");
		//
		$(".menu a").each(function(index){
			$(this).data("order", index);
		});
		
		$(".logo").click(function(){
			$($(".menu a").get(0)).click();
			return false;					  
		});
		//fin init
		$(".menu a").click(function(e){
			if($(this).hasClass("music")) return true;
			disableScrollListener = true;
			clearInterval(intervalId);
			var h;
			$this = $(this);
			$li = $this.offsetParent().offsetParent();
			var order = parseInt($(this).data("order"));
			menuIndex = order;
			//alert(h);
			//alert($(this).data("order"));
			elmName = "#" + this.href.split("#")[1];
			var top = Math.round($(elmName).offset().top) - siteMarginTop;
			var section = $(this).data("section");
			var projectsLengh = getSectionProjects(siteXml, section).length;
			if(projectsLengh == 0){
				$(".menu").stop().animate(
					{height:560}, 1500
				);		
				$(".pie").css(
					{top:"622px"}
				);		
			}else if(projectsLengh > 10) {
				$(".menu").stop().animate(
					{height:560}, 1500
				);	
				$(".pie").css(
					{top:"622px"}
				);		
			}else{
				$(".menu").stop().animate(
					{height:500}, 1500
				);
				$(".pie").css(
					{top:"565px"}
				);		
			}
			//alert(section + " - " +getSectionProjects(siteXml, section).length);
			$("body, html").stop().animate(
				{scrollTop:top}, 1500, function(){
					disableScrollListener = false;
					//trace("stop");
				}
			);
			//
			$("#menuDot").stop().animate(
				{"top":27*order+4}, 1200
				);
			//
			$(".menu li").removeClass("activo");
			$($(".menu li").get(order)).addClass("activo");
			//alert("scroll");
			e.preventDefault();
			return false;
		});
	
	//VISOR
		$(".seccion").each(function(index){
			var $a = $(".selector ul a", this);
			var $img = $(".imgMain", this);
			////trace($img.length);
			var $loader = $(".imgLoader", this);
			var $title = $(".imgLoader", this);
			var section = this;
			
			$a.click(function(){
				$a.removeClass("activo");		  
			});
			
			var aLength = $a.length;
			var g = new Gallery(section);
			
			$a.each(function(index){
				var is = new ImageSwitcher($(this), section, index, aLength, g);

			});
			
			var next = $("#nextPic", section);
			var prev = $("#prevPic", section);
			
			if(aLength < 2){
				next.css("display","none");
				prev.css("display","none");
			}
			$img.load(function(){
				$loader.hide();
				$(this).animate({ 
       				opacity: 1
				}, 500, function(){
					next.css("visibility", "visible");
					prev.css("visibility", "visible");				
				});
			});
			
			var $projectsA =  $(".galeria a", this);
			$projectsA.click(function(){
				$projectsA.removeClass("activo");		  
			});
			
			if(index == sectionIndex-1){
				$projectsA.removeClass("activo");
				$($projectsA.get(projectIndex)).addClass("activo");
			}
			
			$projectsA.each(function(index){
				var ps = new ProjectSwitcher(section, $(this), g);
				if(index == 0) ps.setSharers();
			});
		});
		
		$(".fbSharer").each(function(){
				$(this).click(function(){
					Popup.open({url:this.href, height:400});
					return false;
				});				 
		});
		
//Popup CONTACT
		$("a[rel='popup']").each(function(){
				$(this).click(function(){
					//alert(this.href);
					Popup.open({url:this.href, height:495, width:495});
					return false;
				});
		});
		
		//SCROLL LISTENER
		var scrollCont = 0;
		$(window).scroll(function(e){
			var htmlTop = $(window).scrollTop();
			//$("#debug").html("scroll " + scrollCont + " - " + htmlTop);
			scrollCont++;
			if(disableScrollListener) return;
			if(intervalId) clearInterval(intervalId);
			if(!miniMode)intervalId = setInterval("checkScroll()", 1600);
			var seccion = 0;
			$(".seccion").each(function(index){
				if(htmlTop+280 > ($(this).offset().top-siteMarginTop)){
					seccion = index;	
				}
				
				if(seccion != menuIndex){
					$("#menuDot").stop().animate(
						{"top":27*seccion+4}, 500
					);
					$(".menu li").removeClass("activo");
					$($(".menu li").get(seccion)).addClass("activo");
					menuIndex = seccion;
				}
				////trace("secction " + index + " - top:" + $(this).offset().top);			
			});
			
			////trace(htmlTop + " seccion actual:" + seccion+ " - menuIndex:" + menuIndex);
		});
		
		$(window).resize(function(){
			checkViewport();
			centrar();
			////trace("VIEWPORT HEIGHT:" + $(window).height());
		});
		//trace("VIEWPORT HEIGHT:" + $(window).height());
		checkViewport();
		centrar();
		//
		//salto directo
		$("body, html").stop().animate({scrollTop:0}, 0);
		var sectionTop = $("#seccion-"+(sectionIndex)).offset().top;
		 setTimeout("setScrollFromParams()", 500); //cuidado con el tiempo de chequeo
		setMenu();
		setInterval("changeMenu()", 120000);
		
		gapi.plusone.go("content");
	});
});

function changeMenu(){
	$(".menu ul").animate({opacity:0},400, changeMenuCallback);
}

function randomFromTo(from, to){
       return Math.floor(Math.random() * (to - from + 1) + from);
}

function changeMenuCallback(){
	setMenu();
	setTimeout("showMenu()", 500);
}


function setMenu(){
	var r = randomFromTo(1, 8);
	while(menuBgIndex == r){
		r = randomFromTo(1, 8);
	};
	var t = "";
	if(r > 1){
		t = r;	
	}
	menuBgIndex = r;
	$(".menu ul li h2 a").css("backgroundImage", "url(img/interface/menu" + t + ".gif)");
}

function showMenu(){

	$(".menu ul").animate({opacity:1}, 400);
}


function checkScroll(){
	//trace("CHECK SCROLL " + menuIndex);
	clearInterval(intervalId);
	//$($(".menu a").get(menuIndex)).click();
	
	var section = $($(".menu a").get(menuIndex)).data("section");
	var projectsLengh = getSectionProjects(siteXml, section).length;
		if(projectsLengh == 0){
			$(".menu").stop().animate(
				{height:560}, 500
			);		
			$(".pie").css(
				{top:"622px"}
			);		
		}else if(projectsLengh > 10) {
			$(".menu").stop().animate(
				{height:560}, 500
			);	
			$(".pie").css(
				{top:"622px"}
			);		
		}else{
			$(".menu").stop().animate(
				{height:500}, 500
			);
			$(".pie").css(
				{top:"565px"}
			);		
		}
		
		var elmName = "#" + $(".menu a").get(menuIndex).href.split("#")[1];
		var top = Math.round($(elmName).offset().top) - siteMarginTop;

		$("body, html").stop().animate(
			{scrollTop:top}, 500, function(){
				disableScrollListener = false;
				//trace("stop");
			}
		);
}

function setScrollFromParams(){
	var mIndex = sectionIndex - 1;
	//trace("CHECK SCROLL PARAMS " + mIndex);
	clearInterval(intervalId);
	//$($(".menu a").get(menuIndex)).click();
	
	var section = $($(".menu a").get(mIndex)).data("section");
	var projectsLengh = getSectionProjects(siteXml, section).length;
		if(projectsLengh == 0){
			$(".menu").stop().animate(
				{height:560}, 0
			);		
			$(".pie").css(
				{top:"622px"}
			);		
		}else if(projectsLengh > 10) {
			$(".menu").stop().animate(
				{height:560}, 0
			);	
			$(".pie").css(
				{top:"622px"}
			);		
		}else{
			$(".menu").stop().animate(
				{height:500}, 0
			);
			$(".pie").css(
				{top:"565px"}
			);		
		}
		
		var elmName = "#" + $(".menu a").get(mIndex).href.split("#")[1];
		var top = Math.round($(elmName).offset().top) - Math.round(siteMarginTop);
		//alert(top + ", elmName:"+ Math.round($(elmName).offset().top) + ", siteMargin:"+ siteMarginTop);
		//top = 1380;
		$("body, html").stop().animate(
			{scrollTop:top}, 0, function(){
				disableScrollListener = false;
				//trace("stop");
			}
		);
		$("body").css("visibility","visible");
		//$("body").css("display","block");
}

function trace(value){
	//if(window.console) window.console.log(value);
}

function centrar (){
		var alto_contenido = 646;
		var ancho_contenido = 845;
		ancho = $(window).width();
		alto = $(window).height();

		//posicion top
		var posicion_top = (alto/2)-(alto_contenido/2);
		if(posicion_top < 0){
			posicion_top = 0;
		}
		$(".contenedor1").css('top',posicion_top);
		siteMarginTop = posicion_top+menuTopHeight;
		$(".contenedor2").css("padding-top", (posicion_top+menuTopHeight) + "px");
		$("#seccionFinal").css("height", (posicion_top+menuTopHeight-35) + "px");
		if(posicion_top == 0){
			$("#seccionFinal").css("height", 0 + "px");
		}
		//posicion left
		var posicion_left = (ancho/2)-(ancho_contenido/2);
		if(posicion_left < 0){
			var posicion_left = 0;
		}
		
		$(".contenedor1").css('left',posicion_left + 'px');
		//trace("top: "+ posicion_top);	
		////trace("CENTRAR-> scroll h:" + $(".contenido").height()+"/"+ $(".seccion").height() + " - scrollTop:" + $(window).scrollTop()+ " - body.height:" + $("body").height() + " - siteMarginTop:"+ siteMarginTop + " - scrollMax:"+scrollMax);	
}

function checkViewport(){
 	var h = $(window).height();
	if(h<620){
		$("li.boton-site").css("display", "block");
		$(".menu_superior").css("display", "none");
		menuTopHeight = 10;
		$(".menu").css("top", menuTopHeight);
		if(h<560){
			miniMode = true;
			clearInterval(intervalId);
		}else{
			miniMode = false;	
		}
	}else{
		$("li.boton-site").css("display", "none");	
		$(".menu_superior").css("display", "block");
		menuTopHeight = 60;
		$(".menu").css("top", menuTopHeight);
		miniMode = false;	
	}
}
	
