var g_timer
var _dom

// call this in your onload function
function initPulldown() {
	// insert 2 divs for 2 levels of pulldowns
	document.body.insertAdjacentHTML("AfterBegin","<DIV class='pulldowndiv' id='divpulldown1'></DIV>")
	document.body.insertAdjacentHTML("AfterBegin","<DIV class='pulldowndiv' id='divpulldown2'></DIV>")
	document.onmouseup = function () { clearMenus(); }
}


function renderMenu(p_nMenu, p_nMenuSub, p_dom) {
	var jDom, x = 0, y = 0, width = 0;
	
	if (p_nMenuSub < 0) {
		_dom = p_dom
		
		jDom = $(_dom)
		
		x = jDom.offset().left - 1
		y = jDom.offset().top - 1
		width = jDom.width() - 10
		
		$("#divpulldown1 th").height(jDom.height());
	}

	if (document.getElementById('divpulldown1')) {
		var div1 = document.getElementById('divpulldown1')
		var div2 = document.getElementById('divpulldown2')

		stopClearMenuTimer()

		var l_arrMenu = null

		if (p_nMenuSub < 0) {
			$("#divpulldown2").fadeOut()
			l_arrMenu = g_arrMenu[p_nMenu][2]
		} else {
			l_arrMenu = g_arrMenu[p_nMenu][2][p_nMenuSub][2]
		}

		var l_strHTML = ""

		if (l_arrMenu.length) {
			var l_index = 0
			l_strHTML = "<table class='pulldowntable'>" +
					"<th class='pulldowntableheader'>"+ _dom.innerHTML +"</td>"
			while (l_arrMenu[l_index]) {
				l_strHTML = l_strHTML + "<tr><td class='pulldowntd'  onmouseout='normalTD(this);' onmouseup='document.location=unescape(\"" + l_arrMenu[l_index][0] + "\")' onmouseover='highlightTD(this);"
				if (p_nMenuSub < 0) {
					l_strHTML = l_strHTML + "renderMenu("+ p_nMenu +", "+ l_index +", null);'"
				} else {
					l_strHTML = l_strHTML + "'"
				}
				l_strHTML = l_strHTML + ">"+ l_arrMenu[l_index][1] +"</td></tr>"
				l_index++
			}
			l_strHTML = l_strHTML + "</table>"
		}

		if (p_nMenuSub < 0) {
			// second level menu
			div1.innerHTML = l_strHTML

			div1.style.left = x + 'px'
			div1.style.top = y + 'px'
			$("#divpulldown1 td").width(width);
			$("#divpulldown1").fadeIn()
		} else {
			// first level menu
			div2.innerHTML = l_strHTML
			
			// make sure we give it all the room it needs to render the table
			// before we check to see if it won't fit on the screen
			div2.style.left = '0 px'
			div2.style.top = y + 'px'
			$("#divpulldown2 td").width(width);
			$("#divpulldown2").fadeIn()
			
			if ((x + div2.offsetWidth > document.body.offsetWidth) && (div2.offsetWidth < x)) {
				div2.style.left = (x - div2.offsetWidth - div1.offsetWidth) + 'px'
			} else {
				div2.style.left = x
			}
		}
	}
}


function highlightTD (p_td) {
	p_td.className = "pulldowntdhighlight"
	stopClearMenuTimer()
}

function normalTD (p_td) {
	p_td.className = "pulldowntd"
	resetClearMenuTimer()
}

function clearMenus() {
	$("#divpulldown1").fadeOut()
	$("#divpulldown2").fadeOut()
}

function stopClearMenuTimer() {
	clearTimeout(g_timer)
}

function resetClearMenuTimer() {
	clearTimeout(g_timer)
	g_timer = setTimeout("clearMenus()", 200)
}