// JavaScript Document




var standinSRC = "../../assets/images/standin.png";

// count (start at 1 because we've started with the main image)
var c = 0;

// preload images
for(var i=0; i<images.length; i++){
	// start image
	var pre = new Image();
	
	
	// don't preload movies
	if(fileExt(images[i]) === "mov"){
		continue;		
	}

	// assign source
	pre.src = images[i];

}


// init all content
function init(){

	// set document title
	document.title = title;

	// set content
	document.getElementById('contentinfo').innerHTML 	= desc;
	
	// set header
	document.getElementById('logo').innerHTML = '<img id="logoIMG" onLoad="resizeCopy();" src="'+headerimgSRC+'" />';
	
	// set up prev/next
	prevNextSetup();

	// set nav to zero to start
	nav(0);	


}

function resizeCopy(){
	// align navigation elements down at the bottom (this is a hack!)
	document.getElementById('contentinfo').style.marginLeft = document.getElementById('logo').offsetWidth + "px";	
}


// set up previous/next navigation from number of images
function prevNextSetup(){
	
	if(images.length > 1){
	
		var nav  = '<a id="prev" href="javascript:nav(-1,false);" onClick="this.blur();">&lsaquo; PREV</a>';
			nav += '<div id="prevNULL">&lsaquo; PREV</div>';
		
		for(var i=0; i<images.length; i++){
			nav += '<a class="jump" id="jump'+i+'" href="javascript:nav('+i+',true);" onClick="this.blur();"><div>&nbsp;</div></a>';	
		}
		
			nav += '<a id="next" href="javascript:nav(1,false);" onClick="this.blur();">NEXT &rsaquo;</a>';
			nav += '<div id="nextNULL">NEXT &rsaquo;</div>';
		document.getElementById('prevnext').innerHTML = nav;
	}
}

function activeJumpLink(id){
	for(var i=0; i<images.length; i++){
			document.getElementById("jump"+i).className = "jump";
	}
	document.getElementById("jump"+id).className  = "jumpActive";
}


// nav through image content
function nav(dir, jump){

	// hiding the prev/next buttons
	var hideNext = false;
	var hidePrev = false;

	// increment image count
	
	if(jump){
		c = dir;
	}
	else{
		c+=dir;	
	}
	
	if(c<=0){
		hidePrev = true;
		c = 0;
	}
	if(c>=images.length-1){
		hideNext = true;
		c = images.length-1;
	}
	
	
	
	if(images.length > 1){
	
		activeJumpLink(c);
	
		// hiding the prev/next buttons
		if(hideNext){
			document.getElementById('next').style.display = "none";
			document.getElementById('nextNULL').style.display = "block";
		}
		else{
			document.getElementById('next').style.display = "block";
			document.getElementById('nextNULL').style.display = "none";
		}
		if(hidePrev){
			document.getElementById('prev').style.display = "none";
			document.getElementById('prevNULL').style.display = "block";
		}
		else{
			document.getElementById('prev').style.display = "block";
			document.getElementById('prevNULL').style.display = "none";
		}
	}
	
	var ext = fileExt(images[c]);
	
	// depending on what format the file is based on the extension...
	switch(ext){
		case "jpg"  :
		case "gif"  :
		case "png"  :
		case "jpeg" :
			assignImgSRC(images[c], captions[c]);
			break;
		case "mov"	:
			assignQTSRC(images[c], captions[c]);
	}
}

function fileExt(filename){
	// split filename to get extension
	var filenameParts = filename.split(".");
	return filenameParts[filenameParts.length-1]; 
}




function assignImgSRC(imageSRC, caption){

	showLoading();

	var html  = '<img id=\"imgcontent\" style="visibility:hidden;" onload=\"doneLoading();\" src=\"'+ imageSRC +'\">';
	    html += '<div id=\"caption\" style="visibility:hidden;">'+caption+'</div>';

	// fill the src with html
	document.getElementById('srcimg').innerHTML = html;
}


function doneLoading(){
	document.getElementById("Loading").style.display 		= "none";
	document.getElementById('srcimg').style.width 			= document.getElementById('imgcontent').width + "px";
	document.getElementById('imgcontent').style.visibility 	= "visible";
	document.getElementById('caption').style.visibility 	= "visible";
}


function showLoading(){
	document.getElementById("Loading").style.display = "block";
}





















