var navs;
var navLinks;
var menus;
var cases;
var menuToggle = -1;
function init() {
	if ( document.getElementById("topnav") && document.getElementById("submenus") ) {
		navs = document.getElementById("topnav").getElementsByTagName("li");
		navLinks = document.getElementById("topnav").getElementsByTagName("a");
		menus = document.getElementById("submenus").getElementsByTagName("div");

		// position the menus relative to the nav items
		for (var i = 0; i < navs.length; i++) {
			menus[i].style.left = navs[i].offsetLeft + "px";
		}
	}

	if ( document.getElementById("cases") )
		cases = document.getElementById("cases").getElementsByTagName("div");
}

function toggleMenu(id) {
	if (menuToggle == id || id >= menuToggle) {
		menuToggle = -1;
	} else {
		menuToggle = id;
	}
	viewmenu(id);
}

function resetMenus() {
	for (var i = 0; i < menus.length; i++) {
		unviewMenu(i);
	}
	document.getElementById("backdrop").style.display = "none";
}

function unviewMenu(id) {
	if (menuToggle != id) {
		menus[id].style.display = "none";
		navLinks[id].className = ""
	}
}

function viewMenu(id) {
	resetMenus();
	if (menuToggle < 0 || menuToggle == id) {
		menus[id].style.display = "block";
		navLinks[id].className = "on"
		document.getElementById("backdrop").style.display = "block";
	}
}



function resetCases() {
	for (var i = 0; i < cases.length; i++) {
		unviewCase(i);
	}
	document.getElementById("cases").style.display = "none";
}

function viewCase(id) {
	resetCases();
	document.getElementById("cases").style.display = "block";
	cases[id].style.display = "block";
}

function unviewCase(id) {
	cases[id].style.display = "none";
}