// JavaScript Document
// Celis Design Functions

function buildSlides(projectID) {
		
$.getJSON('php/stills.php?ID='+projectID+'', initializeCycle);

function initializeCycle(slides) {
		
		var projectPath = slides.path[0];
 		var $slideshow = $('#stills'+projectID+'');
		
		for(j=0; j<slides.still.length; j++) {
		
		   	$slideshow.append('<img src="projects/'+projectPath+'/stills/'+slides.still[j]+'" />');

		}
		
	$('#stills'+projectID+'').cycle({ 
    fx:'scrollHorz', 
    timeout: 0, 
	speed:600,
	delay:2000,
	next:'#stills'+projectID+'',
	pager:'#stillnav'+projectID+'',
	
	pagerAnchorBuilder: function(idx, slide) { 
	
	
		if(idx == slides.still.length-1) {
			
			$('#loader'+projectID+'').fadeTo("slow", 0);

		}
	
        // return selector string for existing anchor 
        return '#stillnav'+projectID+' li:eq(' + idx + ') a'; 

			} 
	

		});		
	
	}		
}


//Document ready functions

$(function() {

//scrollTo offset
var downOffset = 562;
var upOffset = -834;

//won't work w/hide()
$('#portfolio').fadeTo("fast", 0);	


//Hide then fade landing images
$('.landing-image, .landing-thumb').hide();

(function showNext(jq){
    jq.eq(0).fadeIn("fast", function(){
        (jq=jq.slice(1)).length && showNext(jq);
		
    });
	
	
})($('.landing-image, .landing-thumb'));

//Build the initial projects on first run so that we don't have to rely on lazy load to trigger the cycle;
//monitors with higher resolution might register early projects as already loaded and
//consequently not trigger the cycle build jquery.lazyload.custom.js line 82
function buildFeatured(cyclesArray) {
	
	for(n in cyclesArray) {
		
	buildSlides(cyclesArray[n]); 

	}
	
}


$.getJSON('php/featured.php', buildFeatured);


$("div.landing-thumb").hover(
	  function(){
		$(this).find("div.landing-image").fadeTo("fast", 0.25);
		$(this).find("div.landing-caption").fadeIn(400);
	  },
	  function(){
		   $(this).find("div.landing-image").fadeTo("fast", 1);

		$(this).find("div.landing-caption").fadeOut(400);
	  }
	);



$(".standard img").lazyload({  
							
	threshold:697	
							
	});	  
		   


$("a.landing-link").click(function(){
								   	
			if($(this).attr("id").slice(7) != firstProject) {
	
			swapProjects($(this).attr("id").slice(7), firstProject);			
	
			}else{
				
			closeLanding();
				
			}
			opened = true;
			$('#btn-portfolio').toggleClass("disabled");
		
			
			return false;

}); 

$("a.arrow_down").click(function(){ 
		
		$.scrollTo( $(this).closest("div.project"), 600,{offset: {top:downOffset, left:0} })
}); 

$("a.arrow_up").click(function(){ 
		
		$.scrollTo( $(this).closest("div.project"), 600,{offset: {top:upOffset, left:0} })
}); 


$("a.lastcross").click(function(){ 
		
		$.scrollTo( 0, 2200,{offset: {top:topOffset, left:0} })
}); 



$('.blurb').fadeTo("slow", 0.25);
$(".blurb").hover(function(){ 

	 $(this).fadeTo("fast", 1.0); // This should set the opacity to 100% on hover
		},function(){
		$(this).fadeTo("fast", 0.25); // This should set the opacity back to 25% on mouseout
   

}); 



function closeLanding() {
			
			
		$("#featured").fadeTo("slow", 0.0, function() {
		$("#landing").slideToggle("slow", function() {
		$('#portfolio').removeClass("initfolio");
								$("#portfolio").fadeTo("slow", 1.0);					
														
														});
							  			});
		
		$('#btn-home').toggleClass("disabled");
		return false;

		
						};
									

//first project defined in index.php
function swapProjects(newID, firstProject) {
	
	
		//Get the number of stillnav links so that we can check whether to fade the loader when we rebuild below  
		firstLength = ($('#stillnav'+firstProject+' li').length);
		newLength = ($('#stillnav'+newID+' li').length);


		//hold the  projects' markup in a temp 
		tempHTML = $('#project'+firstProject+'').html();
		newHTML = $('#project'+newID+'').html();

		
		//Transfer html
		$('#project'+firstProject+'').html(newHTML);	
		$('#project'+newID+'').html(tempHTML);
		
		$('#loader'+firstProject+'').fadeTo("slow", 100);
		$('#loader'+newID+'').fadeTo("slow", 100);

		
			
	//Rebuild stills for the selected project, which is now the starting project
	//in the folio
	$('#stills'+newID+'').cycle({ 
    fx:'scrollHorz', 
    timeout: 0, 
	speed:600,
	delay:2000,
	next:'#stills'+newID+'',
	pager:'#stillnav'+newID+'',
	
	pagerAnchorBuilder: function(idx, slide) { 
			
		
			if(idx == newLength-2) {
			
				$('#loader'+newID+'').fadeTo("slow", 0);

			}
			
        // return selector string for existing anchor 
        return '#stillnav'+newID+' li:eq(' + idx + ') a'; 
   			 
			 } 
	

	});
	
	
	//rebuild stills for the first project, which has now moved down
	$('#stills'+firstProject+'').cycle({ 
    fx:'scrollHorz', 
    timeout: 0, 
	speed:600,
	delay:2000,
	next:'#stills'+firstProject+'',
	pager:'#stillnav'+firstProject+'',	
	
	pagerAnchorBuilder: function(idx, slide) { 
	
		if(idx == firstLength-2) {
			
				$('#loader'+firstProject+'').fadeTo("slow", 0);

			}
	
	
        // return selector string for existing anchor 
        return '#stillnav'+firstProject+' li:eq(' + idx + ') a'; 
   			 
			 } 
	

	});	
	

	
	$('#blurb'+newID+', #blurb'+firstProject+'').fadeTo("slow", 0.25);
	$('#blurb'+newID+', #blurb'+firstProject+'').hover(function(){
						   $(this).fadeTo("fast", 1.0); // This should set the opacity to 100% on hover
						   },function(){
						   $(this).fadeTo("fast", 0.25); // This should set the opacity back to 30% on mouseout
							   	});
	
	

		//Clear and append html		
	
		$('#detailbar'+newID+'').html('<a id="arrow_down'+newID+'" class="arrow_down"></a>');
		
		$('#detailbar'+firstProject+'').html('</a><a id="arrow_down'+firstProject+'" class="arrow_down"></a><a id="arrow_up'+firstProject+'" class="arrow_up">');


		$('#arrow_down'+newID+', #arrow_down'+firstProject+'').click(function(){ 
																			 	
		$.scrollTo( $(this).closest("div.project"), 600,{offset: {top:downOffset, left:0} })

		}); 
		
		$('#arrow_up'+firstProject+'').click(function(){ 
																			 	
		$.scrollTo( $(this).closest("div.project"), 600,{offset: {top:upOffset, left:0} })

		}); 
		
			
	closeLanding();
	
	
	}

var opened = false;
	
$.address.change(function(event) {
						  

               
			 if($.address.value() == '/' && opened == false && $.url.param("id") == 'work') {
										
				$('#portfolio').removeClass("initfolio");
				$("#portfolio").fadeTo("fast", 1.0);	
				$('#btn-home').toggleClass("disabled");
				
				return false;

						  
					}
            });



//Click Events

	$("#btn-portfolio").click(function(){
									   
		if(opened != true) {							   
		$("#crosshair").fadeTo("slow", 0.0);
		$(this).toggleClass("disabled");
		closeLanding();
		opened = true;
		$.address.value('?id=work');		
			}
		return false;	

		});
	

	$("#crosshair").click(function(){
		$(this).fadeTo("slow", 0.0);
		closeLanding();
		$('#btn-portfolio').toggleClass("disabled");		
		return false;	
		});
		
	
});