// Proyecto: Aguirre Soluciones Integrales
// Desarrollo: Navegacion HTML. En base XML + JS
//
// Javier Brizuela

//Inicialización
var xml = null;
var xml_content = null;
var browser = null;
var lastImg = null;
var lastSubmenu = null;
var lastMenu = null;
var submenu_positions = new Array(94,216,371,458,553,600);
var submenu_timer = null;
var isSubmenu = null;
var hide_menu_timer = null;
var over_menu = null;
var over_submenu = null;

//Creacion del objeto
if(window.ActiveXObject)
{
	browser = 1;
	xml = new ActiveXObject("Microsoft.XMLDOM");
}else
{
	browser = 2;
	xml = document.implementation.createDocument("","",null);
}

//Verifico el estado de carga del xml
verify = function()
{
	if(xml.readyState != 4)
	{
		return false;
	}
	else
	{
		createNavigationElements(xml.documentElement);
	}
}

//Carga del documento xml
loadXML = function(xmlFile)
{
	if(browser == 1)
	{
		//Si es iexplore
		xml.async="false";
		xml.onreadystatechange = verify;
		xml.load(xmlFile);
	}
	else if(browser == 2)
	{
		//Si es Mozilla, Firefox, Opera
		xml = document.implementation.createDocument("", "", null);
 
		xml.async="false";
		xml.onload = function (evt) {Show (xml);};
		xml.load(xmlFile);

		//var xmlData = xml.documentElement;
	}
	else
	{
		alert("Su navegador no puede correr este script.");
	}
}

function Show(xmlDoc)
{
	createNavigationElements_FF(xmlDoc.documentElement);	
}

