var rollOverArr = new Array();
var layerActivo = false;
var layerActivo2 = false;
var ultimaImagen;
var categoriaActual = 0;
var flechitaOver = "";
 
function setFlechitaOver(iId){
    if (iId <= 3)
    	flechitaOver = "flechita_naranja.gif";
    else
    	flechitaOver = "flechita_roja.gif";
}

function marcarSeccion(iId, blnModo, sFlechita){
     // iId     : ID del objeto contenedor	
     // blnModo : indica si se debe marcar (true) o desmarcar (false)
	
    // Primero se obtiene el objeto relacionado al "id"
    obj = document.getElementById(iId);
    // Luego, su primer objeto tabla (que en este caso es el unico)
    tabla = obj.getElementsByTagName("table")[0];
    // Despues se obtiene el body de la tabla
    tableBody = tabla.getElementsByTagName("tbody")[0];
    // Se obtiene la primer fila (en este caso tambien es unica)
    fila = tableBody.getElementsByTagName("tr")[0];
    // Se modifica su color de fondo
    if (blnModo)
    	fila.style.backgroundColor = "#AEAEAE";
    else 
    	if (!layerActivo2) fila.style.backgroundColor = "#DFDFDF";
    // Se obtiene la tercera columna, que es donde esta el tag "a" para modificar su color de fondo
    celda = fila.getElementsByTagName("td")[2];
    // Se obtiene el objeto imagen, para cambiar su "src"
    img = fila.getElementsByTagName("img")[0];
    pos = img.src.lastIndexOf('/');
    str = img.src.substring(0,pos+1);
    if (blnModo)
    	img.src = str + "flechita_blanca.gif";
    else
    	if (!layerActivo2) img.src = str + sFlechita;
    // Se obtiene el elemento "a"
    a = celda.getElementsByTagName("a")[0]; 
    // Finalmente se cambia su color de fondo
    if (blnModo)
    	a.style.backgroundColor = "#AEAEAE";
    else
    	if (!layerActivo2) a.style.backgroundColor = "#DFDFDF";
}

function setrollover(OverImgSrc,pageImageName) {
    if (! document.images) return;
    if (pageImageName == null)
        pageImageName = document.images[document.images.length-1].name;
    rollOverArr[pageImageName] =new Object;
    rollOverArr[pageImageName].overImg = new Image;
    rollOverArr[pageImageName].overImg.src = OverImgSrc;
}

function rollover(pageImageName) {
    if (! document.images) return;
    if (! rollOverArr[pageImageName]) return;
    if (! rollOverArr[pageImageName].outImg) {
        rollOverArr[pageImageName].outImg = new Image;
        rollOverArr[pageImageName].outImg.src = document.images[pageImageName].src;
    }
    document.images[pageImageName].src = rollOverArr[pageImageName].overImg.src;
    ultimaImagen = pageImageName;
}

function rollout(pageImageName) {
    if (!layerActivo) {
        if (! document.images) return;
        if (! rollOverArr[pageImageName]) return;
        document.images[pageImageName].src = rollOverArr[pageImageName].outImg.src;
    }
}

function detectBrowser() {
	var detect = navigator.userAgent.toLowerCase();
	var OS, browser, version, total, thestring;

	if(checkIt('konqueror')) {
		browser = "Konqueror";
		OS = "Linux";
	}
	else if(checkIt('safari'))  browser = "Safari";
	else if(checkIt('omniweb')) browser = "OmniWeb";
	else if(checkIt('opera'))   browser = "Opera";
	else if(checkIt('webtv'))   browser = "WebTV";
	else if(checkIt('icab'))    browser = "iCab";
	else if(checkIt('msie'))    browser = "Internet Explorer";
	else if(!checkIt('compatible')) {
		browser = "Netscape Navigator";
		version = detect.charAt(8);
	}
	else browser = "An unknown browser";

	if(!version) version = detect.charAt(place + thestring.length);

	if(!OS) {
		if (checkIt('linux')) OS = "Linux";
		else if (checkIt('x11')) OS = "Unix";
		else if (checkIt('mac')) OS = "Mac";
		else if (checkIt('win')) OS = "Windows";
		else OS = "an unknown operating system";
	}

	function checkIt(string) {
		place = detect.indexOf(string) + 1;
		thestring = string;
		return place;
	}

	return browser;
}

function isIE5() {
	var appVersion = navigator.appVersion;
	var pos = navigator.appVersion.indexOf("MSIE");
	if(appVersion.substr(pos + 5, 1) == '5') {
		return true;
	} else {
		return false;
	}
}

function setBgColor(sId,sColor) {
	oMenu = document.getElementById(sId);
	oMenu.style.backgroundColor = sColor;
}

function totalChilds (iId) {
	var arrAux = new Array();
	for (var z=0;z<arrMenu.length;z++) {
		if (arrMenu[z][1] == iId) {
			arrAux[arrAux.length] = z;
		}
	}
	return arrAux;
}

