
/*   --------------------------- Navigation object(s) ----------------------- */	

function Navigation() {
	this.base = '';
	this.sections = new Array();
	this.level = 0;
	this.selectedSection = '';
	this.selectedItem = '';	
	this.timeoutId = 0;
}

function Section(name, filename, url, isTopLevel) {
	this.name = name;
	this.filename = filename;
	this.url = url;
	this.id = toId(name);
	this.isTopLevel = 0;
	if (isTopLevel) this.isTopLevel = isTopLevel;
	this.visibility = false;
	this.items = new Array();
}

function Item(name, url) {
	this.name = name;
	this.url = url;
	this.id = toId(name);
	this.items = new Array();
}

Navigation.prototype.init = function() {
	this.navForm = document.forms['navForm'];
	if (this.navForm.niveau.value != "") this.level = parseInt(this.navForm.niveau.value, 10);
	if (this.navForm.hoofd_onderdeel.value != "") this.selectedSection = toId(this.navForm.hoofd_onderdeel.value);
	if (this.navForm.sub_onderdeel.value != "") this.selectedItem = toId(this.navForm.sub_onderdeel.value);
	this.createHTML();
}

Navigation.prototype.addSection = function(name, filename, url, isTopLevel) {
	this.sections[this.sections.length] = new Section(name, filename, url, isTopLevel);
}

Navigation.prototype.addItem = function(name, url) {
	var navSection = this.sections[this.sections.length-1];
	navSection.hasChildren = true;
	navSection.items[navSection.items.length] = new Item(name, url);
}

Navigation.prototype.positionMenu = function(nr) {
	offsetLeft = -2;
	offsetTop = 10;
	if (isIE && isMAC) offsetTop = 16;
	if (isNN6) offsetTop = 10;
	if (isNN6 && (navigator.userAgent.indexOf('6.0') == -1)) offsetTop = 10;
	menuLeft = getImageLeft('pos_' + nr, 'mainNavigation') + offsetLeft;
	menuTop = getImageTop('pos_' + nr, 'mainNavigation') + offsetTop;
	moveLayer('menu_' + nr, menuLeft, menuTop);
}

Navigation.prototype.showMenu = function(nr) {
	if (!this.sections[nr].isTopLevel) {
		clearTimeout(this.timeoutId);
		this.positionMenu(nr);
		this.hideMenus();
		this.sections[nr].visibility = true;
		showLayer('menu_' + nr);
	}
}
	
Navigation.prototype.initHideMenu = function(nr) {
	if (this.sections[nr].items.length != 0 && !this.sections[nr].isTopLevel) {
		this.sections[nr].visibility = false;
		obj = this;
		this.timeoutId = setTimeout('obj.hideMenu(' + nr + ')', 500);
	}
}

Navigation.prototype.hideMenu = function(nr) {
	clearTimeout(this.timeoutId);
	if (!this.sections[nr].visibility) {	
		if (this.sections[nr].items.length != 0 && !this.sections[nr].isTopLevel) hideLayer('menu_' + nr);
	}
}

Navigation.prototype.hideMenus = function() {
	for (var i=0; i<this.sections.length; i++) {
		if (this.sections[i].items.length != 0 && !this.sections[i].isTopLevel) {
				this.sections[i].visibility = false;
				this.hideMenu(i);
		}
	}
}