//Parsea el documento xml y crea los elementos de la navegacion
createNavigationElements_FF = function(xmlElement)
{
	//Nivel A
	var path_lvl_1 = xmlElement.attributes[0].nodeValue;
	var newHTMLDIVs = "";
	
	//var nombre_lvl_1 = xmlElement.getAttribute('nombre');
	categorias = xmlElement.children;	
	
	for(i=0;i < categorias.length;i++)
	{	
		newHTMLDIVs = newHTMLDIVs + '<div id="menu'+i+'" style="position: absolute; left: '+submenu_positions[i]+'px; top: 119px; width: 180px; display: none;">';
		newHTMLDIVs = newHTMLDIVs + '	<table id="menu" width="100%" border="0" cellspacing="0" cellpadding="0">';
		newHTMLDIVs = newHTMLDIVs + '		<tr>';
		newHTMLDIVs = newHTMLDIVs + '			<td style="padding-top: 2px;">';

		var path_lvl_2 = categorias[i].attributes[1].nodeValue; 
		var nombre_lvl_2 = categorias[i].attributes[0].nodeValue;		
		
		if(categorias[i].children.length > 0)
		{
			//Nivel B
			var node_menu = categorias[i].children;
			newHTMLDIVs = newHTMLDIVs + '		   <table id="submenu_bg" width="100%" border="0" cellspacing="0" cellpadding="0" onMouseOver="clearHide(event)" onMouseOut="startHide(event)">';
			newHTMLDIVs = newHTMLDIVs + '					<tr>';
			newHTMLDIVs = newHTMLDIVs + '						<td>';
			newHTMLDIVs = newHTMLDIVs + '							<table id="submenu" width="100%" border="0" cellspacing="0" cellpadding="0">';
			
			for(j=0; j<node_menu.length; j++)
			{
				if(!node_menu[j].children.length > 0)
				{
					newHTMLDIVs = newHTMLDIVs + '							  <tr>';
					
					if(node_menu[j].attributes[2].nodeValue == "1")
					{
						//newHTMLDIVs = newHTMLDIVs + '								<a href="'+path_lvl_1+path_lvl_2+node_menu[j].attributes[1].nodeValue+'?titulo='+node_menu[j].attributes[0].nodeValue+'&visual_path='+nombre_lvl_2+'&tab=0&folder_path=detalle">';
						newHTMLDIVs = newHTMLDIVs + '									<td id="'+j+'" class="submenu" onMouseOver="selectMenu_FF(event,0)" onMouseOut="deselectMenu_FF(event,0)" onClick="window.location.href=' + "'" +path_lvl_1+path_lvl_2+node_menu[j].attributes[1].nodeValue+'?titulo='+node_menu[j].attributes[0].nodeValue+'&visual_path='+nombre_lvl_2+'&tab=0&folder_path=detalle'+ "'" +'">'+node_menu[j].attributes[0].nodeValue+'</td>';
						//newHTMLDIVs = newHTMLDIVs + '								</a>';
					}
					else
					{
						newHTMLDIVs = newHTMLDIVs + '									<td id="'+j+'" class="submenu" onMouseOver="selectMenu_FF(event,0)" onMouseOut="deselectMenu_FF(event,0)">'+node_menu[j].attributes[0].nodeValue+'</td>';
					}
					newHTMLDIVs = newHTMLDIVs + '							  </tr>';
				}
				else
				{
					var node_submenu = node_menu[j].children;
					
					newHTMLDIVs = newHTMLDIVs + '							  <tr><td class="submenu_bg_childnodes">';
					newHTMLDIVs = newHTMLDIVs + '									<table width="100%" border="0" cellspacing="0" cellpadding="0"><tr>';
					newHTMLDIVs = newHTMLDIVs + '										<td id="'+j+'" class="submenu_childnodes" onClick="urgentSubmenu_FF(event,'+i+','+j+')" onMouseOver="submenuTimer_FF(event,'+i+','+j+')" onMouseOut="deselectMenu_FF(event, 1)">'+node_menu[j].attributes[0].nodeValue+'</td>';
					newHTMLDIVs = newHTMLDIVs + '							  		</tr></table>';
					newHTMLDIVs = newHTMLDIVs + '							  </tr></td>';
				}
			}
			
			newHTMLDIVs = newHTMLDIVs + '							</table>';
			newHTMLDIVs = newHTMLDIVs + '						</td>';
			newHTMLDIVs = newHTMLDIVs + '					</tr>';
			newHTMLDIVs = newHTMLDIVs + '			</table>';
		}
		
		
		newHTMLDIVs = newHTMLDIVs + '				</td>';
		newHTMLDIVs = newHTMLDIVs + '			</tr>';
		newHTMLDIVs = newHTMLDIVs + '		</table>';		
		newHTMLDIVs = newHTMLDIVs + '	</div>';	
		 
	}
	
	
	//NIVEL C!
	for(i=0;i<categorias.length;i++)
	{
		var submenu_top = 119;
		var path_lvl_2 = categorias[i].attributes[1].nodeValue;
		var nombre_lvl_2 = categorias[i].attributes[0].nodeValue;
		var node_menu = categorias[i].children;
		
		for(j=0; j<node_menu.length; j++)
		{
			if(node_menu[j].children.length > 0)
			{
				var path_lvl_3 = node_menu[j].attributes[1].nodeValue;
				var nombre_lvl_3 = node_menu[j].attributes[0].nodeValue;
				var node_submenu = node_menu[j].children;
				
				newHTMLDIVs = newHTMLDIVs + '	<div id="sub'+i+'_'+j+'" style="position: absolute; left: '+(submenu_positions[i]+179)+'px; top: '+submenu_top+'px; width: 180px; display: none;">';
				newHTMLDIVs = newHTMLDIVs + '		<table id="sub" width="100%" border="0" cellspacing="0" cellpadding="0" onMouseOver="clearHide(event)" onMouseOut="startHide(event)">';
				newHTMLDIVs = newHTMLDIVs + '			<tr>';
				newHTMLDIVs = newHTMLDIVs + '				<td style="padding-top: 2px;">';
				newHTMLDIVs = newHTMLDIVs + '				   <table id="submenu_bg" width="100%" border="0" cellspacing="0" cellpadding="0">';
				newHTMLDIVs = newHTMLDIVs + '						<tr>';
				newHTMLDIVs = newHTMLDIVs + '							<td>';
				newHTMLDIVs = newHTMLDIVs + '								<table id="submenu" width="100%" border="0" cellspacing="0" cellpadding="0">';
				
				for(h=0; h < node_submenu.length; h++)
				{
					newHTMLDIVs = newHTMLDIVs + '							  <tr>';
					if(node_submenu[h].attributes[2].nodeValue == "1")
					{
						//newHTMLDIVs = newHTMLDIVs + '								<a href="'+path_lvl_1+path_lvl_2+path_lvl_3+node_submenu[h].attributes[1].nodeValue+'?titulo='+node_submenu[h].attributes[0].nodeValue+'&visual_path='+nombre_lvl_2+','+nombre_lvl_3+'&tab=0&folder_path=detalle">';
						newHTMLDIVs = newHTMLDIVs + '									<td id="'+j+'" class="submenu" onMouseOver="selectMenu_FF(event,2)" onMouseOut="deselectMenu_FF(event,0)" onClick="window.location.href=' + "'" + path_lvl_1+path_lvl_2+path_lvl_3+node_submenu[h].attributes[1].nodeValue+'?titulo='+node_submenu[h].attributes[0].nodeValue+'&visual_path='+nombre_lvl_2+','+nombre_lvl_3+'&tab=0&folder_path=detalle' + "'" + '">'+node_submenu[h].attributes[0].nodeValue+'</td>';
						//newHTMLDIVs = newHTMLDIVs + '								</a>';
					}
					else
					{
						newHTMLDIVs = newHTMLDIVs + '									<td id="'+j+'" class="submenu" onMouseOver="selectMenu_FF(event,2)" onMouseOut="deselectMenu_FF(event,0)">'+node_submenu[h].attributes[0].nodeValue+'</td>';
					}
					newHTMLDIVs = newHTMLDIVs + '							  </tr>';
				}
				newHTMLDIVs = newHTMLDIVs + '								</table>';
				newHTMLDIVs = newHTMLDIVs + '							</td>';
				newHTMLDIVs = newHTMLDIVs + '						</tr>';
				newHTMLDIVs = newHTMLDIVs + '					</table>';
				newHTMLDIVs = newHTMLDIVs + '				</td>';
				newHTMLDIVs = newHTMLDIVs + '			</tr>';
				newHTMLDIVs = newHTMLDIVs + '		</table>';
				newHTMLDIVs = newHTMLDIVs + '	</div>';			
			}
			submenu_top = submenu_top+20;
		}
	}
	
	var fragment = create(newHTMLDIVs);		 
	document.body.insertBefore(fragment, document.body.childNodes[0]);
} 
 
 function create(htmlStr) 
 {    
	var frag = document.createDocumentFragment(), temp = document.createElement('div');    
	temp.innerHTML = htmlStr;    
	while (temp.firstChild) 
	{        
		frag.appendChild(temp.firstChild);    
	}    
	return frag;
}
 
