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 isIE8() {
			var appVersion = navigator.appVersion;
            var pos = navigator.appVersion.indexOf("MSIE");
            if(appVersion.substr(pos + 5, 1) == '8') {
                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) {
	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];
	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='imagenes/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('imagenes/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='imagenes/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 +"' onMouseOver='layerActivo=true; layerActivo2=true; marcarSeccion(\"li_"+ iId +"\", true, \"" + sFlechita + "\");' onMouseOut='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='imagenes/menu/" + flechitaOver + "' width='10px' height='9px'></td><td width='1px'></td><td width='130x' align='left'><a href='" + sHref + "' style='background-color:" + sBgColor + "'>" + sName + "</a></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);
		}
		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:
		case 15:
		case 16:
		case 119:
		case 120:
			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(){
    if (iCategoriaPrincipal == 1)
    	document.write      ("<td width=15px height=15px><img border=0 src='imagenes/top_esquina_izq_naranja.jpg' width=15px height=15px></td>");
    else
    	document.write      ("<td width=15px height=15px><img border=0 src='imagenes/top_esquina_izq_gris.jpg' width=15px height=15px></td>");
}

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

//Construyo el contenedor del menu
function makeMenu() {
	var cant = 0;

	setCSS ('horz');
	document.write	("<ul id='nav'>");
	document.write		("<table width='665' height='15' cellpadding='0' cellspacing='0' border='0' bgcolor='#C3C3C3'>");
	document.write			("<tr>");
	
	//imprimirPrimeraColumna();

	for (var i=0;i<arrMenu.length;i++){
		if (arrMenu[i][1] == 0) {		// Es un ítem padre?
		    cant++;
		    categoriaActual++;
			document.write		("<td>");
			makeMenuItems(i, true, 0, true);
			document.write		("</td>");
			document.write      ("<td width='1px' bgcolor='#FFFFFF'></td>");
		}
	}
	
	imprimirUltimaColumna();
	
	document.write			("</tr>");
	document.write		("</table>");
	document.write	("</ul>");
	//Activo el menu ** DEBE ESTAR SIEMPRE AL FINAL**
}

function setCSS (sStyle) {
	var archivoCSS = "css/";
	
	switch(detectBrowser()) {
		case "Internet Explorer":
								//if(isIE5()) {
//									archivoCSS += "menu_"+ sStyle +"_ie5.css";
//								} else {
//									archivoCSS += "menu_"+ sStyle +"_ie6.css";
//								} else {
//									archivoCSS += "menu_"+ sStyle +"_ie8.css";
//								}
//								break;
								if(isIE5()) {
                                        archivoCSS += "menu_"+ sStyle +"_ie5.css";
								 } else {
										if (isIE8()) {       
												archivoCSS += "menu_"+ sStyle +"_ie8.css";
										} else {
                                                archivoCSS += "menu_"+ sStyle +"_ie6.css";
                                        }
										break;
                                  }
                                  break;

		case "Netscape Navigator":
								archivoCSS += "menu_"+ sStyle +"_nn.css";
								break;
		default:
								if(isIE5()) {
                                        archivoCSS += "menu_"+ sStyle +"_ie5.css";
								 } else {
										if (isIE8()) {       
												archivoCSS += "menu_"+ sStyle +"_ie8.css";
										} else {
                                                archivoCSS += "menu_"+ sStyle +"_ie6.css";
                                        }
										break;
                                  }
                                  break;
	}
	
	document.write('<LINK type="text/css" rel="stylesheet" href="' + archivoCSS + '" />');
}