function init() {
    replaceCheckboxes();
    var active = setSectionNavId();
    if ( active != null ) 
    new MenuNav(active);
}

function setSectionNavId() {	
	// controleren welke tab actief is
	var activetab = 1;
	var tabmenu = document.getElementById("MenuNav");
	if (tabmenu == null) return null;
	var aantaltabs = tabmenu.childNodes.length;
	for (i=1; i<aantaltabs; i++) {
		var classname = tabmenu.childNodes[i].className;
		if(classname == "active" || classname == "first active" || classname == "last active") {
			activetab = i;
		}
	}
	var submenu = document.getElementById("sectionNav"+activetab);
	submenu.className = "active";

	return activetab;
}

function uninit(){
}

window.onload = init; 
window.onunload = uninit;

// generic eventhandling
var addEvent = function()
{
	if (document.addEventListener)
	{
		return function(element, type, handler)
		{
			element.addEventListener(type, handler, false);
		}
	}
	else
	{
		function handleEvent(event)
		{
			event = event || fixEvent(window.event);

			var handlers = this.events[event.type], returnValue;
			for (var i in handlers)
			{
				if (handlers.hasOwnProperty(i) && handlers[i].call(this, event) === false)
					returnValue = false;
			}

			return returnValue;
		}
		function fixEvent(event)
		{
			event.preventDefault = preventDefault;
			event.stopPropagation = stopPropagation;
			event.target = event.srcElement;

			return event;
		}
		function preventDefault() { this.returnValue = false; }
		function stopPropagation() { this.cancelBubble = true; }
		function removeAllEvents()
		{
			while ((cachedEvent = eventCache.pop()))
				removeEvent(cachedEvent.element, cachedEvent.type, cachedEvent.handler);
		}

		var guid = 1;
		var eventCache = [];

		return function(element, type, handler)
		{
			if (!handler.$$guid) handler.$$guid = guid++;
			if (!element.events) element.events = {};
			if (!element.events[type])
			{
				element.events[type] = {};
				if (element['on' + type]) element.events[type][0] = element['on' + type];
				element['on' + type] = handleEvent;
			}

			element.events[type][handler.$$guid] = handler;

			if (type != 'unload')
			{
				if (!eventCache.length)
					addEvent(window, 'unload', removeAllEvents);

				eventCache.push(
					{
						element: element,
						type: type,
						handler: handler
					}
				);
			}
		}
	}
}();

var removeEvent = function()
{
	if (document.removeEventListener)
	{
		return function(element, type, handler)
		{
			element.removeEventListener(type, handler, false);
		}
	}
	else
	{
		return function(element, type, handler)
		{
			if (element.events && element.events[type] && handler.$$guid)
				delete element.events[type][handler.$$guid];
		}
	}
}();



function is_ignorable(nod)
{
	return ((nod.nodeType == 3 && !/[^\t\n\r ]/.test(nod.data)) || nod.nodeType == 8);
}

function first_child(par, nodeName)
{
	if (par && par.nodeType == 1)
	{
		var res = par.firstChild;
		if (nodeName)
		{
			nodeName = nodeName.toLowerCase();
			do
			{
				if (res.nodeName.toLowerCase() == nodeName)
					return res;
			}
			while ((res = res.nextSibling));
		}
		else
		{
			do
			{
				if (!is_ignorable(res))
					return res;
			}
			while ((res = res.nextSibling));
		}
	}
	return null;
}

function last_child(par, nodeName)
{
	if (par && par.nodeType == 1)
	{
		var res = par.lastChild;
		if (nodeName)
		{
			nodeName = nodeName.toLowerCase();
			do
			{
				if (res.nodeName.toLowerCase() == nodeName)
					return res;
			}
			while ((res = res.previousSibling));
		}
		else
		{
			do
			{
				if (!is_ignorable(res))
					return res;
			}
			while ((res = res.previousSibling));
		}
	}

	return null;
}

function node_after(sib, nodeName)
{
	if (sib)
	{
		if (nodeName)
		{
			nodeName = nodeName.toLowerCase();
			while ((sib = sib.nextSibling))
			{
				if (sib.nodeName.toLowerCase() == nodeName)
					return sib;
			}
		}
		else
		{
			while ((sib = sib.nextSibling))
			{
				if (!is_ignorable(sib))
					return sib;
			}
		}
	}

	return null;
}


function addClass(element, className)
{
	if (element.className.length)
	{
		var classes = getClassList(element);
		if (classes.indexOf(className) == -1)
		{
			classes.push(className);
			setClassList(element, classes);
		}
	}
	else
		element.className = className;
}

function removeClass(element, className)
{
	var classes = getClassList(element), index;
	if ((index = classes.indexOf(className)) > -1)
	{
		delete classes[index];
		setClassList(element, classes);
	}
}

function replaceClass(element, oldclass, newclass)
{
	var classes = getClassList(element), index;
	if ((index = classes.indexOf(oldclass)) > -1 && classes.indexOf(newclass) == -1)
	{
		classes[index] = newclass;
		setClassList(element, classes);
	}
}