//Parsea el documento xml y crea los elementos de la navegacion
createNavigationElements = function(xmlElement)
{
	//Nivel A
	var path_lvl_1 = xmlElement.getAttribute('path');
	
	var nombre_lvl_1 = xmlElement.getAttribute('nombre');
	categorias = xmlElement.childNodes;
	
	for(i=0;i<categorias.length;i++)
	{
		document.write('<div id="menu'+i+'" style="position: absolute; left: '+submenu_positions[i]+'px; top: 119px; width: 180px; display: none;">');
		document.write('	<table id="menu" width="100%" border="0" cellspacing="0" cellpadding="0">');
		document.write('		<tr>');
		document.write('			<td style="padding-top: 2px;">');
		var path_lvl_2 = categorias[i].getAttribute('path');
		var nombre_lvl_2 = categorias[i].getAttribute('nombre');
		if(categorias[i].hasChildNodes){
			//Nivel B
			var node_menu = categorias[i].childNodes;
			document.write('		   <table id="submenu_bg" width="100%" border="0" cellspacing="0" cellpadding="0" onMouseOver="clearHide()" onMouseOut="startHide()">');
			document.write('					<tr>');
			document.write('						<td>');
			document.write('							<table id="submenu" width="100%" border="0" cellspacing="0" cellpadding="0">');
			for(j=0; j<node_menu.length; j++){
				if(!node_menu[j].hasChildNodes){
					document.write('							  <tr>');
					if(node_menu[j].getAttribute('enabled')=="1"){
						document.write('								<a href="'+path_lvl_1+path_lvl_2+node_menu[j].getAttribute('path')+'?titulo='+node_menu[j].getAttribute('nombre')+'&visual_path='+nombre_lvl_2+'&tab=0&folder_path=detalle">');
						document.write('									<td id="'+j+'" class="submenu" onMouseOver="selectMenu(0)" onMouseOut="deselectMenu(0)">'+node_menu[j].getAttribute('nombre')+'</td>');
						document.write('								</a>');
					}else{
						document.write('									<td id="'+j+'" class="submenu" onMouseOver="selectMenu(0)" onMouseOut="deselectMenu(0)">'+node_menu[j].getAttribute('nombre')+'</td>');
					}
					document.write('							  </tr>');
				}else{
					var node_submenu = node_menu[j].childNodes;
					document.write('							  <tr><td class="submenu_bg_childnodes">');
					document.write('									<table width="100%" border="0" cellspacing="0" cellpadding="0"><tr>');
					document.write('										<td id="'+j+'" class="submenu_childnodes" onClick="urgentSubmenu('+i+','+j+')" onMouseOver="submenuTimer('+i+','+j+')" onMouseOut="deselectMenu(1)">'+node_menu[j].getAttribute('nombre')+'</td>');
					document.write('							  		</tr></table>');
					document.write('							  </tr></td>');
				}
			}
			document.write('							</table>');
			document.write('						</td>');
			document.write('					</tr>');
			document.write('			</table>');
		}
	document.write('				</td>');
	document.write('			</tr>');
	document.write('		</table>');
	document.write('	</div>');
	}
	
	//NIVEL C!
	for(i=0;i<categorias.length;i++)
	{
		var submenu_top = 119;
		var path_lvl_2 = categorias[i].getAttribute('path');
		var nombre_lvl_2 = categorias[i].getAttribute('nombre');
		var node_menu = categorias[i].childNodes;
		for(j=0; j<node_menu.length; j++){
			if(node_menu[j].hasChildNodes){
				var path_lvl_3 = node_menu[j].getAttribute('path');
				var nombre_lvl_3 = node_menu[j].getAttribute('nombre');
				var node_submenu = node_menu[j].childNodes;
				document.write('	<div id="sub'+i+'_'+j+'" style="position: absolute; left: '+(submenu_positions[i]+179)+'px; top: '+submenu_top+'px; width: 180px; display: none;">');
				document.write('		<table id="sub" width="100%" border="0" cellspacing="0" cellpadding="0" onMouseOver="clearHide()" onMouseOut="startHide()">');
				document.write('			<tr>');
				document.write('				<td style="padding-top: 2px;">');
				document.write('				   <table id="submenu_bg" width="100%" border="0" cellspacing="0" cellpadding="0">');
				document.write('						<tr>');
				document.write('							<td>');
				document.write('								<table id="submenu" width="100%" border="0" cellspacing="0" cellpadding="0">');
				for(h=0; h<node_submenu.length; h++){
					document.write('							  <tr>');
					if(node_submenu[h].getAttribute('enabled')=="1"){
						document.write('								<a href="'+path_lvl_1+path_lvl_2+path_lvl_3+node_submenu[h].getAttribute('path')+'?titulo='+node_submenu[h].getAttribute('nombre')+'&visual_path='+nombre_lvl_2+','+nombre_lvl_3+'&tab=0&folder_path=detalle">');
						document.write('									<td id="'+j+'" class="submenu" onMouseOver="selectMenu(2)" onMouseOut="deselectMenu(0)">'+node_submenu[h].getAttribute('nombre')+'</td>');
						document.write('								</a>');
					}else{
						document.write('									<td id="'+j+'" class="submenu" onMouseOver="selectMenu(2)" onMouseOut="deselectMenu(0)">'+node_submenu[h].getAttribute('nombre')+'</td>');
					}
					document.write('							  </tr>');
				}
				document.write('								</table>');
				document.write('							</td>');
				document.write('						</tr>');
				document.write('					</table>');
				document.write('				</td>');
				document.write('			</tr>');
				document.write('		</table>');
				document.write('	</div>');			
			}
			submenu_top = submenu_top+20;
		}
	}
}

