var PANEL_NORMAL_CLASS    = "panel";
var PANEL_COLLAPSED_CLASS = "panelcollapsed";
var PANEL_HEADING_TAG     = "h2";
var PANEL_CONTENT_CLASS   = "panelcontent";
var PANEL_COOKIE_NAME     = "panels";
var PANEL_ANIMATION_DELAY = 15; /*ms*/
var PANEL_ANIMATION_STEPS = 12;

// class 'js' toevoegen aan html-tag
	document.documentElement.className = "js";

function setUpPanels() {
	var headingTags = document.getElementsByTagName(PANEL_HEADING_TAG);

	for (var i=0; i<headingTags.length; i++) {
		var el = headingTags[i];

		if (el.parentNode.className != PANEL_NORMAL_CLASS && el.parentNode.className != PANEL_COLLAPSED_CLASS)
			continue;

		var name = el.firstChild.nodeValue;

		el.onclick = function() {
			var target    = this.parentNode;
			var name      = this.firstChild.nodeValue;
			var collapsed = (target.className == PANEL_COLLAPSED_CLASS);
			animateTogglePanel(target, collapsed);
		};
	}
}

function animateTogglePanel(panel, expanding) {
	var elements = panel.getElementsByTagName("div");
	var panelContent = null;
	for (var i=0; i<elements.length; i++) {
		if (elements[i].className == PANEL_CONTENT_CLASS) {
			panelContent = elements[i];
			break;
		}
	}

	panelContent.style.display = "block";

	var contentHeight = panelContent.offsetHeight;

	if (expanding)
		panelContent.style.height = "0px";

	var stepHeight = contentHeight / PANEL_ANIMATION_STEPS;
	var direction = (!expanding ? -1 : 1);

	setTimeout(function(){animateStep(panelContent,1,stepHeight,direction)}, PANEL_ANIMATION_DELAY);
}

// Change the height of the target
function animateStep(panelContent, iteration, stepHeight, direction) {
	if (iteration<PANEL_ANIMATION_STEPS) {
		panelContent.style.height = Math.round(((direction>0) ? iteration : 10 - iteration) * stepHeight) +"px";
		iteration++;

		setTimeout(function(){animateStep(panelContent,iteration,stepHeight,direction)}, PANEL_ANIMATION_DELAY);
	} else {
		panelContent.parentNode.className = (direction<0) ? PANEL_COLLAPSED_CLASS : PANEL_NORMAL_CLASS;
		panelContent.style.display = panelContent.style.height = "";
	}
}

// Register setUpPanels to be executed on load
if (window.addEventListener) {
	window.addEventListener("load", setUpPanels, false);
} else if (window.attachEvent) {
	window.attachEvent("onload", setUpPanels);
}