// JavaScript Document
function PhotoBoxImageRollOver(thumbImageSrc, imageSrc, topParam, leftParam, widthParam, heightParam)
{
	var date = new Date();
	var curDate = null;
	
	for (var i=1;i<= PhotoBoxImageCount; i++){
		thumbImage=document.getElementById('thumb'+i);
		thumbImage.style.border='3px solid #ffffff';
	}
	thumbImage=document.getElementById(thumbImageSrc); 
	thumbImage.style.border = '3px solid #FF9900';
	// Display loading image first	
	PhotoBoxImageLoading(topParam, leftParam, widthParam, heightParam);
	
	// Set the main image properties while loading image is on display
	document.getElementById('PhotoBoxImage').style.top = topParam;
	document.getElementById('PhotoBoxImage').style.left = leftParam;
	document.getElementById('PhotoBoxImage').style.width = widthParam;
	document.getElementById('PhotoBoxImage').style.height = heightParam;
	featureImage = document.getElementById('imgPhotoBoxImage');
	featureImage.src = imageSrc;
	featureImage.onload=function(){ //When target image has completely loaded
		loadingImage = document.getElementById('imgPhotoBoxImage');
		loadingDiv.style.display = 'none'; //Hide "loading" div
		document.getElementById('PhotoBoxImage').style.display = 'block';
	
	}
}

function PhotoBoxImageLoading(topParam, leftParam, widthParam, heightParam)
{
	//With top and height attributes

	loadingDiv = document.getElementById('PhotoBoxImageLoading');
	PhotoBoxImageDiv = document.getElementById('PhotoBoxImage');
	PhotoBoxImageDiv.style.display = 'none';
	document.getElementById('PhotoBoxImageLoading').style.top = topParam;
	document.getElementById('PhotoBoxImageLoading').style.left = leftParam;
	document.getElementById('PhotoBoxImageLoading').style.width = widthParam;
	document.getElementById('PhotoBoxImageLoading').style.height = heightParam;
	loadingImage = document.getElementById('imgPhotoBoxImageLoading');
	loadingImage.src = '/images/loading.gif';
	loadingDiv.style.display = 'block';
	

}