var current_image = 0;
var current_page = 0;
var img_ct = image_list.length - 1;

var tempImage = null;
var t = null;
var theInterval = null;


// function that is ran when user clicks on a thumbnail image
function imageClick(index) {

	var y = (index + (current_page * images_per_page));
	current_image = y;
	loadBigImage(current_image);
	return;

}


// function that is ran when PREVIOUS or NEXT link is clicked
function clickDirection(whichDirection) {
	
	// first, figure out which direction the user is going, then set 'current_image' to the correct (next or previous) image
	// taking into account that the user may be at the first or last image in the list -- in that case it resets to the beginning or end
	current_image = current_image + whichDirection;
	if (current_image > img_ct) {
		current_image = 0;
	} else if (current_image < 0) {
		current_image = img_ct;
	}
	

	if (whichDirection == 1) {
		for (var p=1; p<num_pages; p++) {
			if (current_image == (p * images_per_page)) {
				goToPage(p);
			}
		}
		if (current_image == 0) {
			goToPage(0);
		}
	}
	
	if (whichDirection == -1) {
		for (var q=1; q<num_pages; q++) {
			if (current_image == ((q * images_per_page) - 1)) {
				goToPage(q - 1);
			}
		}
		if (current_image == (image_list.length - 1)) {
			goToPage(num_pages - 1);
		}
	}


	loadBigImage(current_image);
	return;
	
}


// function that loads the requested image into the user's cache
function loadBigImage(whichImage) {

	tempImage = null;
	if (theInterval) {
		clearInterval(theInterval);
	}
	if (document.images) {
		var photoHolder = document.getElementById('mainphoto');
		photoHolder.innerHTML = '<p class="loadermsg">Loading...</p>';
		tempImage = new Image();
		tempImage.src = section+'/large_images/'+image_list[whichImage];
		theInterval = setInterval("showBigImage()", 250);
	}
	return;
}

// function that checks to see whether the selected image has downloaded to the user's cache
// if the current image has downloaded to the user's cache, we load that image into the browser window
function showBigImage() {
	//var photoHolder = document.getElementById('mainphoto');
	if (tempImage.complete) {
		clearInterval(theInterval);
		var photoHolder = document.getElementById('mainphoto');
		photoHolder.innerHTML = '<img src="'+section+'/large_images/'+image_list[current_image]+'" width="'+width_list[current_image]+'" height="'+height_list[current_image]+'" />';
		tempImage = null;
		// alert("complete!");
	} else {
		return false;
	}
}


function goToPage(whichPage) {
	if (document.images) {
		var selected_page = whichPage;
		var selected_icon = document.getElementById('pg'+selected_page);
		var previous_icon = document.getElementById('pg'+current_page);
		
		selected_icon.style.background = 'white url('+rootDir+'portfolio/portfolio_graphics/pg_icon_f2.gif) no-repeat';
		previous_icon.style.background = 'white url('+rootDir+'portfolio/portfolio_graphics/pg_icon_f1.gif) no-repeat';
		
		for (var i=0; i<images_per_page; i++) {
			var obj_num = i;
			var obj_name = "sm_" + obj_num;
			var next_image = (i+(12*whichPage));
			if (next_image < image_list.length) {
				//document.images[obj_name].style.visibility = 'visible';
				document.images[obj_name].style.display = 'inline';
				document.images[obj_name].src = section+"/thumbnails/"+image_list[next_image];
			} else {
				//document.images[obj_name].style.visibility = 'hidden';
				document.images[obj_name].style.display = 'none';
			}
		}
		var firstOnPage = (images_per_page * whichPage);
		current_page = whichPage;
	}
}