/* Funciona casi bien
   Si todos los items tienen submenús va bien...
   Si hay algún item sin submenú, al volver a uno con submenús deja de mostrarse.
*/

function limpiaSubMenu(menu, id)	{
	window[menu].itemActivo = "";
	setTimeout("plegandoSubMenu('" + menu + "', '" + window[menu].subItems[id] + "')", 100)
}

function limpiaMenu(menu, id)	{
	window[menu].itemActivo = "";
	if (window[menu].desplegado)
		setTimeout("plegandoSubMenu('" + menu + "', '" + window[menu].items[id].hijo + "')", 100)
}

function actualizaMenu(menu, id)	{
	yoMismo = window[menu].subItems[id];
	window[menu].itemActivo = yoMismo;
}

function subMenuPlegado(menu, id)	{
	menuPlegado(menu, id);
}

function menuPlegado(menu, id)	{
	if (window[menu].subMenuDesplegado != "")
		document.getElementById(window[menu].subMenuDesplegado).style.visibility = "hidden";
	if (window[menu].itemActivo == "")	{
		window[menu].desplegado = false;
		window[menu].subMenuDesplegado = "";
	}
}

function plegandoSubMenu(menu, id)	{
	if (window[menu].itemActivo == "")
		setTimeout("subMenuPlegado('" + menu + "', '" + id + "')", 100);
}

function chequearSubMenu(menu, id)	{
	var abrirMenu = window[menu].items[id].hijo;
	window[menu].itemActivo = abrirMenu;
		if (window[menu].subMenuDesplegado != "")	{
			if (window[menu].subMenuDesplegado != abrirMenu)
				document.getElementById(window[menu].subMenuDesplegado).style.visibility = "hidden";
			if (window[menu].items[id].evento == "desplegarSubMenu")	{
				window[menu].subMenuDesplegado = window[menu].itemActivo;
				document.getElementById(window[menu].itemActivo).style.visibility = "visible";
			}
		}
}

function desplegarSubMenu(menu, id)	{
	yo = window[menu].items[id].hijo;
	if (!window[menu].listo) window[menu].preparando();
	var estado = !window[menu].desplegado;
	document.getElementById(window[menu].itemActivo).style.visibility = (estado) ? "visible":"hidden";
	window[menu].subMenuDesplegado = (estado) ? yo : "";
	window[menu].desplegado = estado;
}

var fondos;

function anchoTexto(texto)	{
	var control = document.createElement("span");
	control.appendChild(document.createTextNode(texto));
	document.body.appendChild(control);
	ancho = control.offsetWidth;
	document.body.removeChild(control);
	return ancho;
}

function _generar()	{
	fondos = transitar(this.colorFrente.substr(1), this.colorFondo.substr(1), 24);
	with	(this)	{
		salida = "<span id='" + id + "' style='display: block; margin: 0; background-color:";
		salida += colorFondo + "; color: " + colorFrente;
		salida += ";'";
		salida += ">";
		for (elemento in items)	{
			if (elemento != "undefined")	{
				salida += "<span id='" + items[elemento].titulo + "'";
				salida += " onmouseover='cambiaColor(this.id); ";
				salida += " chequearSubMenu(\"" + this.nombre + "\", this.id)'";
				salida += " onmouseout='recuperaColor(this.id);"
				salida += " limpiaMenu(\"" + this.nombre + "\", this.id)'";
				salida += " class='menu'";
				salida += " onclick='" + items[elemento].evento;

				salida += "(\"" + this.nombre + "\", this.id)'";

				salida += " style='background-color: " + colorFondo;
				salida += "; color: " + colorFrente + ";' >";

				salida += "<img src='" + iconos[elemento].src + "'";
				salida += " width='" + tamIcono.split("x")[0] + "px'";
				salida += " height='" + tamIcono.split("x")[1] + "px'";
				salida += " alt='icono' /> ";

				salida += items[elemento].titulo + " </span>";
			}
		}
		salida += "</span>";
		for (subMenu in subMenus)	{
			if (subMenu != "undefined")	{
				salida += "<span id='" + subMenus[subMenu].id + "' style='visibility: hidden; position: absolute; z-index: 10' ";
				salida += ">";
				for (subItem in subMenus[subMenu].subItems)
					if (subItem != "undefined")	{
						if (subMenus[subMenu].subItems[subItem].enlace != "")	{
							salida += "<a href='";
							salida += subMenus[subMenu].subItems[subItem].enlace;
							salida += "' >\n"
						}
						salida += "<span id='" + subMenus[subMenu].subItems[subItem].id + "'";
						salida += " onmouseover='cambiaColor(this.id); ";
						salida += " actualizaMenu(\"" + this.nombre + "\", this.id)'";
						salida += " onmouseout='recuperaColor(this.id);";
						salida += " limpiaSubMenu(\"" + this.nombre + "\", this.id)'";
						salida += " onclick='";
						if (subMenus[subMenu].subItems[subItem].evento != "")
							salida += subMenus[subMenu].subItems[subItem].evento + "; ";
						salida += "menuPlegado";
						salida += "(\"" + this.nombre + "\", this.id)' ";
						salida += " class='submenu' style='cursor: pointer; background-color: " + colorFondo;
						salida += (subMenus[subMenu].subItems[subItem].linea) ? "; border-bottom: 1px solid black" : "";
						salida += "; color: " + colorFrente + ";' >\n";
						salida += "<img src='" + subMenus[subMenu].subItems[subItem].imagen + "'" ;
						salida += " width='" + tamIcono.split("x")[0] + "px'";
						salida += " height='" + tamIcono.split("x")[1] + "px' ";
						salida += " alt='icono' />\n";
						salida += subMenus[subMenu].subItems[subItem].texto;
						salida += "</span>\n";
						if (subMenus[subMenu].subItems[subItem].enlace != "")
							salida += "</a>\n";

					}
				salida += "</span>";
			}
		}
	}
	//x = window.open(); x.document.write("<html><body><textarea rows=20 cols=100>" + salida + "</textarea></body></html>");
	return salida;
}

