//index.html
jOn(MOUSEOVER, "imgIndex", IMAGE, "graphics/logo_over.gif");
jOn(MOUSEOUT, "imgIndex", IMAGE, "graphics/logo.gif");

//Menu
jOn(MOUSEOVER, "imgPortraits", IMAGE, "graphics/menu_portraits_over.gif");
jOn(MOUSEOUT, "imgPortraits", IMAGE, "graphics/menu_portraits.gif");
jOn(MOUSEOVER, "imgTravel", IMAGE, "graphics/menu_travel_over.gif");
jOn(MOUSEOUT, "imgTravel", IMAGE, "graphics/menu_travel.gif");
jOn(MOUSEOVER, "imgMusic", IMAGE, "graphics/menu_music_over.gif");
jOn(MOUSEOUT, "imgMusic", IMAGE, "graphics/menu_music.gif");
jOn(MOUSEOVER, "imgCommercial", IMAGE, "graphics/menu_commercial_over.gif");
jOn(MOUSEOUT, "imgCommercial", IMAGE, "graphics/menu_commercial.gif");
jOn(MOUSEOVER, "imgReportage", IMAGE, "graphics/menu_reportage_over.gif");
jOn(MOUSEOUT, "imgReportage", IMAGE, "graphics/menu_reportage.gif");
jOn(MOUSEOVER, "imgPolaroids", IMAGE, "graphics/menu_polaroids_over.gif");
jOn(MOUSEOUT, "imgPolaroids", IMAGE, "graphics/menu_polaroids.gif");
jOn(MOUSEOVER, "imgImagine", IMAGE, "graphics/menu_imagine_over.gif");
jOn(MOUSEOUT, "imgImagine", IMAGE, "graphics/menu_imagine.gif");
jOn(MOUSEOVER, "imgArchive", IMAGE, "graphics/menu_archive_over.gif");
jOn(MOUSEOUT, "imgArchive", IMAGE, "graphics/menu_archive.gif");
jOn(MOUSEOVER, "imgContact", IMAGE, "graphics/menu_contact_over.gif");
jOn(MOUSEOUT, "imgContact", IMAGE, "graphics/menu_contact.gif");
jOn(MOUSEOVER, "imgFtp", IMAGE, "graphics/menu_ftp_over.gif");
jOn(MOUSEOUT, "imgFtp", IMAGE, "graphics/menu_ftp.gif");


var bLockButtons = false;

function UnlockThumbs()
{
	bLockButtons = false;
}



function jOnKeyDown(e)
{	

	var evtobj = window.event? event : e;
	var unicode = evtobj.charCode? evtobj.charCode : evtobj.keyCode;
	
	//left arrow
	if (unicode == 37)
	{
		PhotoBack();
		return false;
	}
	//right arrow
	else if (unicode == 39)
	{
		PhotoNext();
		return false;
	}
}

var arContLen = 0;
var jCurrPhoto = 0;

var jArrWidth; 
var jNrOfPhotos; 
var jNrDisplayed; 
var jFirstPhoto;
var jMargin = 12; 
var jCurrentWidth; 
var jPageWidth = 1212; 
var jSlideShow = false;

function PhotosLoaded()
{
	jGet('ifJS').src = 'includes/js.php';
	arContLen = jArrContent.length - 1; //remove dummy from lenght
	jSet("imgLine", DISPLAY, "block");
	jSet("divForwardPhoto", DISPLAY, "block");
	jSet("ifPhoto", DISPLAY, "none");
	
	jCurrPhoto = jStartPhoto;
	
	
	var nCnt;
	for (nCnt = 0; nCnt < jLength; nCnt++)
	{
		jSet("aThumb" + nCnt, HREF, "javascript:void(0);");
		jOn(CLICK, "aThumb" + nCnt, ThumbClick, (jCurrPhoto + nCnt));
	}
	jSet("aBack", HREF, "javascript:void(0);");
	jSet("aForward", HREF, "javascript:void(0);");
	
//Back & Forward Photo's
document.onkeydown = jOnKeyDown;
	
	ShowPhoto();
	//preload
}