function hasClass(element, className)
{
	var elementClassName = element.className;
	return	elementClassName.length &&
		(	elementClassName == className ||
			getClassRegExp(className).test(elementClassName)
		);
}

function getClassList(element)
{
	return element.className.length ? element.className.split(/\s+/) : [];
}

function setClassList(element, classes)
{
	element.className = classes.join(' ');
}








//-------------------------------------------------------------------------------------
function MenuNav(activeMenu)
{
	this.element = document.getElementById('MenuNav');
	this.navItems = [];
	this.activeMenu = activeMenu;
	this.menuActive = false;
	this.menuItemTimeout = null;
	this.menuTimeout = null;
	this.init();
}

Object.extend(MenuNav.prototype,
{
	init: function()
	{
		if (this.element)
		{
			var navItems = this.element.getElementsByTagName('li'), menuItem, i = 0;
			// We skip the first item since it's the bypass link
			while ((menuItem = navItems[++i]))
			{
				addEvent(menuItem, 'click', this.onClick.bind(this, i));
				addEvent(menuItem, 'mouseover', this.onMouseover.bind(this, i));
				menuItem.SubNav = new SubNav(i, menuItem.offsetLeft);
				this.navItems[i] = menuItem;
			}

			var mainNav = document.getElementById('mainNav');
			if (mainNav)
			{
				addEvent(mainNav, 'mouseover', this.cancelMouseout.bind(this));
				addEvent(mainNav, 'mouseout', this.onMouseout.bind(this, this.activeMenu));
			}

			addEvent(window, 'unload', this.cleanUp.bind(this));
		}
	},
	cleanUp: function()
	{
		this.menuActive = false;
		this.navItems = null;
		this.element = null;
	},
	onClick: function(i)
	{
		clearTimeout(this.menuItemTimeout);
		this.menuActive = true;
		this.handleMouseover(i);
	},
	onMouseover: function(i, e)
	{
		clearTimeout(this.menuItemTimeout);
		if (i != this.activeMenu)
		{
			var timeOut = 200;

			if (this.menuActive)
			{
				var target = e.target || e.srcElement;

				if (target.nodeType == 3)
					target = target.parentNode;

				timeOut = target.nodeName == 'A' ? 50 : 100;
			}

			this.menuItemTimeout = setTimeout(this.onClick.bind(this, i), timeOut);
		}
	},
	onMouseout: function(i)
	{
		clearTimeout(this.menuTimeout);
		clearTimeout(this.menuItemTimeout);
		this.menuTimeout = setTimeout(this.handleMouseout.bind(this, i), 5400);
	},
	cancelMouseout: function()
	{
		clearTimeout(this.menuTimeout);
	},
	handleMouseover: function(i)
	{
		var menu;

		if (this.menuActive && this.navItems && i != this.activeMenu)
		{
			if ((menu = this.navItems[this.activeMenu]))
			{
				removeClass(menu, 'active');
				if (menu.SubNav.element)
				{
					menu.SubNav.handleMouseout();
					removeClass(menu.SubNav.element, 'active');
				}
			}

			this.activeMenu = i;

			if ((menu = this.navItems[this.activeMenu]))
			{
				addClass(menu, 'active');
				if (menu.SubNav.element)
					addClass(menu.SubNav.element, 'active');
			}
		}
	},
	handleMouseout: function(i)
	{
		this.handleMouseover(i);
		this.menuActive = false;
	}
});

function SubNav(id, offset)
{
	this.element = document.getElementById('sectionNav' + id);
	this.offset = offset;
	this.navItems = [];
	this.activeMenu = -1;
	this.menuActive = false;
	this.menuTimeout = null;
	this.menuItemTimeout = null;
	this.init();
}

Object.extend(SubNav.prototype,
{
	init: function()
	{
		if (this.element)
		{
			var menu = first_child(this.element, 'ul'), menuitem, menusubitem, i = 0;
			if (menu)
			{
				menuitem = first_child(menu, 'li');
				if (menuitem)
				{
					var lastitem = null;

					do
					{
						lastitem = menuitem;

						if ((menusubitem = first_child(menuitem, 'div')))
						{
							menuitem.className += 'subitems';
							addEvent(menuitem, 'click', this.onClick.bind(this, i));
							addEvent(menuitem, 'mouseover', this.onMouseover.bind(this, i));

							this.navItems[i++] = menusubitem;
						}
						else
						{
							addEvent(menuitem, 'mouseover', this.handleMouseover.bind(this, -1));
						}
					}
					while ((menuitem = node_after(menuitem, 'li')));
				}
			}

			addEvent(this.element, 'mouseover', this.cancelMouseout.bind(this));
			addEvent(this.element, 'mouseout', this.onMouseout.bind(this));

			menu = null, menuitem = null, menusubitem = null;
			addEvent(window, 'unload', this.cleanUp.bind(this));
		}
	},
	cleanUp: function()
	{
		this.menuActive = false;
		this.navItems = null;
		this.element = null;
	},
	onClick: function(i)
	{
		clearTimeout(this.menuItemTimeout);
		this.menuActive = true;
		this.handleMouseover(i);
	},
	onMouseover: function(i)
	{
		clearTimeout(this.menuItemTimeout);
		if (this.menuActive)
			this.handleMouseover(i);
		else if (i != this.activeMenu)
			this.menuItemTimeout = setTimeout(this.onClick.bind(this, i), 46);
	},
	onMouseout: function(i)
	{
		clearTimeout(this.menuTimeout);
		clearTimeout(this.menuItemTimeout);
		this.menuTimeout = setTimeout(this.handleMouseout.bind(this), 800);
	},
	cancelMouseout: function()
	{
		clearTimeout(this.menuTimeout);
	},
	handleMouseover: function(i)
	{
		if (this.navItems && i != this.activeMenu)
		{
			var menu = this.navItems[this.activeMenu]
			if (menu)
				menu.style.display = 'none';

			this.activeMenu = i;
			if ((menu = this.navItems[this.activeMenu]))
			{
				menu.style.left = menu.parentNode.offsetLeft + 'px';
				menu.style.display = 'block';
			}
		}
	},
	handleMouseout: function()
	{
		this.handleMouseover(-1);
		this.menuActive = false;
	}
});