//Construyo los Items del Menu
function makeMenuItems (iPos, blnCatPpal, iColor, blnNroItem,imgUrl,frontUrl) {
	var arrChilds = new Array();
	var iId;
	var iFkId;
	var sHref;
	var sName;
//	var blnEsNuevo;
	var sContenido;
	var sNombreImg;
	var sNombreImgOver;
	var iWidth;
	var iHeight;
	var sHeader;
	var sLink;
	var sRollOver;
	var sFlechita;
	var sMargenSeccion_1 = "";
	var sClaseBorde = "";
       
	iId        = arrMenu[iPos][0];
	iFkId      = arrMenu[iPos][1];
	sHref      = arrMenu[iPos][2];
	sName      = arrMenu[iPos][3];
        if(sHref.substring(0,1)!='#')
            sHref=frontUrl+sHref;
            
//	blnEsNuevo = arrMenu[iPos][4];
        
	if(categoriaActual <= 3) sFlechita = "flechita_naranja.gif";
	else                     sFlechita = "flechita_roja.gif";

	if(!esHijoDeSocios(iId)) {
		if(!hijoCatPpal(iId)) {
			sMargenSeccion_1 = "margin-left: 0px;";
		}else
			sMargenSeccion_1 = "margin-left: -10px;";
	}
	
	// Si es el primero de la lista de items, el borde top = 1
	if (blnNroItem == true)
		sClaseBorde = "bordePrimero";
	else
		sClaseBorde = "borde";
	
	//llamada a funcion que chequea cantidad de hijos por padre.
	arrChilds = totalChilds(iId);

	// Para alternar de colores entre niveles
	if (iColor == 0){
	    sBgColor = "#DFDFDF";
	    iColor = 1;
	} else {
	    sBgColor = "#DFDFDF";
	    iColor = 0;
	}

	// Segun sea la categoria principal o no, el contenido será una imagen, o solo texto
	if(blnCatPpal) {
		// Si es una categoria principal, se obtiene del array arrImg el ancho y alto de la imagen.
		iWidth  = arrImg[iId][0];
		iHeight = arrImg[iId][1];

		// Segun la categoria, setea en flechita_naranja.gif o flechita_roja.gif el bullet
		setFlechitaOver(iId);

		// Si iId es la categoria actual (idCategoria por $_GET[]), entonces activarla poniendo como imagen la imagen "_over"
		if(iCategoriaPrincipal == iId){
			sNombreImg     = 'cat_' + iId + '_over';
			sNombreImgOver = sNombreImg;
		} else {
			sNombreImg     = 'cat_' + iId;
			sNombreImgOver = sNombreImg + '_over';
		}

		// Chequeo si ademas de ser categoria principal, tiene o no hijos (de eso dependen los eventos onMouseOver y onMouseOut)
		if(arrChilds.length > 0) {
			sHeader = "<li style='width:" + iWidth + "px; height:" + iHeight + "px' id='li_"+ iId +"' onMouseOver='this.lastChild.style.display=\"block\"; layerActivo = true; rollover(ultimaImagen);' onMouseOut='this.lastChild.style.display=\"none\"; layerActivo = false; rollout(ultimaImagen);'>";
		} else {
			sHeader = "<li style='width:" + iWidth + "px; height:" + iHeight + "px' id='li_"+ iId +"'>";
		}

		sContenido = "<img name='" + sNombreImg + "' src='"+imgUrl+"menu/" + sNombreImg + ".gif' border='0' width='" + iWidth + "px' height='" + iHeight + "px'>";
		sLink      = "<a href='" + sHref + "' onMouseOver=\"rollover('" + sNombreImg + "')\" onMouseOut=\"rollout('" + sNombreImg + "')\" style='background-color:" + sBgColor + "; padding-left:0px;'>" + sContenido + "</a>";
		sRollOver  = "<SCRIPT TYPE='text/javascript'>\n<!--\n setrollover('"+imgUrl+"menu/" + sNombreImgOver + ".gif');\n //-->\n</SCRIPT>";

	} else {
//		if(blnEsNuevo) sName = sName + " <span class='txtRojoNuevo'>NUEVO!</span>";

		if (arrChilds.length > 0){
	        sHeader = "<li style=' " + sMargenSeccion_1 + "' id='li_"+ iId +"' onMouseOver='this.lastChild.style.display=\"block\"; layerActivo=true; layerActivo2=true; marcarSeccion(\"li_"+ iId +"\", true, \"" + sFlechita + "\");' onMouseOut='this.lastChild.style.display=\"none\"; layerActivo=false; layerActivo2=false; marcarSeccion(\"li_"+ iId +"\", false, \"" + sFlechita + "\");'>";
	        sContenido = "<table width=100% cellspacing=0 cellpadding=0 class='" + sClaseBorde +"'><tr><td width='10px' align='right'><img border=0 src='"+imgUrl+"menu/" + flechitaOver + "' width='10px' height='9px'></td><td width='1px'></td><td width='130px' align='left'><a href='" + sHref + "' style='background-color:" + sBgColor + "'>" + sName + "</a></td></tr></table>";
	    } else { 
	        sHeader = "<li style=' " + sMargenSeccion_1 + "' id='li_"+ iId +"' onMouseOut='layerActivo2=false; marcarSeccion(\"li_"+ iId +"\", false, \"" + sFlechita + "\");'>";
	        sContenido = "<table width=100% cellspacing=0 cellpadding=0 class='" + sClaseBorde +"'><tr><td width='10px'><img border=0 src='"+imgUrl+"menu/" + flechitaOver + "' width='10px' height='9px'></td><td width='1px'></td><td width='126x' align='left'><a href='" + sHref + "' style='background-color:" + sBgColor + "'>" + sName + "</a></td><td width='5px'></td></tr></table>";
	    }
	    sLink = "<a onMouseOver='marcarSeccion(\"li_"+ iId +"\", true, \"" + sFlechita + "\");' onMouseOut='marcarSeccion(\"li_"+ iId +"\", false, \"" + sFlechita + "\");' href='" + sHref + "' style='background-color:" + sBgColor + "; padding-left:0px;'>" + sContenido + "</a>";
	    sRollOver = "";
	}

	if(arrChilds.length > 0) {
		document.write          (sHeader)
		document.write              (sLink)
		document.write                  (sRollOver)
		document.write				("<ul id='ul_"+ iId +"'>")		
		k = 0;
		for(var w = 0; w < arrChilds.length; w++) {
			blnNroItem = (k == 0) ? true : false;
			if (k == 0) {
				blnNroItem = true;
				k = 1;
			} else 
				blnNroItem = false;
				
			makeMenuItems(arrChilds[w], false, iColor, blnNroItem,imgUrl,frontUrl);
		}
		document.write				("</ul>")
		document.write			("</li>")
	} else {
		document.write          (sHeader)
		document.write               (sLink)
		document.write                   (sRollOver)
		document.write			("</li>")
	}
}