function HideNumbers()
{
	for (nCnt = 1; nCnt <= jNrDisplayed; nCnt++)
	{
		jSet("imgNum" + (jFirstPhoto + nCnt), IMAGE, "graphics/" + (jFirstPhoto + nCnt) + ".gif");
	}
}	
	
function ShowNumbers()
{
	for (nCnt = 1; nCnt <= jNrDisplayed; nCnt++)
	{
		jSet("imgNum" + (jFirstPhoto + nCnt), IMAGE, "graphics/" + (jFirstPhoto + nCnt) + "h.gif");
	}
}		

		
function SlideBack()
{
	if (jSlideShow == false) {return false;};
	if (jNrOfPhotos == 0) {return false;};
	if (jFirstPhoto == 0) {return false;};

	var nNrNewPics = 0;
	var nLeft;
	var nCnt;
	var nSpeed = 0;
	
	HideNumbers(); 
	
	//calculate nr of new photos that fit page
	var nNextPhoto = jFirstPhoto - 1;
	var nNewWidth = jCurrentWidth - jArrWidth[jFirstPhoto + jNrDisplayed - 1] - jMargin;
	for (nCnt = nNextPhoto; nCnt >= 0; nCnt--)
	{
		if (nNewWidth + jArrWidth[nCnt] + jMargin <= jPageWidth)
		{
			nNewWidth += jArrWidth[nCnt] + jMargin;
			nNrNewPics++;
		}
		else
		{
			break;
		}
	}
	nNextPhoto = nNextPhoto - nNrNewPics + 1;
	
	//set position & opacity for new photo's	
	nLeft = jGet(LEFT, "divP" + jFirstPhoto);
	for (nCnt = nNrNewPics - 1; nCnt >= 0; nCnt--)
	{
		jSet("divP" + (nNextPhoto + nCnt), OPACITY, "0");	
		jSet("divP" + (nNextPhoto + nCnt), POS, "" + (nLeft - jMargin - jArrWidth[nNextPhoto + nCnt]), "same");
		jSet("divP" + (nNextPhoto + nCnt), OPACITY, "100", "", nSpeed);	
		jCurrentWidth +=  jArrWidth[nNextPhoto + nCnt] + jMargin;
		nLeft = nLeft - jMargin - jArrWidth[nNextPhoto + nCnt]	
	}
	
	//calculate distance to move photo's to the rigth
	nRight = jGet(LEFT, "divP" + (nNextPhoto)) - Math.round((jPageWidth - nNewWidth) / 2);
	nRight = -nRight;
	
	//move all of them to the right
	for (nCnt = 0; nCnt < jNrDisplayed + nNrNewPics; nCnt++)
	{
		jSet("divP" + (nNextPhoto + nCnt), POS, "add:+" + nRight,"same", nSpeed);		
	}	
	
	//fade out first photo
	jSet("divP" + (jFirstPhoto + jNrDisplayed - 1), OPACITY, "0","", nSpeed);	
	
	jFirstPhoto = nNextPhoto;
	jNrDisplayed += nNrNewPics - 1;
	jCurrentWidth = nNewWidth;
	ShowNumbers();
	PhotoShowHideBF();
	return true;
}

