var pictureBar_position = 0;
var max_pictureBar_position = 2; //this is zero-based, so if it's "2" then there's 3
var current_picDivID = "photo_sidebox";
var current_txtDivID = "photo_txt";

function move_pictureBar(direction)
{
	if(direction == "right" && pictureBar_position > 0)
	{
		new Effect.Move('pictureBar', { x: 720, y: 0 });
		pictureBar_position-=1;
	}
	else if(direction == "left" && pictureBar_position < max_pictureBar_position )
	{
		new Effect.Move('pictureBar', { x: -720, y: 0 });
		pictureBar_position+=1;
	}
	return true;
}

function display_photo(photoNumber)
{
	document.getElementById("photo").innerHTML = "<center><div id='clickToClose'>Click Image To Close</div><a id='photo_anchor'><img src='img/photo/Picture "+photoNumber+".jpg' class='photo' onclick='kill_photo()'></a><center>";
	
	//Bring up the image and gray out the rest of the screen
	document.getElementById("photo").style.zIndex="5";
	document.getElementById("grayOut").style.display="block";
	document.getElementById("grayOut").style.zIndex="3";

	Effect.Appear('photo');
}

function kill_photo()
{	
	Effect.SwitchOff('photo');
	
	//Bring up the image and gray out the rest of the screen
	document.getElementById("grayOut").style.display="none";
	document.getElementById("grayOut").style.zIndex="-1";
}

function show_photo_in_box(photoNumber, picDivID, txtDivID)
{
	document.getElementById(current_picDivID).style.display = "none";
	document.getElementById(current_txtDivID).style.display = "none";
	document.getElementById(picDivID).style.display = "block";
	document.getElementById(picDivID).innerHTML = "<img src='img/photo/Picture "+photoNumber+".jpg' width='292' height='218'>";
	document.getElementById(txtDivID).style.display = "block";
	
	current_picDivID = picDivID;
	current_txtDivID = txtDivID;
}