window.onload = function()
{
	var container = document.getElementById("images");
	var images = container.getElementsByTagName("img");
	var supported501 = /MSIE (5\.01)/.test(navigator.userAgent) && navigator.platform == "Win32";

	var layer = document.createElement("div");
	layer.id = "layer";
	layer.style.position = "absolute";
	layer.style.top = "118px";
	layer.style.left = "195px";
	layer.style.width = "0px";
	layer.style.height = "20px";
	layer.style.overflow = "hidden";
	
	var opacity = document.createElement("div");
	opacity.style.position = "absolute";
	opacity.style.left = "0px";
	opacity.style.top = "0px";
	opacity.style.opacity = "0.2";
	opacity.style.filter = "alpha(opacity=20)";
	if (!supported501){
		opacity.style.backgroundColor = "#000000";
	}
	else {
		opacity.style.backgroundColor = "#999999";
	}
	opacity.style.width = "385px";
	opacity.style.height = "340px";
	layer.appendChild(opacity);
	
	var resLayer = document.createElement("div");
	resLayer.style.position = "absolute";
	resLayer.style.width = "363px";
	resLayer.style.height = "0px";
	resLayer.style.top = "10px";
	resLayer.style.left = "10px";
	resLayer.style.border = "1px solid #ffffff";
	resLayer.style.display = "none";
	resLayer.style.overflow = "hidden";
	new UIResizer(resLayer,15);
	layer.appendChild(resLayer);

	var text = document.createElement("span");
	text.id = "closeTag";
	text.style.position = "absolute";
	text.style.bottom = "15px";
	text.style.right = "15px";
	text.style.color = "#ffffff";
	text.innerHTML = "Sluiten";
	text.style.fontWeight = "bold";
	text.style.visibility = "hidden";
	text.onclick = function(){toggleClose();layer.resizer.resize(0,20);}

	var img = document.createElement("img");
	img.id = "imgLayer";
	img.style.position = "relative";
	img.style.width = "363px";
	img.style.height = "318px";
	img.style.top = "0px";
	img.style.left = "0px";
	img.onload = grow;
	resLayer.appendChild(img);
	layer.appendChild(text);
	
	new UIResizer(layer,15);
	document.getElementById("innerContainer").appendChild(layer);
	
	var tmp;
	var interval;
	
	for (i = 0; i < images.length; i++){	
		images[i].onclick = function()
		{
			tmp = this.getAttribute("id");
			tmp = tmp.split('_').join('/');
			if (parseInt(layer.style.width)!=385){
				layer.resizer.resize(385,20);
				layer.resizer.resize(385,340,100,toggleClose);
				img.src = tmp;
			}
			else {
				resLayer.resizer.resize(363,0,0,changeImage);
			}
		}
	}
	
	function grow()
	{
		resLayer.style.display = "block";
		resLayer.resizer.resize(363,318);
	}
		
	function toggleClose()
	{
		text.style.visibility = (text.style.visibility=="hidden"?"visible":"hidden");
	}
	
	function changeImage()
	{
		resLayer.style.display = "none";
		img.src = tmp;
	}
}
