var globalId = 0;
var lastTempX = 0;
var lastWidth = 0;

function showLayer(text, e)
{
	var container = document.getElementById('begrippenContainer');
	var element = document.getElementById('begrippenLabel');

	container.style.display = "block";
	
	tempX = 0;
	tempY = 0;

	if (document.all) {
		tempX = event.clientX + document.documentElement.scrollLeft;
		tempY = event.clientY + document.documentElement.scrollTop;
	} else {
		tempX = e.pageX;
		tempY = e.pageY;
	}	
	
	container.style.left = (tempX) + "px";
	container.style.top = (tempY + 10) + "px";
	element.innerHTML = text;
}

function showLayerImageRight(text, e)
{
	var container = document.getElementById('closeLayer');
	var element = document.getElementById('closeLayerContent');

	container.style.display = "block";
	
	tempX = 0;
	tempY = 0;

	if (document.all) {
		tempX = event.clientX + document.documentElement.scrollLeft;
		tempY = event.clientY + document.documentElement.scrollTop;
	} else {
		tempX = e.pageX;
		tempY = e.pageY;
	}	
	
	container.style.left = (tempX) + "px";
	container.style.top = (tempY + 10) + "px";
	element.innerHTML = text;
}

function moveImage(e)
{
	var img = document.getElementById("mediaLoad"+globalId);
	
	var container = document.getElementById('closeLayer');
	var element = document.getElementById('closeLayerContent');

	var imgWidth = 200;
	if(img.width)
		imgWidth = img.width;
	lastWidth = imgWidth;
	tempX = lastTempX;

	container.style.left = (tempX - imgWidth + 140) + "px";
}

function showLayerImage(id, e)
{
	globalId = id;
	var container = document.getElementById('closeLayer');
	var element = document.getElementById('closeLayerContent');
	var img = document.createElement('img');
	img.id = "mediaLoad" + id;
	img.src="http://www.e-nursing.nl/leren/DeBlobber.php?media_id="+id;
	img.onclick = closeLayer;
	img.onload = moveImage;
	var len = element.childNodes.length;
   
	for(var i = 0; i < len; i++)
	{   
		element.removeChild(element.childNodes[i]);
	}
	element.appendChild(img);
	var imgWidth = lastWidth;
	if(img.width)
		imgWidth = img.width;
		
	
	container.style.display = "block";
	//alert(imgWidth);
	tempX = 0;
	tempY = 0;

	if (document.all) {
		tempX = event.clientX + document.documentElement.scrollLeft;
		tempY = event.clientY + document.documentElement.scrollTop;
	} else {
		tempX = e.pageX;
		tempY = e.pageY;
	}	
	lastTempX = tempX;
	

	container.style.left = (tempX - imgWidth + 140) + "px";
	container.style.top = (tempY + 10) + "px";
}

function closeLayer()
{
	var container = document.getElementById('closeLayer');
	container.style.display = "none";
}

function hideLayer()
{
	var container = document.getElementById('begrippenContainer');
	container.style.display = "none";
}