function hijoCatPpal(id){
	return (id < 100);
}

function esHijoDeSocios(id){
	var blnEsHijo;
	
	switch (id){
		case 10:
		case 11:
		case 12:
		case 13:
		case 14:
				blnEsHijo = true;
				break;
		default:
				blnEsHijo = false;
				break; 
	}
	
	return blnEsHijo;
}

// Esto es para incluir los botones del menú que no se traen de la BBDD
function imprimirPrimeraColumna(imgUrl){
    if (iCategoriaPrincipal == 1)
    	document.write      ("<td width=15px height=15px><img border=0 src='"+imgUrl+"top_esquina_izq_naranja.jpg' width=15px height=15px></td>");
    else
    	document.write      ("<td width=15px height=15px><img border=0 src='"+imgUrl+"top_esquina_izq_gris.jpg' width=15px height=15px></td>");
}

function imprimirUltimaColumna(imgUrl) {
    document.write      ("<td height='15px'>");
    document.write          ("<img src='"+imgUrl+"trans.gif' border=0 width='137px' height='15px'>");
    document.write      ("</td>");
}

//Construyo el contenedor del menu
function makeMenu(cssUrl,imgUrl,frontUrl) {
	var cant = 0;
        setCSS("horz",cssUrl);
	document.write("<ul id=\"nav\">");
	document.write("<table width=\"414\" height=\"15\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\" bgcolor=\"#C3C3C3\">");
	document.write("<tr>");

//	imprimirPrimeraColumna(imgUrl);

	for(var i = 0; i < arrMenu.length; i++) {
		// Si es un ítem padre.
		if(arrMenu[i][1] == 0) {
			cant ++;
			categoriaActual ++;

			document.write("<td>");

			makeMenuItems(i, true, 0, true,imgUrl,frontUrl);

			document.write("</td>");
			document.write("<td width=\"1\" bgcolor=\"#FFFFFF\"><img src=\""+imgUrl+"trans.gif\" alt=\"\" border=\"0\" height=\"15\" width=\"1\" /></td>");
		}
	}

//	imprimirUltimaColumna(imgUrl);

	document.write("</tr>");
	document.write("</table>");
	document.write("</ul>");
	//Activo el menu ** DEBE ESTAR SIEMPRE AL FINAL**
}

function setCSS (sStyle,cssUrl) {
	var archivoCSS = "css/";
        if (typeof cssUrl != "undefined")
            archivoCSS=cssUrl;
	
	switch(detectBrowser()) {
		case "Internet Explorer":
								if(isIE5()) {
									archivoCSS += "menu_"+ sStyle +"_ie5.css";
								} else {
									archivoCSS += "menu_"+ sStyle +"_ie6.css";
								}
								break;
		case "Netscape Navigator":
								archivoCSS += "menu_"+ sStyle +"_nn.css";
								break;
		default:
								if(isIE5()) {
									archivoCSS += "menu_"+ sStyle +"_ie5.css";
								} else {
									archivoCSS += "menu_"+ sStyle +"_ie6.css";
								}
								break;
	}
	
	document.write('<LINK type="text/css" rel="stylesheet" href="' + archivoCSS + '" />');
}