var txtBrowser = navigator.userAgent
var intIEVersion = parseFloat(txtBrowser.substring(txtBrowser.indexOf('MSIE')+5, txtBrowser.indexOf(';', txtBrowser.indexOf('MSIE'))))
var isIE4 = (navigator.appName.indexOf('Microsoft') > -1 && parseInt(intIEVersion) >= 4)
var isW3C = (document.documentElement) ? true : false
var isNN4 = (document.layers) ? true : false
var isOpera = (navigator.userAgent.indexOf('Opera') > -1)


var hoverfrom = 2;
var depth = 0;
var menuid = 0;

function getIframeDoc(iFrameElement){
	return iFrameElement.contentWindow.document;
}

function getFilename(uri){
	var lastSlash = uri.lastIndexOf("/");
	var queryStringStart = uri.lastIndexOf("?");
	var anchor = uri.lastIndexOf("#");
	if (queryStringStart > -1 && queryStringStart < anchor) return uri.substring(lastSlash+1,queryStringStart);
	if (anchor > -1 && anchor < queryStringStart) return uri.substring(lastSlash+1,anchor);
	else return uri.substring(lastSlash+1);
}

function makeMenu(iFrameElement){
	var sourceDoc = getIframeDoc(iFrameElement);
	var menuMain = sourceDoc.getElementById("menu");
	var elmTbody = menuMain.getElementsByTagName("tbody");
	var sourceElement = elmTbody[0];
	var targetElement = document.getElementById(iFrameElement.attributes.targetid.value);
	//hoverfrom = iFrameElement.attributes.hoverfrom.value
	hoverfrom = 2;
	var root = new MenuRoot(sourceElement, targetElement);
	
	if (isIE4){
		root.Build();
	} else {
		root.BuildElement();
	}
	
}

/*
	Note
	Firefox vind het niet leuk om met outerhtml te werken vandaar dat alles geheel via de dom word ingevoegd; dit kan worden aangeroepen via root.BuildElement()
	Echter vind Internet explorer het niet leuk events via de domapi tekrijgen en deze worden dan ook niet laden. Daarom word die via outerHTML gerenderd.
	root.Build()
*/

/*
	MENU ROOT
	De basis van menu. Hier word naaar de start van het menu in de menu.html gaat.
	Bevat een aantal menu items
*/

function MenuRoot(source, target){
	this.source = source;
	this.target = target;
	this.items = new Array();
	
	elms = source.getElementsByTagName("td");
	for (var elm=0; elm<elms.length; elm++){
		var theElement = elms[elm];
		if (theElement.nodeType == 1){
			this.CreateMenuItem(theElement);
		}
	}
}

MenuRoot.prototype.CreateMenuItem = function(element){
	var item = new MenuItem(element, this);
	this.items.push(item);
}

MenuRoot.prototype.Build = function(){
	
	var html = '<div class="menu">';
	for(var elm=0;elm<this.items.length;elm++){
		if (this.items[elm].IsVisible() ){
			html += this.items[elm].asHTML();
		}
	}
	html += '</div>';
	
	//alert(html);
	
	this.target.innerHTML = html;
}

MenuRoot.prototype.BuildElement = function(){
	var element = document.createElement("div", null);
	for(var elm=0;elm<this.items.length;elm++){
		if (this.items[elm].IsVisible() ){
			element.appendChild( this.items[elm].asElement() );
		}
	}
	this.target.innerHTML = '';
	this.target.appendChild(element);
}

/*
	MENU CLASS
	Een item kan een submenu hebben; deze kan worden gerenderd als normaal maar ook als hover,
	een menu bevat items
*/
function Menu(source, target){
	this.source = source;
	this.target = target;

	this.mainitem;
	this.hover = false;
	
	this.items = new Array();	
	
	for (var i = 0; i< source.length; i++){
		this.CreateItem(source[i]);
	}
	
}

Menu.prototype.IsSelected = function(){
	for (var i = 0; i<this.items.length; i++){
		if (this.items[i].IsSelected()) return true;
	}
	return false;
}

Menu.prototype.isVisible = function(){
	for (var i = 0; i<this.items.length; i++){
		if (this.items[i].IsVisible()) return true;
	}
	return false;
}

Menu.prototype.CreateItem = function(element){
	var item = new MenuItem(element, this);
	this.items.push(item);
}

Menu.prototype.Build = function(){
	this.target.innerHTML = this.source.outerHTML;
}

Menu.prototype.asHTML = function(){
	var divelement = document.createElement("div", null);
	//divelement.setAttribute("class", "menu_level"+depth);
	divelement.className = "menu_level"+depth;
	divelement.setAttribute("id", "menuId"+menuid);
	menuid++;	

	for (var teller = 0; teller<this.items.length; teller++){
		var element = this.items[teller]
		divelement.innerHTML += element.asHTML();
	}
	
	return divelement.outerHTML;
}