function _sumarItem(item)	{
	this.items[item.titulo] = item;
	this.items[item.titulo].evento = item.evento;
	this.iconos[item.titulo] = new Image();
	this.iconos[item.titulo].src = item.icono;
	this.eventos[item.titulo] = "desplegarSubMenu";
}

function _sumarSubMenu(item)	{
	this.subMenus[item.id] = item;
	this.items[item.padre].evento = "desplegarSubMenu";
	this.items[item.padre].hijo = item.id;
}

function _sumarSubItem(item)	{
	this.subMenus[item.padre].subItems[item.id] = item;
	this.eventos[item.id] = item.evento;
	this.subItems[item.id] = item.padre;
}

function claseMenu(nombre, id, colorFrente, colorFondo, tamIcono)	{
	this.nombre = nombre;
	this.id = id;
	this.colorFrente = colorFrente;
	this.colorFondo = colorFondo;
	this.tamIcono = tamIcono;
	this.items = new Array();
	this.subMenus = new Array();
	this.iconos = new Array();
	this.eventos = new Array();
	this.subItems = new Array();
	this.sumarItem = _sumarItem;
	this.sumarSubMenu = _sumarSubMenu;
	this.sumarSubItem = _sumarSubItem;
	this.listo = false;
	this.preparando = _preparando;
	this.espera = false;
	this.desplegado = false;
	this.itemActivo = "";
	this.subMenuDesplegado = "";
	this.generar = _generar;
}

function claseItem(titulo, icono, evento)	{
	this.titulo = titulo;
	this.icono = icono
	this.evento = evento;
	this.hijo = "";
}

function objetoSubItem(id, imagen, texto, enlace, evento, padre, linea)	{
	this.id = id;
	this.imagen = imagen;
	this.texto = texto;
	this.enlace = enlace;
	this.evento = evento;
	this.padre = padre;
	this.linea = linea;
}

function mayor(a, b)	{
	return a > b ? a : b;
}

function _acomodarSubMenu()	{
	extraX = parseInt(menu.tamIcono.split("x")[0]) + 20;
	for (i in this.subItems)	if (i != "undefined")	{

		this.ancho = mayor(this.ancho, anchoTexto(this.subItems[i].texto) + extraX);
	}
	for (i in this.subItems)	{
		document.getElementById(this.subItems[i].id).style.width = this.ancho + "px";
		document.getElementById(this.subItems[i].id).style.display = "block";
	}
	var miPapi = document.getElementById(this.padre);
	var yoMismo = document.getElementById(this.id);
	with	(yoMismo.style)	{
		border = "1px solid gray";
		top = (miPapi.offsetTop + 25) + "px";
		left = miPapi.offsetLeft + "px";
	}
}

function _preparando()	{
	for (subM in this.subMenus)
		if (subM != "undefined")	{
			this.subMenus[subM].acomodar();
			this.subMenus[subM].listo = true;
	}
	this.listo = true;
}

function objetoSubMenu(id, padre)	{
	this.id = id;
	this.padre = padre;
	this.subItems = new Array();
	this.listo = false;
	this.ancho = 0;
	this.acomodar = _acomodarSubMenu;
}