//Muestra el menu seleccionado
showMenu = function(e)
{
	clearHide();
	if (window.event) 
	{
		imgObj = window.event.srcElement;
	}
	else
	{
		imgObj = e.target;
	}
	
	if(lastImg != null)
	{
		//Closes the last opened menu
		lastMenu.style.display = "none";
		lastImg.src = "imgs/sk1nv7/nav_button_"+lastImg.id+".gif";
	}
	
	closeLastSubmenu();
	
	lastSubmenuId = imgObj.id;
	lastImg = imgObj;
	imgObj.src = "imgs/sk1nv7/nav_rollover_"+imgObj.id+".gif";
	menuObj = document.getElementById('menu'+(imgObj.id-2));

	menuObj.style.display = "";
	lastMenu = menuObj;
}

//Timer de oculta menu
startHide = function(e)
{
	hide_menu_timer = setTimeout("closeLastMenu();", 1500);
}
clearHide = function()
{
	clearTimeout(hide_menu_timer);
}

//Seleccionar el menu
selectMenu = function(classId, td)
{
	if(td == null)
	{
		tdObj = window.event.srcElement;
	}
	else
	{
		tdObj = td;
	}
	if(classId==1)
	{
		tdObj.className = "submenu_childnodes_rollover";
	}
	else if(classId==0)
	{
		tdObj.className = "submenu_rollover";
		closeLastSubmenu();
	}
	else if(classId==2)
	{
		tdObj.className = "submenu_rollover";
	}
}

