// JavaScript Document
var i, j, idx1=0, idx2=0, isIE = false;
var levels = new Array();
		
function populateList(lev, idx){
	var i, a;		
			
	switch(lev){
		case 0:
			a = levOne;						//point to the correct array of items
			break;
		case 1:
			selectItem(levels[lev-1], idx1, idx, "chosenlink");
			idx1 = idx;						//reassign global index for column1
			idx2 = 0;						//reset index of second menu to zero since no items are selected
			a = levTwo[idx1][0];			//point to the right array of items
			break;
		case 2:
			selectItem(levels[lev-1], idx2, idx, "chosenlink");
			idx2 = idx;						//reassign global index for column2
			a = levTwo[idx1][idx2+1];		//uncomment to point to the right array for dynamic level 3 items
			//a = levTwo[0][1];				//uncomment to display a static item in level 3 for every parent item
			break;
	};

	if(lev>=0 && lev<3){
		//clear the current list first
		removeItems(levels[lev]);
		
		//add items to the UL tag
		if(a == "")
			appendLinkToList(levels[lev], "No Items to Display", lev+1, i);
		else
			if(lev == 2)
				//append HTML code to level 3 instead of list items...take out this conditional if you want
				//to display list items in everything
				appendHTMLToDiv(levels[lev], a[0]);
			else
				//append list items if level is not 3
				for(i = 0; i<a.length; ++i)	{ appendLinkToList(levels[lev], a[i], lev+1, i); }
	}
}

function removeItems(list){
	while (list.childNodes.length > 0)
		list.removeChild(list.childNodes[list.childNodes.length - 1]);
}

function selectItem(itm, pid, nid, newclass){
	itm.childNodes[pid].childNodes[0].className = "";
	itm.childNodes[nid].childNodes[0].className = newclass;
}

function appendLinkToList(list, content, lev, idx) {
	var li, a, str;
	
	//create a dynamic LI tag
	li = document.createElement("li");
	
	str = document.createTextNode(content);
	
	if(isIE){//IE specific code		
		//build a link string (for IE) and add it to the LI tag
		li.innerHTML = "<a href='javascript:void(0);' onClick='javascript:populateList("+(lev)+","+idx+");'>"+content+"</a>";
	}	
	else{//for everything else that can handle this code
		//create a A tag object and fill it up with the right info.  The same as making the link string above, but better
		//since we dont have to deal with IE	
		a = document.createElement("a");
		a.appendChild(str);
		a.setAttribute('href','javascript:void(0);');
		a.setAttribute('onClick','javascript:populateList('+(lev)+','+idx+')');
		//append link to LI
		li.appendChild(a);
	}
	
	//append link to UL referenced by LIST parameter
	list.appendChild(li);
}

function appendHTMLToDiv(target, content){
	d = document.createElement("div");
	d.setAttribute('align','center');
	d.setAttribute('vertical-align','middle');
	d.innerHTML = content;
	target.appendChild(d);
}

function init(){
	//browser check and first column initialization
	browserCode = navigator.appName.toLowerCase();
	if(browserCode == "microsoft internet explorer")
		isIE = true;
	//grab column references
	levels[0] = document.getElementById("level_one").getElementsByTagName('ul')[0];
	levels[1] = document.getElementById("level_two").getElementsByTagName('ul')[0];
	levels[2] = document.getElementById("level_three").getElementsByTagName('div')[0];
	populateList(0);
}