/* MENUE.JS */

//declare the variables
var oTable = document.createElement('TABLE');
var padding = document.createAttribute("cellpadding");
var spacing = document.createAttribute("cellspacing");
padding.nodeValue = "0";
spacing.nodeValue = "0";
oTable.setAttributeNode(padding);
oTable.setAttributeNode(spacing);
var oTBody = document.createElement('TBODY');
var oRow, oCell;
var i;
var col;

//#################################################################################################
//# set the values of col1 and col2 to the last charcters of the names of your images so that the #
//# dark ones for example have a "d" and the bright ones got a "h" at the end                     #
//# u need this because of the changing effect for the onMouseOver and onMouseOut methods         #
//#################################################################################################

var col1 = "d";
var col2 = "h";
var mainCount = 0;

// insert the created elements into oTable.
oTable.appendChild(oTBody);

// creates mainmenue depending on which items are declared as mainmenue items
for (i=0; i<db.length; i++)
{
	if(db[i].indent==0)
	{
		oRow = oTBody.insertRow(mainCount);
  		oCell = oRow.insertCell(0);
		var newName= 'name';
  		oCell.innerHTML='<a onClick="toggel(this.firstChild.getAttributeNode(newName).nodeValue);" onFocus=blur(); onMouseOver="changeGrey(this.firstChild.getAttributeNode(newName).nodeValue);" onMouseOut="changeDark(this.firstChild.getAttributeNode(newName).nodeValue);">'+db[i].display+'</a>';
		mainCount++;
	}
}

// #####################################################################################################
// # be sure that all of your images are in a folder called gfx which is located in the same directory #
// # as your html files                                                                                #
// #####################################################################################################

// changeing color of images to grey on mouseover
function changeGrey(n)
{
	actfile = eval("window.document.images." + n + ".src");
	patharr = actfile.split("/");
	actfile = patharr[patharr.length-1];
	if (actfile.charAt(actfile.length-5) == col1) col = col2; 
	newfile = "gfx/nav/" + actfile.substring(0, actfile.length-5) + col + ".gif";
	targetimg = eval("window.document.images." + n);
	targetimg.src = newfile;
}

// changeing color of images to dark on mouseout
function changeDark(n)
{
	var actfile = eval("window.document.images." + n + ".src");
	var patharr = actfile.split("/");
	actfile = patharr[patharr.length-1];
	if (actfile.charAt(actfile.length-5) == col2) col = col1; 
	var newfile = "gfx/nav/" + actfile.substring(0, actfile.length-5) + col + ".gif";
	var targetimg = eval("window.document.images." + n);
	targetimg.src = newfile;
}

//closes opened submenues
function closeMenue(value)
{
	for(i=value+1;i!=db.length&&db[i].indent==1;i++)
	{
		oTBody.deleteRow(db[value].navnr);
		db[i].state=0;
	}
	db[value].state=0;
}
	
//reacts onclick and opens or closes the submenue		
function toggel(n)
{
	var item = ""
	var value
	item = n.substring(1,n.length);
	value = parseInt(item);
	
	if (db[value].URL!='#') 
	{
		showContent(value);
	}
	if(db[value].state==0)
	{
		// closes open submenue when another item is clicked
		for(i=0;i<db.length;i++)
		{
			if((db[i].state==1)&&(db[i].indent==0))
			{
				closeMenue(i);
					
			}
		}
		// opens the submenue of the clicked item
		if((value!=db.length-1))
		{	
			for(i=value+1;i!=db.length&&db[i].indent==1;i++)
			{
				iRow = oTBody.insertRow(db[value].navnr);
				iCell = iRow.insertCell(0);
				iCell.innerHTML='<a href="javascript:showContent('+i+');" onFocus="blur();" onMouseOver="changeGrey(this.firstChild.getAttributeNode(newName).nodeValue);" onMouseOut="changeDark(this.firstChild.getAttributeNode(newName).nodeValue);">'+db[i].display+'</a>';
				db[i].state=1;
			}
			db[value].state=1;
		}
	}
	//closes submenue when the same item is clicked
	else
	{
		closeMenue(value);
	}
}//END

//changes Headline in another frame
function showContent(line)
{  
	document.getElementById("MainTitle").innerHTML = db[line].mainTitle;
	document.getElementById("SubTitle").innerHTML = db[line].subTitle;
	//alert(document.getElementById("Content").innerHTML);
	var oContent = document.getElementById("Content");
	oContent.deleteRow(0);
	var text = db[line].content;
	//alert(text);
	var tRow = oContent.insertRow(0);
	var tCell = tRow.insertCell(0);
	var valign = document.createAttribute("valign");
	valign.nodeValue = "top";
	tCell.setAttributeNode(valign);
	tCell.innerHTML = text;
}

function footContent(line)
{  
	document.getElementById("MainTitle").innerHTML = foot[line].mainTitle;
	document.getElementById("SubTitle").innerHTML = foot[line].subTitle;
	//alert(document.getElementById("Content").innerHTML);
	var oContent = document.getElementById("Content");
	oContent.deleteRow(0);
	var text = foot[line].content;
	//alert(text);
	var tRow = oContent.insertRow(0);
	var tCell = tRow.insertCell(0);
	var valign = document.createAttribute("valign");
	valign.nodeValue = "top";
	tCell.setAttributeNode(valign);
	tCell.innerHTML = text;
}