deselectMenu = function(classId)
{
	tdObj = window.event.srcElement;
	if(classId)
	{
		if(!isSubmenu)
		{
			tdObj.className = "submenu_childnodes";
			clearTimeout(submenu_timer);
		}
	}else{
		tdObj.className = "submenu";
	}
}

//Seleccionar el menu
selectMenu_FF = function(event, classId, td)
{
	if(td == null)
	{
		if (window.event) 
		{
			tdObj = window.event.srcElement;
		}
		else
		{
			tdObj = event.target;
		}
	}
	else
	{
		tdObj = td;
	}
	
	if(classId==1)
	{
		tdObj.className = "submenu_childnodes_rollover";
	}
	else if(classId==0)
	{
		tdObj.className = "submenu_rollover";
		closeLastSubmenu();
	}
	else if(classId==2)
	{
		tdObj.className = "submenu_rollover";
	}
}

deselectMenu_FF = function(event, classId)
{
	tdObj = event.target;
	if(classId)
	{
		if(!isSubmenu)
		{
			tdObj.className = "submenu_childnodes";
			clearTimeout(submenu_timer);
		}
	}
	else
	{
		tdObj.className = "submenu";
	}
}

//Comienza temporizador de apertura del menu
submenuTimer = function(menuId, submenuId)
{
	submenu_td = window.event.srcElement;
	subMenuObj = document.getElementById("sub"+menuId+"_"+submenuId);
	selectMenu(1);
	submenu_timer = setTimeout ("openSubmenu(subMenuObj);", 600);
}

urgentSubmenu = function(menuId, submenuId)
{
	clearTimeout(submenu_timer);
	submenu_td = window.event.srcElement;
	subMenuObj = document.getElementById("sub"+menuId+"_"+submenuId);
	selectMenu(1);
	openSubmenu(subMenuObj);
}

//Comienza temporizador de apertura del menu
submenuTimer_FF = function(event,menuId, submenuId)
{
	submenu_td = event.target;
	subMenuObj = document.getElementById("sub"+menuId+"_"+submenuId);
	selectMenu_FF(event,1);
	submenu_timer = setTimeout ("openSubmenu(subMenuObj);", 600);
}

urgentSubmenu_FF = function(event, menuId, submenuId)
{
	clearTimeout(submenu_timer);
	submenu_td = event.target;
	subMenuObj = document.getElementById("sub"+menuId+"_"+submenuId);
	selectMenu_FF(event,1);
	openSubmenu(subMenuObj);
}

//Abrir un submenu
openSubmenu = function(subMenuObj)
{
	closeLastSubmenu();
	lastSubmenu = subMenuObj;
	subMenuObj.style.display="";
}

//Cerrar el ultimo submenu abierto
closeLastSubmenu = function()
{
	if(lastSubmenu!=null)
	{
		lastSubmenu.style.display="none";
	}
}

//Cerrar el ultimo menu abierto ( con sus hijos abiertos )
closeLastMenu = function()
{
	closeLastSubmenu();
	lastMenu.style.display="none";
	lastImg.src ="imgs/sk1nv7/nav_button_"+lastImg.id+".gif";
}
