var SubMenuHeight = new Array();
SubMenuHeight[0] = 0;

var expandindo = new Array(NrSubMenus + 1);
var encolhendo = new Array(NrSubMenus + 1);

function DrawSubMenu(id, title, items) {
	SubMenuHeight[id] = items.length;

	var positionTop = TopMargin + (SubMenuTitleHeight * (id - 1)) + (SpaceBetweenSubMenus * (id - 1));
	var Height = SubMenuTitleHeight + (SubMenuHeight[id] * SubMenuItemHeight);
	// open div
	document.write('<div class="SubMenu" id="SubMenu' + id + '" style="position:absolute; width:145px; height:' + Height + 'px; z-index:1; overflow: hidden; clip: rect(0 145 ' + SubMenuTitleHeight + ' 0); left: ' + LeftMargin + 'px; top: ' + positionTop + 'px; background-color: #666699">');
	// title
	document.write('<img src="' + SubMenuTitleDir + title + '.gif" height="20" width="122">');

	if (items.length > 1) {
		// arrow
		document.write('<a href="javascript:Expandir(' + id + ')" id="SubMenuLink' + id + '"><img src="' + SubMenuArrowDir + ArrowExpand + '" height="20" width="23" id="SubMenuArrow' + id + '"></a>');
		document.write('<br>');

		// items
		document.write('<div class="SubMenuItems">');
		for (var i = 0; i < items.length; ++i) {
			var temp = items[i].split("|");
			var texto = temp[0];
			if (temp[1]) {
				var url = temp[1];
			}
			else {
				var url = "#";
			}
			document.write('&nbsp;&middot; <a href="' + url + '"');
			if (temp[2]) {
				var target = temp[2];
				document.write(' target="' + target + '"');
			}
			document.write(' class="SubMenuItemsTexto">' + texto + '</a><br>');
		}
		document.write('</div>');
	}
	else {
		// não tem items
		if (items.length == 1) {
			// opção de acesso directo

			var temp = items[0].split("|");
			// texto (que não interessa para este caso)
			var texto = temp[0];
			// url
			if (temp[1]) {
				var url = temp[1];
			}
			else {
				var url = "#";
			}
			// target
			if (temp[2]) {
				var target = temp[2];
			}
			else {
				var target = "_self";
			}

			document.write('<a href="' + url + '" target="' + target + '"><img src="' + SubMenuArrowDir + ArrowGo + '" height="20" width="23" id="SubMenuArrow' + id + '"></a>');
			document.write('<br>');
		}
		else {
			// menu inactivo
			document.write('<img src="' + SubMenuArrowDir + NoArrow + '" height="20" width="23" id="SubMenuArrow' + id + '">');
			document.write('<br>');
		}
	}
	// close div
	document.write('</div>');
}


function Encolher(id) {
	encolhendo[id] = setInterval("Collapse(" + id + ")",5)
	// mudar imagems
	var arrow = document.getElementById("SubMenuArrow" + id);
	arrow.src = SubMenuArrowDir + ArrowExpand;
	// mudar onClick
	var arrowLink = document.getElementById("SubMenuLink" + id);
	arrowLink.href = "javascript:Expandir(" + id + ")";
}

function Collapse(id) {
	var subMenuID = "SubMenu" + id;
	var subMenu = document.getElementById(subMenuID);
	var subMenuNext;
	var currentHeight;

	temp = subMenu.style.clip.split(" ");
	currentHeight = parseInt(temp[2]);
	currentHeight--;
	subMenu.style.clip = "rect(0 175 " + currentHeight + " 0)";

	for (var j = (id + 1) ; j <= NrSubMenus ; ++j) {
		subMenuNext = document.getElementById("SubMenu" + j);
		subMenuNext.style.top = (parseInt(subMenuNext.style.top) - 1) + "px";
	}

	if (currentHeight <= (SubMenuTitleHeight - 1)) {
		subMenu.style.clip = "rect(0 175 " + SubMenuTitleHeight + " 0)";
		clearInterval(encolhendo[id]);
		return;
	}
}

function Expandir(id) {
	// mudar onClick
	var arrowLink = document.getElementById("SubMenuLink" + id);

	if (!arrowLink) {
		// menu que não pode ser expandido (não tem items)
		return;
	}
	arrowLink.href = "javascript:Encolher(" + id + ")";

	// mudar imagems
	var arrow = document.getElementById("SubMenuArrow" + id);
	arrow.src = SubMenuArrowDir + ArrowCollapse;

	// expandir
	expandindo[id] = setInterval("Expand(" + id + ")",5)
}

function Expand(id) {
	var subMenuID = "SubMenu" + id;
	var subMenu = document.getElementById(subMenuID);
	var subMenuNext;
	var currentHeight;

	temp = subMenu.style.clip.split(" ");
	currentHeight = parseInt(temp[2]);
	currentHeight++;
	subMenu.style.clip = "rect(0 175 " + currentHeight + " 0)";

	for (var j = (id + 1) ; j <= NrSubMenus ; ++j) {
		subMenuNext = document.getElementById("SubMenu" + j);
		subMenuNext.style.top = (parseInt(subMenuNext.style.top) + 1) + "px";
	}
	
	if (currentHeight > parseInt(subMenu.style.height)) {
		clearInterval(expandindo[id]);
		return;
	}
}

function DrawMenu() {
		DrawSubMenu(1,"quem_somos",ItemsQuemSomos);
		DrawSubMenu(2,"comissoes_tecnicas",ItemsComissoesTecnicas);
		DrawSubMenu(3,"noticias",ItemsNoticias);
		DrawSubMenu(4,"documentos",ItemsDocumentos);
		DrawSubMenu(5,"calendario",ItemsCalendario);
		DrawSubMenu(6,"regulamentos",ItemsRegulamentos);
		DrawSubMenu(7,"links_uteis",ItemsLinksUteis);
		DrawSubMenu(8,"home",ItemsHome);
}