Navigation.prototype.createHTML = function() {
	// determine path
	this.path = '';
	for (var i=0; i<this.level; i++) {
		this.path += '../';
	}
	
	//create main menu: topLevel
	str = '';
	str += '<table border="0" cellpadding="1" cellspacing="0" bgcolor="#00AE6D"><tr><td>';
	str += '<table border="0" cellpadding="0" cellspacing="0" bgcolor="#E6E6E6"><tr>';
	for (var i=0; i<this.sections.length; i++) {
		if (this.sections[i].isTopLevel) {
			if (i != 0) str += '<td width="1" bgcolor="#00AE6D"><img src="' + this.path + 'media/spacer.gif" width="1" height="1" alt="" border="0"></td>';
			str += '<td><a href="' + this.path + this.sections[i].url + '">';
			if (this.sections[i].id == this.selectedSection) {
				str += '<img src="' + this.path + 'media/navigation/bn_' + this.sections[i].filename + '_sel.gif" alt="" border="0"></a></td>';
			} else {
				str += '<img src="' + this.path + 'media/navigation/bn_' + this.sections[i].filename + '.gif" alt="" border="0"></a></td>';
			}
		}
	}
	str += '</tr></table></td></tr></table>';
	str += '\n\n';
	// alert(str);
	document.getElementById('topNavigation').innerHTML = str;
	
	//create main menu: normal navigation
	str = '';
	str += '<table border="0" cellpadding="0" cellspacing="0"><tr>';
	for (var i=0; i<this.sections.length; i++) {
		if (!this.sections[i].isTopLevel) {
			str += '<td width="3"><img src="' + this.path + 'media/spacer.gif" width="3" height="1" alt="" border="0"></td>';
			str += '<td width="1"><img id="pos_' + i + '" src="' + this.path + 'media/spacer.gif" width="1" height="1" alt="" border="0" style="position: absolute;"></td>';
			str += '<td><a href="' + this.path + this.sections[i].url + '" onMouseover="hideMenus(); showMenu(' + i + '); " onMouseout="initHideMenu(' + i + ');">';
			if (this.sections[i].id == this.selectedSection) {
				str += '<img src="' + this.path + 'media/navigation/bn_' + this.sections[i].filename + '_sel.gif" height="17" alt="" border="0"></a></td>';
			} else {
				str += '<img id="bn_' + i + '" src="' + this.path + 'media/navigation/bn_' + this.sections[i].filename + '.gif" height="17" alt="" border="0" onMouseOver="navMouseOver(' + i + ')" onMouseOut="navMouseOut(' + i + ')"></a></td>';
			}
		}
	}
	str += '</tr></table>\n\n';
	// alert(str);
	document.getElementById('mainNavigation').innerHTML = str;
	
	// create expandable menus
	str = '';
	for (var i=0; i<this.sections.length; i++) {
		str += '<div id="menu_' + i + '" style="position: absolute; left: -100px; top: -100px; width: 128px;  z-index: 3; visibility: hidden;" onMouseover="showMenu(' + i + ');" onMouseout="initHideMenu(' + i + ');">';
		if ((this.sections[i].items.length != 0) && (!this.sections[i].isTopLevel)) {
			str += '<table border="0" cellpadding="1" cellspacing="0" width="128"><tr><td class="borderSubMenu">';
			str += '<table border="0" cellpadding="0" cellspacing="0" width="126">';
			for (var j=0; j<this.sections[i].items.length; j++) {
				str += '<tr><td class="bgSubMenu" style="padding: 4px 8px 4px 13px;" valign="top">';
				str += '<a href="' + this.path + this.sections[i].items[j].url + '" class="dropDownMenu" onMouseover="showMenu(' + i + ');">' + this.sections[i].items[j].name + '</a>';
				str += '</td></tr>';
				if (j != this.sections[i].items.length - 1) {
					str += '<tr><td height="1" class="borderSubMenu"><img src="' + this.path + 'media/spacer.gif" width="1" height="1" alt="" border="0"></td></tr>';
				}
			}
			str += '</table></td></tr></table>';
		}
		str += '</div>\n\n';
	}
	// alert(str);
	document.getElementById('subMenus').innerHTML = str;
	
	for (var i=0; i<this.sections.length; i++) {
		if (this.sections[i].id == this.selectedSection) {
			// create title 
			str = '';
			str += '<img src="' + this.path + 'media/titles/' + this.sections[i].filename + '.gif" alt="" width="218" height="18" border="0">';
			document.getElementById('title').innerHTML = str;
			
			//create subnavigation
			str = '';
			str += '<table border="0" cellpadding="0" cellspacing="0" width="160">';
			for (var j=0; j<this.sections[i].items.length; j++) {
				var dir = '';
				var imgType = '';
				var cssClass = 'subnav';
				if (this.sections[i].items[j].id == this.selectedItem) {
					imgType = '_sel';
					cssClass = 'subnavSelected';
					dir = this.sections[i].filename + '/';
				}
				
				if (j==0) {
					// first item
					str += '<tr><td width="12" valign="top" background="' + this.path + 'media/navigation/' + dir + 'subnav_bullet_top' + imgType + '.gif">';
				} else if (j != this.sections[i].items.length - 1) {
					str += '<tr><td width="12" valign="top" background="' + this.path + 'media/navigation/' + dir + 'subnav_bullet' + imgType + '.gif">';
				} else {
					// last item
					str += '<tr><td width="12" valign="top" background="' + this.path + 'media/navigation/' + dir + '/subnav_bullet_bottom' + imgType + '.gif">';
				}
				
				str += '<img src="' + this.path + 'media/spacer.gif" width="12" height="14" alt="" border="0"></td>';
				str += '<td width="148" valign="top" style="padding-left: 3px;">';
				str += '<a href="' + this.path + this.sections[i].items[j].url + '" class="' + cssClass + '">';
				str += this.sections[i].items[j].name + '</a>';
				str += '</td></tr>';
				
				// divider
				if (j != this.sections[i].items.length - 1) {
					str += '<tr><td colspan="2"><img src="' + this.path + 'media/navigation/subnav_line.gif" width="12" height="14" alt="" border="0"></td></tr>';
				}
			}
			str += '</table>\n\n';
			// alert(str);
			document.getElementById('subNavigation').innerHTML = str;
		}
	}
}

function navMouseOver(nr) {
	if (element('bn_' + nr).src.indexOf('_over.gif') == -1) { 
		element('bn_' + nr).src = element('bn_' + nr).src.replace('.gif', '_over.gif');
	}
}

function navMouseOut(nr) {
	if (element('bn_' + nr).src.indexOf('_over.gif') != -1) { 
		element('bn_' + nr).src = element('bn_' + nr).src.replace('_over.gif', '.gif');
	}
}

function createNavigation() {
	nav.init();
}

function showMenu(nr) {
	nav.showMenu(nr);
}

function initHideMenu(nr) {
	nav.initHideMenu(nr);
}

function hideMenus() {
	nav.hideMenus();
}

