/*-- Javascript functions --*/

function showLarge(image){
	//first select current, next and previous item in array
	var arrBanner = banner.split(",");
	var previous = false;
	var next = false;
	var origI = image.replace(/prcnt20/g, " ");
	for (var i in arrBanner){
		if (arrBanner[i] == origI){
			var n = parseInt(i) + 1;
			var p = parseInt(i) - 1;
			var currentIndex = i;	
			if (arrBanner[n]){
				next = arrBanner[n];	
			}
			if (arrBanner[p]){
				previous = arrBanner[p];	
			}
		}
	}

	
	//first check if overlay exists then create overlay for site
	if (!document.getElementById("imageContainer")){
		var o = createOverlay();
		var i = createImageContainer(image,previous, next);
	
		document.body.appendChild(o);
		document.body.appendChild(i);
	}
	else {
		var i = document.getElementById("imageContainer");
	}
	
	fillContainer(image,previous,next,i);	
}

function createOverlay(){
	var o = document.createElement("div");
	var i =document.createElement("div");
	o.id ='overlay';
	o.onclick = function() { removeOverlay() };
	i.className = 'imageContainer';
	return o;
}

function createImageContainer(current,previous, next){
	var c = document.createElement("div");
	
	
	c.id = "imageContainer";
	
	return c;
}

function fillContainer(current,previous,next, c){
	var origI = current.replace(/prcnt20/g, " ");
	var innerhtml;
	if (previous){
		var urlPrevious = previous.replace(/ /g, 'prcnt20');
	}
	if (next){
		var urlNext = next.replace(/ /g, "prcnt20");
	}

	
	innerhtml = "";
	if (previous){
		innerhtml += "<div id='buttonPrev'><img src='images/previous.gif' onclick=\"showLarge('" + urlPrevious + "')\" /></div>";
	}
	innerhtml += "<div id='imageLarge'><img src='afbeeldingen/large/" + origI + "' class='imageLarge' /></div>";
	innerhtml += "<div id='largeClose'><a href='#' onclick='removeOverlay()'>Sluiten</a></div>";
	if (next){
		innerhtml += "<div id='buttonNext'><img src='images/next.gif' onclick=\"showLarge('" + urlNext + "')\" /></div>";
	}
	
	//if (previous){ c.appendChild(p)	}
	//if (next) { c.appendChild(n); }
	//c.appendChild(i);	
	c.innerHTML = innerhtml;
}

function removeOverlay(){
	var o = document.getElementById("overlay");
	var i = document.getElementById("imageContainer");
	o.parentNode.removeChild(o);
	i.parentNode.removeChild(i);
}