function Tab(id)
{
	this.element = document.getElementById(id);
	this.tabItems = [];
	this.tablistItems = [];
	this.activeTab = 1;
	this.toggleTimer = null;
	this.init();
}

Object.extend(Tab.prototype,
{
	init: function()
	{
		if (this.element)
		{
			var ul = document.createElement('ul'), li, a;
			var tab = this.element.firstChild, i = 1;
			while (tab)
			{
				if (tab.nodeType == 1)
				{
					this.tabItems[i] = tab;
					li = document.createElement('li');
					a = document.createElement('a');
					a.setAttribute('href', window.location.href + '#' + tab.id);
					a.appendChild(document.createTextNode(i));
					addEvent(a, 'click', function(e) { e.preventDefault(); });
					addEvent(a, 'mouseover', this.setActive.bind(this, i));
					li.appendChild(a);

					if (i != this.activeTab)
					{
						tab.style.display = 'none';
					}
					else
					{
						addClass(li, 'active');
					}

					this.tablistItems[i] = li;
					ul.appendChild(li);

					i++;
				}

				tab = tab.nextSibling;
			}

			this.element.insertBefore(ul, this.element.firstChild);

			addEvent(this.element, 'mouseout', this.startToggle.bind(this));
			addEvent(this.element, 'mouseover', this.stopToggle.bind(this));
			this.startToggle();

			ul = null, li = null, a = null;
			addEvent(window, 'unload', this.cleanUp.bind(this));
		}
	},
	cleanUp: function()
	{
		this.stopToggle();
		this.tablistItems = null;
		this.tabItems = null;
		this.element = null;
	},
	setActive: function(i, e)
	{
		if (i != this.activeTab)
		{
			this.tabItems[this.activeTab].style.display = 'none';
			removeClass(this.tablistItems[this.activeTab], 'active');

			this.activeTab = i;
			this.tabItems[this.activeTab].style.display = '';
			addClass(this.tablistItems[this.activeTab], 'active');
		}

		if (e) e.preventDefault();
	},
	toggle: function()
	{
		var i = this.activeTab + 1;
		if (!this.tabItems[i]) i = 1;

		this.setActive(i);
		this.startToggle();
	},
	startToggle: function()
	{
		this.stopToggle();
		this.toggleTimer = setTimeout(this.toggle.bind(this), Math.round(36000 / (this.activeTab + 1)));
	},
	stopToggle: function()
	{
		if (this.toggleTimer)
		{
			clearTimeout(this.toggleTimer);
			this.toggleTimer = null;
		}
	}
});

// Original source : http://brainerror.net/scripts/javascript/checkbox/

//global variables that can be used by ALL the function son this page.
var inputs;
var imgFalse = '/fileadmin/infraccent/images/filter-optie-uit-22x22.png';
var imgTrue = '/fileadmin/infraccent/images/filter-optie-aan-22x22.png';

function replaceCheckboxes() {
    
    //get all the input fields on the page
    inputs = document.getElementsByTagName('input');

    //cycle trough the input fields
    for(var i=0; i < inputs.length; i++) {

        //check if the input is a checkbox
        if(inputs[i].getAttribute('type') == 'checkbox') {
            
            //create a new image
            var img = document.createElement('img');
            
            //check if the checkbox is checked
            if(inputs[i].checked) {
                img.src = imgTrue;
            } else {
                img.src = imgFalse;
            }

            //set image ID and onclick action
            img.id = 'checkImage'+i;
            //set image 
            img.onclick = new Function('checkChange('+i+')');
            //place image in front of the checkbox
            inputs[i].parentNode.insertBefore(img, inputs[i]);
            
            //hide the checkbox
            inputs[i].style.display='none';
        }
    }
}

//change the checkbox status and the replacement image
function checkChange(i) {

    if(inputs[i].checked) {
        inputs[i].checked = '';
        document.getElementById('checkImage'+i).src=imgFalse;
    } else {
        inputs[i].checked = 'checked';
        document.getElementById('checkImage'+i).src=imgTrue;
    }
}