var currentContent_id = "";
var currentImage_id = "";
var hideCounter = -1; // idle

function showPopup(content_id, image_id)
{
	var popup = document.getElementById('popup');
	if (popup == null) return;

	if (currentContent_id != "")
	{
		var content = document.getElementById("content" + currentContent_id);
		var image = document.getElementById("klein" + currentImage_id + "-border");
		content.style.visibility = "hidden";
		content.style.display= "none";
		image.className = "muziek";
		currentContent_id = "";
	 }

	var content = document.getElementById("content" + content_id);
	var image = document.getElementById("klein" + image_id + "-border");
	
	if (content != null)
	{
		content.style.visibility = "visible";
		content.style.display = "block";
		image.className = "muziek-selected";
		popup.style.top = getPopupTop(popup, image);
		popup.style.visibility = "visible";         
		currentContent_id = content_id;
		currentImage_id = image_id;
		hideCounter = -1;
	}
}

function getPopupTop(popup, image) 
{
	yPos = image.offsetTop;
	tempEl = image.offsetParent;
	while (tempEl.id != "frame") 
	{
		yPos += tempEl.offsetTop;
		tempEl = tempEl.offsetParent;
	}
	yAbsPos = yPos;
	while (tempEl != null) 
	{
		yAbsPos += tempEl.offsetTop;
		tempEl = tempEl.offsetParent;
	}

	 // image.clientHeight werkt niet bij IE
	 imageClientHeight = 84;

	if (yAbsPos + popup.clientHeight + imageClientHeight + 10 >  document.body.clientHeight + document.body.scrollTop)
	{
		return yPos - popup.clientHeight - 19;
	}
	else
	{
		return yPos + imageClientHeight + 10;
	}
}


function hidePopup()
{
	hideCounter = 5; // 0.5 seconden
}


function doHidePopup()
{
	var popup = document.getElementById('popup');
	if (popup == null) return;

	if (currentContent_id != "")
	{
		var content = document.getElementById("content" + currentContent_id);
		var image = document.getElementById("klein" + currentImage_id + "-border");
		content.style.visibility = "hidden";
		content.style.display= "none";
		image.className = "muziek";
		popup.style.visibility = "hidden";
		currentContent_id = "";
	}  
}
  

function hider()
{
	if (hideCounter >= 0)
	{
		hideCounter--; // -1 is 'idle'
	}
	if (hideCounter == 0)
	{
		doHidePopup();
	}
	setTimeout("hider()", 100);
}

setTimeout("hider()", 100);