
	STATUSTEKST   = ""
	STATUSTIMER   = NaN
	FOTOVISIBLE   = false
	FOTONUMMER    = NaN
	VOLGENDEFOTO  = 0
	FOTODIRECTORY = "fotos"

	function fotofolder(esc)
	{	var slash = "/"
		if (esc) slash = escape(slash)
		return (FOTODIRECTORY != "" ? FOTODIRECTORY + slash : "")
	}

	function fototabel(aantal,breedte,vtop)
	{	var html = ''
		html += '<table border=0 cellspacing=0 cellpadding=5 style="font:10pt Comic Sans MS; color:purple">\n'
		for (var j = 0; j < aantal; i++, j++)
		{	if (j%breedte == 0) html += '<tr>\n'
			html += '<td align=center'
			if (vtop) html += ' valign=top'
			html += ' width='
			html += (fotolijst[VOLGENDEFOTO].length > 4 ? fotolijst[VOLGENDEFOTO][4]+12 : 270)
			html += '>\n'
			html += fotokleinHTML(VOLGENDEFOTO++)
			html += '</td>\n'
			if ((j+1)%breedte == 0) html += '</tr>\n'
		}
		html += '</table>\n'
		document.writeln (html)
		//alert("fototabel("+aantal+","+breedte+","+vtop+"): "+html)
	}

	function nextfoto()
	{	var deze = FOTONUMMER
		do	{FOTONUMMER = (FOTONUMMER + 1) % fotolijst.length}
		while	(FOTONUMMER != deze && fotolijst[FOTONUMMER][0] == "")
		toonfoto(0+FOTONUMMER)
	}

	function prevfoto()
	{	var deze = FOTONUMMER
		do	{FOTONUMMER = (FOTONUMMER + fotolijst.length - 1) % fotolijst.length}
		while	(FOTONUMMER != deze && fotolijst[FOTONUMMER][0] == "")
		toonfoto(0+FOTONUMMER)
	}

	function toonfoto(n)
	{	for (var N = n; N < 0; N += fotolijst.length);
		for (; N < fotolijst.length && fotolijst[N][0] == ""; N++);
		//hidefoto()
		if (N < fotolijst.length && fotolijst[N][0] != "") setTimeout ("showfoto("+N+")" ,10)
		try {event.cancelBubbel = true} catch(e) {}
		return false
	}

	function showfoto(n)
	{	FOTONUMMER = n

		var canScroll = true
		try {document.all["minifoto"+n].scrollIntoView()} catch(e) {canScroll = false}
		if (canScroll)
		{	var bottom = document.body.scrollTop + document.body.clientHeight
			var scrollback = Math.round( (document.body.clientHeight - document.all["minifoto"+n].height) /2)
			if (document.body.scrollHeight > bottom) window.scrollBy(0,-scrollback)
		}

		var tekst = fotolijst[n][3]
		try {if (tekst == "") tekst = document.all["fototekst"+n].innerHTML} catch(e) {}
		document.all.fototekst.innerHTML = tekst.replace(/<a/,'<a style="color:yellow"')
		tekst = document.all.fototekst.innerText
		document.all.grotefoto.title = tekst + "\n\n(klik op de foto om hem te sluiten)"
		STATUSTEKST = tekst.replace(/\n/g," ") + "   "
		FOTOVISIBLE = true
		document.all.grotefoto.width  =          fotolijst[n][1]
		document.all.grotefoto.height =          fotolijst[n][2]
		fotoSize()
		document.all.grotefoto.style.visibility = "hidden"
		document.all.displayarea.style.visibility = "visible"
		document.all.evengeduld.style.visibility = "visible"
		document.all.displayarea.focus()
		setTimeout('document.all.grotefoto.src="'+fotofolder()+fotolijst[n][0]+'"',10)
	}

	function zoomfoto()
	{	if (document.all.zoombutton.style.color != "white") return
		var deze = FOTONUMMER
		if (isFinite(deze))
		{	var F = fotolijst[deze][0]
			var W = fotolijst[deze][1]
			var H = fotolijst[deze][2]
			if (document.all.grotefoto.width < W || document.all.grotefoto.height < H)
			{	var L = Math.round((screen.availWidth  - W)/2)
				var T = Math.round((screen.availHeight - H)/2)
				var X = escape(document.all.fototekst.innerText)
				var url = "zoomfoto.htm?foto="+fotofolder(1)+F+"&text="+X+"&width="+W+"&height="+H
				var win = window.open(url,"_blank","left="+L+",top="+T+",width="+W+",height="+H+",scrollbars=yes")
			//	hidefoto()
			//} else
			//{	alert("Deze foto kan niet verder worden vergroot.")
			}
		}
	}

	function fotoOnReadyStateChange()
	{	if ( (document.all.grotefoto.readyState == "complete") && FOTOVISIBLE)
		{	fotoSize()
			document.all.evengeduld.style.visibility = "hidden"
			document.all.displayarea.style.visibility = "visible"
			document.all.grotefoto.style.visibility = "visible"
			statusloper(1000)
		}
	}

	function fotoSize()
	{	var n = FOTONUMMER
		if (isFinite(n))
		{	var Wd = document.all.displayarea.offsetWidth
			var Hd = document.all.displayarea.offsetHeight
			var Wm = Wd - document.all.grotefoto.width
			var Hm = Hd - document.all.grotefoto.height
			var Wx = 0.85 * document.body.clientWidth
			var Hx = 0.85 * document.body.clientHeight
			var Wf = fotolijst[n][1]
			var Hf = fotolijst[n][2]
			var F  = Math.min((Wx-Wm)/Wf, (Hx-Hm)/Hf)
			if (F > 1) F = 1
			document.all.grotefoto.width  = Math.round(F * Wf)
			document.all.grotefoto.height = Math.round(F * Hf)
			if (F < 1)
			{	document.all.zoombutton.title="inzoomen naar volledige grootte\n(toets Z of pijl-omhoog werkt ook)"
				document.all.zoombutton.style.color="white"
			} else
			{	document.all.zoombutton.title="inzoomen kan niet meer, deze foto is al op zijn grootst"
				document.all.zoombutton.style.color="blue"
			}
		}
		fotoPosition()
	}

	function fotoPosition()
	{	var Wc = document.body.clientWidth
		var Hc = document.body.clientHeight

		var Wd = document.all.displayarea.offsetWidth
		var Hd = document.all.displayarea.offsetHeight
		var L  = Math.max(Math.round((Wc-Wd)/2),0)
		var T  = Math.max(Math.round((Hc-Hd)/2),0)
		document.all.displayarea.style.left = document.body.scrollLeft + L
		document.all.displayarea.style.top  = document.body.scrollTop  + T

		var Wd = document.all.evengeduld.offsetWidth
		var Hd = document.all.evengeduld.offsetHeight
		var L  = Math.max(Math.round((Wc-Wd)/2),0)
		var T  = Math.max(Math.round((Hc-Hd)/2),0)
		document.all.evengeduld.style.left = document.body.scrollLeft + L
		document.all.evengeduld.style.top  = document.body.scrollTop  + T
	}

	function hidefoto()
	{	document.all.displayarea.style.visibility = "hidden"
		document.all.grotefoto.style.visibility = "hidden"
		document.all.evengeduld.style.visibility = "hidden"
		FOTOVISIBLE = false
		statusloperuit()
	}

	function statusloper(tijd)
	{	if (STATUSTEKST != "")
		{	window.status = STATUSTEKST
			STATUSTEKST = STATUSTEKST.slice(1) + STATUSTEKST.charAt(0)
			if (!isNaN(STATUSTIMER)) clearTimeout(STATUSTIMER)
			STATUSTIMER = setTimeout('statusloper(250)', tijd)
		}
	}

	function statusloperuit()
	{	if (!isNaN(STATUSTIMER)) clearTimeout(STATUSTIMER)
		STATUSTEKST = ""
		window.status = ""
	}

	function fotokeydown(keyCode)
	{	var keyLeft	= 37
		var keyUp	= 38
		var keyRight	= 39
		var keyHome     = 36
		var keyEnd      = 35
		var keyZ	= 90
		var keyEsc	= 27
		var ok = true
		switch (keyCode)
		{	case keyLeft	:	prevfoto()
						break
			case keyUp	:	zoomfoto()
						break
			case keyRight	:	nextfoto()
						break
			case keyHome	:	toonfoto(0)
						break
			case keyEnd	:	toonfoto(-1)
						break
			case keyZ	:	zoomfoto()
						break
			case keyEsc	:	hidefoto()
						break
			default		:	ok = false
		}
		if (ok) event.cancelbubble = true
		return !ok
	}

	function makeDisplayArea()
	{	document.writeln
		( '<span id=displayarea'
		+ ' style="position:absolute;'
		+   'z-index:10;'
		+   'width:auto;'
		+   'height:auto;'
		+   'left:0;'
		+   'top:0;'
		+   'visibility:hidden;'
		+   '"'
		+ ' onkeydown="return fotokeydown (event.keyCode);"'
		+ '>'
		+   '<table border=1 cellspacing=0 cellpadding=0><tr><td>'
		+   '<table border=0 cellspacing=0 cellpadding=0 bgcolor=lightgrey'
		+   ' style="border-color:royalblue;border-style:solid;">'
		+     '<tr>'
		+       '<td>'
		+         '<table border=0 cellspacing=0 cellpadding=5 width=100%>'
		+           '<tr bgcolor=royalblue>'
		+             '<td id=fototekst style="color:white; font:8pt Arial; font-weight:bold;">'
		+               '&nbsp;'
		+             '</td>'
		+             '<td align=right>'
		+		'&nbsp;'
		+		'&nbsp;'
		+               '<input title="eerste foto (toets Home werkt ook)"'
		+               ' style="width:24; height:24; font-weight:bold; text-align:center;'
		+                 'color:white; background-color:royalblue; border-color:white;"'
		+               ' type=button onclick=toonfoto(0) value="<<"'
		+               '>'
		+		'&nbsp;'
		+               '<input title="vorige foto (toets pijl-links werkt ook)"'
		+               ' style="width:24; height:24; font-weight:bold; text-align:center;'
		+                 'color:white; background-color:royalblue; border-color:white;"'
		+               ' type=button onclick=prevfoto() value="<"'
		+               '>'
		+		'&nbsp;'
		+               '<input title="volgende foto (toets pijl-rechts werkt ook)"'
		+               ' style="width:24; height:24; font-weight:bold; text-align:center;'
		+                 'color:white; background-color:royalblue; border-color:white;"'
		+               ' type=button onclick=nextfoto() value=">"'
		+               '>'
		+		'&nbsp;'
		+               '<input title="laatste foto (toets End werkt ook)"'
		+               ' style="width:24; height:24; font-weight:bold; text-align:center;'
		+                 'color:white; background-color:royalblue; border-color:white;"'
		+               ' type=button onclick=toonfoto(-1) value=">>"'
		+               '>'
		+		'&nbsp;'
		+		'&nbsp;'
		+		'&nbsp;'
		+               '<input title="zoom naar volledige grootte (toets Z werkt ook)"'
		+               ' id=zoombutton'
		+               ' style="width:24; height:24; font-weight:bold; text-align:center;'
		+                 'color:white; background-color:royalblue; border-color:white;"'
		+               ' type=button onclick=zoomfoto() value="Z"'
		+               '>'
		+		'&nbsp;'
		+		'&nbsp;'
		+		'&nbsp;'
		+               '<input title="foto verbergen (toets Esc werkt ook)"'
		+               ' style="width:24; height:24; font-weight:bold; text-align:center;'
		+                 'color:white; background-color:tomato; border-color:white;"'
		+               ' type=button onclick=hidefoto() value="X"'
		+               '>'
		+             '</td>'
		+           '</tr>'
		+         '</table>'
		+       '</td>'
		+     '</tr>'
		+     '<tr>'
		+       '<td align=center style="border-style:window-inset;border-width:1;">'
		+         '<img id=grotefoto hspace=0 vspace=0'
		+         ' onreadystatechange="fotoOnReadyStateChange()"'
		+         ' style="visibility:hidden;"'
		+         ' onclick="hidefoto()"'
		//+         ' oncontextmenu="hidefoto();event.cancelBubble=true;return false;"'
		+         '>'
		+       '</td>'
		+     '</tr>'
		+   '</table>'
		+   '</td></tr></table>'
		+ '</span>'
		+ '<span id=evengeduld'
		+ ' style="position:absolute;'
		+   'z-index:20;'
		+   'width:auto;'
		+   'height:auto;'
		+   'left:0;'
		+   'top:0;'
		+   'visibility:hidden;'
		+   'font:10pt Arial;'
		+   'color:black;'
		+   'backgroundcolor:lightgrey;'
		+   '"'
		+ '>De foto wordt geladen, even geduld...'
		+ '</span>'
		)
	}

	function fotokleinHTML(i)
	{	var html = ""
		var src = fotofolder() + fotolijst[i][0].slice(0,-9) + "klein.jpg"
		html += '<img id=minifoto'+i+' src="'+src+'" onclick="toonfoto('+i+');return false;" alt="Klik op de foto voor een vergroting" hspace=0 vspace=0>\n'
		html += '<br>'
		html += '<span id=fototekst'+i+' style="font-size:7pt">'
		html += fotolijst[i][3].replace(/\n/g,'<br>')
		html += '</span>\n'
		return html
	}