Menu.prototype.asElement = function(){
	var divelement = document.createElement("div", null);
	//divelement.setAttribute("class", "menu_level"+depth);
	divelement.className = "menu_level"+depth;
	divelement.setAttribute("id", "menuId"+menuid);
	menuid++;	

	for (var teller = 0; teller<this.items.length; teller++){
		var element = this.items[teller]
		divelement.appendChild(element.asElement());
	}
	
	return divelement;
}

/* 
	MENU ITEM CLASS
	Menu item is de fysieke link. Daarnaast kan een menu item een submenu bevatten
*/
function MenuItem(source, parent){
	this.source = source;
	this.Submenu;
	this.link;
	elmsA = source.getElementsByTagName("a");
	if (elmsA.length > 0) this.SetLink(elmsA[0]);
	
	if (this.source.childNodes){
		var temp = new Array();
		
		for (var i = 0; i<this.source.childNodes.length; i++){
			var elm = this.source.childNodes[i];
			
			if (elm.nodeType == 1){
				if (elm.nodeName.toLowerCase() == 'div'){
					temp.push(elm);
				}
			}
			
		}
		if (temp.length > 0)this.SetSubMenu(temp);
		
	}
}

MenuItem.prototype.IsSelected = function(){
	if (this.link == null || this.link.nodeType == 3) return false;
	var selfActive = getFilename(this.link.getAttribute("href")).toUpperCase() == getFilename(document.location.href).toUpperCase();
	return selfActive;
	
}

MenuItem.prototype.IsVisible = function(){
	var selected = this.IsSelected();
	var menuselected = false;
	if (this.Submenu) menuselected = this.Submenu.isVisible();
	
	return selected || menuselected;
}

MenuItem.prototype.SetLink = function(a){
	this.link = a;
}

MenuItem.prototype.SetSubMenu = function(div){
	this.Submenu = new Menu(div, this);
}

MenuItem.prototype.asHTML = function(){
	var divelement = document.createElement("div", null);
	
	
	//divelement.setAttribute("class", "menuitem"+depth);
	divelement.className = "menuitem"+depth;
	if (this.IsVisible()){
		//divelement.setAttribute("class", "menuitem"+depth+"_active");
		divelement.className = "menuitem"+depth+"_active";
	}
	
	if (depth >= hoverfrom -1 && this.Submenu){
		divelement.setAttribute("onmouseover", "ShowMenu('menuId"+menuid+"', this)");
		divelement.setAttribute("onmouseout", "HideMenu('menuId"+menuid+"')");
	}
	
	if (this.link)divelement.innerHTML += this.link.outerHTML;
	
	
	depth++;
	if (this.Submenu) divelement.innerHTML += this.Submenu.asHTML();
	depth--;
	return divelement.outerHTML;
}

MenuItem.prototype.asElement = function(){
	var divelement = document.createElement("div", null);
	
	
	//divelement.setAttribute("class", "menuitem"+depth);
	divelement.className = "menuitem"+depth;
	if (this.IsVisible()){
		//divelement.setAttribute("class", "menuitem"+depth+"_active");
		divelement.className = "menuitem"+depth+"_active";
	}
	
	if (depth >= hoverfrom -1 && this.Submenu){
		divelement.setAttribute("onmouseover", "ShowMenu('menuId"+menuid+"', this)");
		divelement.setAttribute("onmouseout", "HideMenu('menuId"+menuid+"')");
		//divelement.onmouseover = "javascript:ShowMenu('menuId"+menuid+"', this)";
		//divelement.onmouseout = "javascript:HideMenu('menuId"+menuid+"')";
		//divelement.addEventListener( 'mouseover', ShowMenu('menuId'+menuid, divelement), false );
	}
	
	
	if (this.link){
	var linkelement = document.createElement("a", null);
		linkelement.setAttribute( "href", this.link.attributes.href.value ) 
		linkelement.innerHTML = this.link.innerHTML;
		divelement.appendChild (linkelement);
	}
	//if (this.link)divelement.innerHTML+= this.link.outerHTML;
	
	depth++;
	if (this.Submenu) divelement.appendChild( this.Submenu.asElement() );
	depth--;
	return divelement;
}


/*
	HELPER FUNCTIONS
*/
function findPosX(obj) {
var curleft = 0;

  if (obj.offsetParent)  {
    while (obj.offsetParent) {
      curleft += obj.offsetLeft
      obj = obj.offsetParent;
    }
  }
  else if (obj.x)
    curleft += obj.x;
  return curleft;
}

function findPosY(obj) {
var curtop = 0;

  if (obj.offsetParent)  {
    while (obj.offsetParent) {
      curtop += obj.offsetTop
      obj = obj.offsetParent;
    }
  }
  else if (obj.y)
    curtop += obj.y;
  return curtop;
}

function ShowMenu(id,parent){
	element = document.getElementById(id);
	if (element){
		element.style.display = "block";
		var x = (findPosX(parent) + 120);
		var y = findPosY(parent);
		element.style.left = x;
		element.style.top = y;
	}
}
			
function HideMenu(id){
	element = document.getElementById(id);
	element.style.display = "none";
}