function SlideNext()
{
	if (jSlideShow == false) {return false;};
	if (jNrOfPhotos == 0) {return false;};
	if (jFirstPhoto + jNrDisplayed >= jNrOfPhotos) {return false;};
	
	var nNrNewPics = 0;
	var nLeft;
	var nCnt;
	var nSpeed = 0;
	
	HideNumbers();
	
	//calculate nr of new photos that fit page
	var nNextPhoto = jFirstPhoto + jNrDisplayed;
	var nNewWidth = jCurrentWidth - jArrWidth[jFirstPhoto] - jMargin;
	for (nCnt = nNextPhoto; nCnt < jNrOfPhotos; nCnt++)
	{
		if (nNewWidth + jArrWidth[nNextPhoto + nNrNewPics] + jMargin <= jPageWidth)
		{
			nNewWidth += jArrWidth[nNextPhoto + nNrNewPics] + jMargin;
			nNrNewPics++;
		}
		else
		{
			break;
		}
	}
	
	//set position & opacity for new photo's	
	nLeft = jGet(LEFT, "divP" + jFirstPhoto);
	for (nCnt = 0; nCnt < nNrNewPics; nCnt++)
	{
		jSet("divP" + (nNextPhoto + nCnt), OPACITY, "0");	
		jSet("divP" + (nNextPhoto + nCnt), POS, "" + (jCurrentWidth + jMargin + nLeft), "same");
		jSet("divP" + (nNextPhoto + nCnt), OPACITY, "100", "", nSpeed);	

		jCurrentWidth +=  jArrWidth[nNextPhoto + nCnt] + jMargin;		
	}
	
	//calculate distance to move photo's to the left
	nLeft = jGet(LEFT, "divP" + (jFirstPhoto + 1)) - Math.round((jPageWidth - nNewWidth) / 2);
	
	//move all of them to the left
	for (nCnt = 0; nCnt < jNrDisplayed + nNrNewPics; nCnt++)
	{
		jSet("divP" + (jFirstPhoto + nCnt), POS, "add:-" + nLeft,"same", nSpeed);		
	}	
	
	//fade out first photo
	jSet("divP" + jFirstPhoto, OPACITY, "0","", nSpeed);	
	
	jFirstPhoto++;
	jNrDisplayed += nNrNewPics - 1;
	jCurrentWidth = nNewWidth;

	ShowNumbers();
	PhotoShowHideBF();
	return true;
}

