var newImg;
var isComplete = true;

//============================
// Changes image
function displayImage(imgPath, imgNo)
{
	if (isComplete)
	{
		isComplete = false;
		Effect.Fade('ImagePreview');
		$('currentImgNumber').value = imgNo;
		changeNavSelected(imgNo);
		$('ImagePostion').innerHTML = Number(imgNo) + 1;
		if (document.images)
		{
			newImg = new Image();
			newImg.src = imgPath;

			setTimeout('switchPhoto();', 1000);
		}
	}
}

//============================
// Switches the photo
function switchPhoto() 
{
	if (newImg.complete || newImg.complete==null) 
	{
		Effect.Appear('ImagePreview');
		$('ImagePreview').src	= newImg.src;
		setTimeout('isComplete = true;', 1000);
	}
	else
	{
		setTimeout('switchPhoto()', 500);
	}
}

//============================
// Changes highlighted image
//function selectImage(imgNo)
//{
//	var numOfImgs = $('numOfImgs').value;
//
//	for ( var x=0; x<=numOfImgs ; x++ )
//	{
//		$('SELECTOR' + x).className = 'imgNotSelected';
//	}
//
//	$('SELECTOR' + imgNo).className = 'imgSelected';
//}


function newNextPrev(imgNo)
{
	var numOfImgs = $('totalImages').value;
	var next = String(Number(imgNo) + 1);
	var prev = String(Number(imgNo) - 1);

	if (String(imgNo) == '0') {
		Event.observe('arrowLeftAnchor', 'click', function(e){
			Event.stop(e);
		});
	}
	else {
		Event.observe('arrowLeftAnchor', 'click', function(){
			displayImage(String($('imagePath').value + $('imageName' + prev).value), prev); 
			return false;
		});
	}

	if (String(imgNo) == String(numOfImgs)) {
		Event.observe('arrowRightAnchor', 'click', function(e){
			Event.stop(e);
		});
	}
	else {
		Event.observe('arrowRightAnchor', 'click', function(){
			displayImage(String($('imagePath').value + $('imageName' + next).value), next);
			return false;
		});
	}
}


function moveNext(){
	var next = String(Number($('currentImgNumber').value) + 1);
	if(Number(next) <=  Number($('totalImages').value)){
		displayImage($('imagePath').value + $('imageName' + next).value, next);
	}
	else{
		return false;
	}
}


function movePrev(){
	var prev = String(Number($('currentImgNumber').value) - 1);
	if(Number(prev) >= 0){
		displayImage($('imagePath').value + $('imageName' + prev).value, prev);
	}
	else{
		return false;
	}
}

function changeNavSelected(imgNo) {
	var numOfImgs = $('totalImages').value;

	for ( var x=0; x<=numOfImgs ; x++ )
	{
		$('navNum' + x).className = '';
	}

	$('navNum' + imgNo).className = 'selected';
}