function ShowPhoto(reverse)
{
	jSlideShow = false;
	jSet("divNumbers", DISPLAY, "none");
	
	switch (jArrContent[jCurrPhoto][1])
	{
	case "1":
		jGet('divPhotos').innerHTML = "<div style='position:absolute; left:0px; top:0px; width:" + jPageWidth + 
				"px; height:400px; " + "background: url(photos/" + jArrContent[jCurrPhoto][2] + ") center top no-repeat;'></div>";
		
		break;
	case "2":
	
		var arrPhotos = jArrContent[jCurrPhoto][2].split(','); 
		jGet('divPhotos').innerHTML =  "<div style='position:absolute; left:0px; top:0px; width:600px; height:400px; " + 
			 "background: url(photos/" + arrPhotos[0] + ") right top no-repeat;'></div>" + 
			"<div style='position:absolute; left:612px; top:0px; width:600px; height:400px; " +
			 "background: url(photos/" + arrPhotos[1] + ") left top no-repeat;'></div>";
		break;
	case "3":
		var nCnt;
		var innerHTML;
		var arrPhotos = jArrContent[jCurrPhoto][2].split(','); 
		jArrWidth = jArrContent[jCurrPhoto][3].split(','); 
		
		//convert to int
		for (nCnt = 0; nCnt < jArrWidth.length; nCnt++)
		{
			jArrWidth[nCnt] = parseInt(jArrWidth[nCnt]);
		}
		
		jNrDisplayed = 1;
		jNrOfPhotos = arrPhotos.length;
		
		if (!reverse)
		{
			//calculate nr of pics that fit width
			jCurrentWidth = jArrWidth[0];
			for (nCnt = 1; nCnt < jNrOfPhotos; nCnt++)
			{
				if (jCurrentWidth + jMargin + jArrWidth[nCnt] <= jPageWidth)
				{
					jCurrentWidth += jMargin + jArrWidth[nCnt];
					jNrDisplayed++;
					
				}
				else
				{
					break;
				}
			}
			
			//get right starting positions so that we end up centered
			var nLeft = Math.round((jPageWidth - jCurrentWidth) / 2);
			innerHTML = "<div style='position:absolute; left:0px; top:0px; width:" + jPageWidth + "px; height:400px;'>\n";
			//show the photo's that fit
			 for (nCnt = 0; nCnt < jNrDisplayed; nCnt++)
			 {
				innerHTML += "<div id='divP" + nCnt + "' style='position:absolute; left:" + nLeft + "px; top:0px; width:" + jArrWidth[nCnt] + "px; height:400px; " + 
				"background: url(photos/" + arrPhotos[nCnt] + ") left top no-repeat;'></div>\n";
				nLeft += jMargin + jArrWidth[nCnt];
			 }
			 //place the photo's that don't fit for javascript sliding
			 for (nCnt = jNrDisplayed; nCnt < jNrOfPhotos; nCnt++)
			 {
				innerHTML += "<div id='divP" + nCnt + "' style='position:absolute; left:-2000px; top:0px; width:" + jArrWidth[nCnt] + "px; height:400px; " + 
				"background: url(photos/" + arrPhotos[nCnt] + ") left top no-repeat;'></div>\n";
				nLeft += jMargin + jArrWidth[nCnt];
			 }
			 jGet('divPhotos').innerHTML = innerHTML;
			 jFirstPhoto = 0;
		}
		//reverse slide show
		else
		{
			//calculate nr of pics that fit width
			jCurrentWidth = jArrWidth[jNrOfPhotos - 1];
			for (nCnt = jNrOfPhotos - 2; nCnt >= 0; nCnt--)
			{
				if (jCurrentWidth + jMargin + jArrWidth[nCnt] <= jPageWidth)
				{
					jCurrentWidth += jMargin + jArrWidth[nCnt];
					jNrDisplayed++;
					
				}
				else
				{
					break;
				}
			}
			
			//get right starting positions so that we end up centered
			var nLeft = Math.round((jPageWidth - jCurrentWidth) / 2);
			innerHTML = "<div style='position:absolute; left:0px; top:0px; width:" + jPageWidth + "px; height:400px;'>\n";
			//show the photo's that fit
			 for (nCnt = jNrOfPhotos - jNrDisplayed; nCnt < jNrOfPhotos; nCnt++)
			 {
				innerHTML += "<div id='divP" + nCnt + "' style='position:absolute; left:" + nLeft + "px; top:0px; width:" + jArrWidth[nCnt] + "px; height:400px; " + 
				"background: url(photos/" + arrPhotos[nCnt] + ") left top no-repeat;'></div>\n";
				nLeft += jMargin + jArrWidth[nCnt];
			 }
			 //place the photo's that don't fit for javascript sliding
			 for (nCnt = 0; nCnt < jNrOfPhotos - jNrDisplayed; nCnt++)
			 {
				innerHTML += "<div id='divP" + nCnt + "' style='position:absolute; left:-2000px; top:0px; width:" + jArrWidth[nCnt] + "px; height:400px; " + 
				"background: url(photos/" + arrPhotos[nCnt] + ") left top no-repeat;'></div>\n";
				nLeft += jMargin + jArrWidth[nCnt];
			 }
			 jGet('divPhotos').innerHTML = innerHTML;
			 jFirstPhoto = jNrOfPhotos - jNrDisplayed;
		}
		
		//init opacity
		for (nCnt = 0; nCnt < jNrOfPhotos; nCnt++)
		{
			jSet("divP" + nCnt, OPACITY, "100");		
		}
	
		// slideshow?
		if (jNrDisplayed < jNrOfPhotos)
		{
			jSlideShow = true;
			//show numbers on top.......
			var nLeft =  Math.round((jPageWidth - (18 * jNrOfPhotos)) / 2) + 3;
			innerHTML = "";
			for (nCnt = 1; nCnt <= jNrOfPhotos; nCnt++)
			{
				innerHTML += "<img class='cNumber' id='imgNum" + nCnt + "' style='left:" + (nLeft + (nCnt - 1) * 18) + "px' src='graphics/" + nCnt + ".gif' />" ;
			}

			jSet("divNumbers", INNERHTML, innerHTML);
			ShowNumbers();
			jSet("divNumbers", DISPLAY, "block");
		}
		break;
 	default:
	   jGet('divPhotos').innerHTML = "You found a typo! <br> Parameter 'type' has the invalid value of: " + jArrContent[jCurrPhoto][1];
	 
	}

}

function ThumbClick(id, value, prog)
{
	jCurrPhoto = value;
	jSet("imgLine", POS, "" + (37 * (jCurrPhoto - jStartPhoto)) ,"same");
	ShowPhoto(false);
	PhotoShowHideBF();
}

function PhotoShowHideBF()
{
	jSet("divForwardPhoto", DISPLAY, "block");
	jSet("divBackPhoto", DISPLAY, "block");

	if (jCurrPhoto <= jStartPhoto)
	{
		jSet("divBackPhoto", DISPLAY, "none");
	}

	if (jCurrPhoto >= jStartPhoto + jLength - 1)
	{
		if (jSlideShow)
		{
			if (jFirstPhoto + jNrDisplayed >= jNrOfPhotos)
			{
				jSet("divForwardPhoto", DISPLAY, "none");
			}
		}
		else
		{
			jSet("divForwardPhoto", DISPLAY, "none");
		}
	}
}

function PhotoSyncThumbs()
{
	//advance thumbs
	//var jOffset = 0; var jLength = 39;  var jStartPhoto = 0; 
	
	jOffset = Math.floor((jCurrPhoto - jStartPhoto) / 9);
	
	jSet("divThumbs", POS, "-" + (333 * jOffset) ,"same",250);
	bLockButtons = true;
	jSet("", UnlockThumbs, 0 , 0, 300);
	jOffset *= 9;
	jSet("imgLine", POS, "" + (37 * (jCurrPhoto - jStartPhoto)) ,"same");
	
	//hide show fw bw thumb buttons
	jSet("divForward", DISPLAY, "block");
	jSet("divBack", DISPLAY, "block");
	if (jOffset <= 0)
	{
		jSet("divBack", DISPLAY, "none");
	}
	if ((jOffset + 9) > jLength)
	{
		jSet("divForward", DISPLAY, "none");
	}	
}


function PhotoBack()
{
	if (bLockButtons) {return;}

	//photo frame handels it
	if (SlideBack())
	{
		return;
	}

	if (jCurrPhoto <= jStartPhoto)
	{
		return;
	}
	
	jCurrPhoto = jCurrPhoto - 1;
	//set frame content
	ShowPhoto(true);
	
	PhotoShowHideBF();
	PhotoSyncThumbs();
}

function PhotoNext()
{
	if (bLockButtons) {return;}
	
	//photo frame handels it
	if (SlideNext())
	{
		return;
	}
	
	if (jCurrPhoto >= jStartPhoto + jLength - 1)
	{
		return;
	}
	
	jCurrPhoto = jCurrPhoto + 1;
	//set frame content
	ShowPhoto(false);
	
	PhotoShowHideBF();
	PhotoSyncThumbs();
	
	if (jCurrPhoto < jStartPhoto + jLength - 1)
	{
		arrPhotos = jArrContent[jCurrPhoto + 1][2].split(','); 
		var innerHTML = "";
		for (nCnt = 0; nCnt < arrPhotos.length; nCnt++)
		{
			innerHTML += "<img src='photos/" + arrPhotos[nCnt] + "'/>\n" ;
		}
	}
	jGet('divPreload').innerHTML = innerHTML;
}




//Back & Forward Thumbs

jOn(CLICK, "aBack", ThumbsBack);
jOn(CLICK, "aForward", ThumbsForward);


function ThumbsBack()
{
	if (bLockButtons) {return;}
	if (jOffset > 0)
	{
		jSet("divThumbs", POS, "add:+333","same",250);
		bLockButtons = true;
		jSet("", UnlockThumbs, 0 , 0, 300);
		jOffset -= 9;
	}
	if (jOffset <= 0)
	{
		jSet("divBack", DISPLAY, "none");
	}
	if ((jOffset + 9) < jLength)
	{
		jSet("divForward", DISPLAY, "block");
	}	
}

function ThumbsForward()
{
	if (bLockButtons) {return;}
	if (jOffset < jLength)
	{
		jSet("divThumbs", POS, "add:-333","same",250);
		bLockButtons = true;
		jSet("", UnlockThumbs, 0 , 0, 300);
		jOffset += 9;
	}
	
	if ((jOffset + 9) > jLength)
	{
		jSet("divForward", DISPLAY, "none");
	}	
	jSet("divBack", DISPLAY, "block");
}