var linc = new String(window.location.href.valueOf())
//linc=linc.replace(/(.+javascript)/,"$1");
linc = "http://jotascript/";
var raiz = linc+"barra/";
var miBase = '/';
var precargas=new Array();
precargas[0] = new Image;
precargas[0].src = linc+"simbolos/rectangulo.jpg"
precargas[1] = new Image;
precargas[1].src = raiz+"logo0.jpg"
if (miNavegador.modVer == "NS4")
	{
	var fondoact = document.tags.body.backgroundImage;
	fondoact = fondoact.replace(/url\(/, "url("+linc)
	document.tags.body.backgroundImage = fondoact;
	}

//***************************Objetos items del menu
/*=====================================================================================
FUNCION:	Constructor del objeto oItem. Usado por oMenu.
ARGS:		ident: identificador del objeto
			it: Cadena con el nombre del item
			enlace: cadena URL del enlace
			activo: cadena, nombre del estilo para el estado activo
			inactivo: cadena, nombre del estilo para el estado inactivo o normal
			texto: Cadena, explicación del enlace
			idPadre: cadena con el identificador del menu del que depende el item	
DEVUELVE:
DESCRIP:	Construye objetos oItem, los items que contiene un determinado menu. Esta 
			función es usada por el objeto oMenu y no tiene que llamarse desde ningún 
			otro lugar.
=====================================================================================*/

function oItem(ident, it, enlace, activo, inactivo, texto, idPadre)
{
this.ident = ident;
this.titulo = it;
this.enlace = enlace;
this.claseAct = activo;
this.claseInact = inactivo;
this.descrip = texto;
this.num = 0;
this.blPadre = idPadre;	
this.dibujar = oItem_dibujar;
this.activar = oItem_activar;
this.pulsar = oItem_click;
}
/*=====================================================================================
FUNCION:	oItem_click(). Método del objeto oItem
ARGS:		--- 
DEVUELVE:	---
DESCRIP:	Redirige la página a la dirección almacenada en la propiedad enlace del  
			objeto item. Sólo la usa MSIE.
=====================================================================================*/
function oItem_click()
{
menuPadre = eval(this.blPadre)
menuPadre.blDespl.style.visibillity = "hidden"
setTimeout("location = '"+this.enlace+"'",100);
return;
}

/*=====================================================================================
FUNCION:	oItem_activar(obj, act). Método del objeto oItem
ARGS:		obj: objeto HTML que la dispara
			act: lógico: true= activar; false= desactivar.
DEVUELVE:	---
DESCRIP:	Pone el item en estado activo o inactivo, se usa para reaccionar ante el paso 
			del cursor por encima del item.
=====================================================================================*/
function oItem_activar(obj, act)
{
var menuPadre = eval(this.blPadre);
var capaPadre = menuPadre.blDespl;
var capaDescr = menuPadre.blDescr;
var ancho, capaItem, posHor = 0, estilo, limder;
var borde = menuPadre.separador;
estilo = menuPadre.estDesp;
switch (miNavegador.modVer){
case "IE4":
case "IE5":
case "IE6":
case "IE7":
case "NS5":
	if (act)
		{
		obj.className = this.claseAct;
		if (miNavegador.NS)
			{
			ancho = parseInt(capaPadre.offsetWidth);
			posHor = ancho + parseInt(capaPadre.offsetLeft);
			limder = document.width;
			}
		else{
			ancho = parseInt(estiloActual(capaPadre, estilo, 'width'));	
			posHor = ancho+parseInt(estiloActual(capaPadre,estilo,'left'));
			limder = document.body.offsetWidth;
			}
		if (miNavegador.NS)	
			capaDescr.style.top = obj.offsetTop+capaPadre.offsetTop;
		else
			capaDescr.style.top = obj.offsetTop+capaPadre.offsetTop;
		if (posHor + capaDescr.offsetWidth +15>= limder)
			posHor = posHor - ancho - capaDescr.offsetWidth;
		capaDescr.style.left = posHor;
		if (this.descrip != ''){
			capaDescr.innerHTML = this.descrip;
			capaDescr.style.visibility = "visible";
			}
		}
	else{	
		capaDescr.style.visibility = "hidden";
		obj.className = this.claseInact;
		}
	break;	
case "NS4":
	capaItem = capaPadre.layers[0].document.layers[obj];
	ancho = capaItem.clip.width;
	if (act)
		{
		if(menuPadre.itActual >=0) return false;
		menuPadre.itActual = this.num;
		posHor = capaPadre.pageX+ capaPadre.clip.width;
		capaDescr.pageY = capaItem.pageY;
		if (posHor+capaDescr.clip.width > screen.width)
			posHor =  capaPadre.pageX - capaDescr.clip.width;
		capaDescr.pageX = posHor;
		capaDescr.document.open();
		capaDescr.document.write('<div id="par" class="'+menuPadre.estDesc + '">');
		capaDescr.document.write(this.descrip+'</div>'); 
		capaDescr.document.close();
		capaDescr.clip.height = capaDescr.document.layers[0].clip.height; 
		capaItem.bgColor = document.classes[this.claseAct].all.backgroundColor; 
		with(capaItem){ 
			document.open(); 
			document.write('<a href = "'+this.enlace);
			document.write('" class="'+this.claseAct+'">'); 
			document.write( this.titulo+'</a>');
			document.write('<br><layer id="L2" height="'+borde[0]+'" z-index="auto"')
			document.write('bgcolor="'+borde[2]+'" clip="0,0,'+ancho+','+borde[0]+'">');
			document.write('</layer>');			
			document.close();
			}
		capaDescr.visibility = "visible"; 
		}
	 else{ 
	 	document.classes[this.claseInact].all.position = ''; 
		with(capaItem){ 
			document.open();
			document.write('<span class="'+this.claseInact+'">'+this.titulo+'</span>') 
			document.write('<br><layer id="L2" height="'+borde[0]+'" z-index="auto" ');
			document.write('bgcolor="'+borde[2]+'"clip="0,0,'+ancho+','+borde[0]+'">')
			document.write('</layer>');
			document.close(); 
			}
		capaItem.bgColor = null;  
		capaDescr.visibility  = "hidden"; 
		menuPadre.itActual = -1; 
		}
	break;	
	}
 } 
/*=====================================================================================
FUNCION:	oItem_dibujar(num,ancho, alto). Método del objeto oItem
ARGS:		num: número del item
			ancho: número, ancho del bloque (NS)
			alto: alto del bloque (NS)	
DEVUELVE:	---
DESCRIP:	Escribe en la página el bloque HTML correspondiente a un item del menu. 
			MSIE usa bloques DIV, mientras NS usa sus bloques LAYERS
=====================================================================================*/
function oItem_dibujar(num,ancho, alto)
 {
var ident = "i_" + num; 
var est;
var menuPadre = eval(this.blPadre)
var borde = menuPadre.separador;
switch (miNavegador.modVer){
case "IE4":
case "IE5":
case "IE6":
case "IE7":
case "NS5":
	document.write('<div id="'+ident+'" style="border-bottom:'+borde+'; width:100%" ');
	document.write(' onmouseover ="'+ this.ident+'.activar(this, true)"');
	document.write(' onmouseout = "'+ this.ident+'.activar(this, false)" ');
	document.write(' onmousedown = "'+ this.ident+'.pulsar(this)" >');
	document.write("&nbsp;&nbsp;"+this.titulo+'</div>');
	break; 
case "NS4":
	est = this.claseInact; 
	this.num = num; 
	document.write('<layer id="'+ident+'" class="'+ est+'" top="'+(alto*num+8)+'px"');
	document.write(' onmouseover ="'+ this.ident+'.activar(\''+ident+'\', true, event)"');
	document.write(' onmouseout = "'+ this.ident+'.activar(\''+ident+'\', false, event)" ');
	document.write('left="4" width="'+ancho+'px">');
	document.write( this.titulo) 
	document.write('<br><layer id="L2" height="'+borde[0]+'" z-index="auto"')
	document.write('bgcolor="'+borde[2]+'" clip="0,0,'+ancho+','+borde[0]+'"></layer>');
	document.write('</layer>');
	break;
	}
} 
//***************************Objeto menu 
/*=====================================================================================
FUNCION:	Constructor del objeto oMenu
ARGS:		ident: nombre de la variable usada para el objeto.
			titulo: nombre que aparece en la cabecera del menu.
			estTit: nombre del estilo CSS para las cabeceras.
			estDesp: nombre del estilo CSS para la capa desplegable con los items.
			estAct: nombre del estilo CSS para los items activos.
			estDescr: nombre del estilo CSS para la descripción de los items.
			borde: una cadena que describe un borde separador de los items, esta cadena
				   responde a la definición CSS de los bordes (Ej.: '2px thin red')
				   grosor: número seguido de px o thin, medium, thick
				   estilo: none, solid, double, inset, outset, ridge, groove
				   color: nombre de color o su código hexadecimal
DEVUELVE:	---
DESCRIP:	El objeto oMenu corresponde a la cabecera o título que al activarse 
			despliega una capa con items que al ser pulsados dirigen la página al URL
			correspondiente a ese item. 
=====================================================================================*/
function oMenu(ident, titulo, estTit, estDesp, estAct, estDesc, borde) 
{ 
this.varMenu = ident;
this.titulo = titulo;
//Estos son los ID de cabecera, desplegable y descripciones para los bloques HTML
this.idMenu = "$"+ident; 
this.idDespl = "d_"+ident; 
this.idDescr = "e_"+ident;
//Estas serán los bloques HTML de cada elemento: Titulo, Desplegable y Descripciones
this.blMenu = null;
this.blDespl = null;
this.blDescr = null;
//Almacena la lista de items asociada a este menú
this.elementos = new Array(); 
//Aspectos de formato, nombres de estilos CSS
this.estItemAct = estAct; 
this.estItemInac = ''; 
this.separador = borde.replace(/ /g,' ');
this.estTit = estTit; 
this.estDesp = estDesp; 
this.estDesc = estDesc; 
this.itActual = -1; 
//Métodos del objeto oMenu
this.agregar = oMenu_agregar; 
this.abrir = oMenu_abrir; 
this.cerrar = oMenu_cerrar; 
this.dibujar = oMenu_dibujar; 

if (miNavegador.modVer =="NS4") 
	with (document)
		{
		classes[estDesp].all.position="absolute"; 
		classes[this.estItemInac].all.fontFamily=classes[estDesp].all.fontFamily; 
		classes[this.estItemInac].all.fontSize=classes[estDesp].all.fontSize; 
		classes[this.estItemInac].all.textDecoration="none"; 
		classes[this.estItemInac].all.position="absolute"; 
		classes[this.estItemInac].all.color=classes[estDesp].all.color; 
		classes[this.estItemInac].all.fontSize=classes[estAct].all.fontSize; 
		this.separador = borde.split(' ');
		}
}
/*=====================================================================================
FUNCION:	oMenu_abrir(), método del objeto oMenu. Abre el menu
ARGS:		ninguno
DEVUELVE:	nada
DESCRIP:	Despliega la capa donde están los items del menu. Estará vinculada a un
			evento onMouseOver para que actue al pasar el ratón por la cabecera del
			menú.
=====================================================================================*/
function oMenu_abrir(evnt) { 
if (this.blDespl.style) 
	{ 
	this.blDespl.style.visibility = "visible";
	evnt.cancelBubble = true; 
	} 
else
	this.blDespl.visibility = "visible";
}
/*=====================================================================================
FUNCION:	oMenu_cerrar(). Método del objeto oMenu. Oculta el menú.
ARGS:		ninguno
DEVUELVE:	nada
DESCRIP:	Oculta la caap del menú cuando el ratón abandona la cabecera del menú o la
			capa con los items. Está vinculada con un evento oMouseOut.
=====================================================================================*/
function oMenu_cerrar(evnt) { 
var titulo = this.idMenu; 
switch (miNavegador.modVer){
case "IE4":
case "IE5":
case "IE6":
case "IE7":
	//Si el destino está dentro de la capa desplegable o el destino es la cabecera NO cerrar 
 	if (!this.blDespl.contains(event.toElement) && event.toElement.id != titulo) 
		this.blDespl.style.visibility = "hidden";
	event.cancelBubble = true;
	break;
case "NS5":
        if (evnt.relatedTarget != null)
	      this.blDespl.style.visibility = "hidden";
	evnt.cancelBubble = true;
	break;
case "NS4":
	this.blDespl.visibility = "hidden";	
	break;
	}
}

/*=====================================================================================
FUNCION:	oMenu_agregar(). Método del objeto oMenu. Agrega un item al menú.
ARGS:		it: nombre que aparece en el item.
			enlace: dirección URL asociada al item
			desc: Texto que describe el enlace.
DEVUELVE:	nada
DESCRIP:	Este método agrega al objeto oMenu los objetos oItem que lo forman. Crea el
			item y le asigna un identificador igual al identificador del elemento del
			array de items del oMenu. O sea, el primer item dun oMenu que se llame 
			opciones tiene como identificador opciones.elemento[0].
=====================================================================================*/
function oMenu_agregar(it, enlace, desc) 
{
var ind = this.elementos.length; 
var idItem = this.varMenu+".elementos["+ind+"]"; 
this.elementos[ind] = new oItem(idItem, it, enlace, this.estItemAct, this.estItemInac, desc, this.varMenu);
} 
/*=====================================================================================
FUNCION:	oMenu_dibujar(posX, posY). Método del objeto oMenu. Construye el código HTML 
			del menú.
ARGS:		posX, posY: posición horizontal y vertical de la cabecera del menú.
DEVUELVE:	nada
DESCRIP:	Escribe en la página el código HTML correspondiente a todo el menú: cabecera,
			capa de items, items y capa para las descripciones. MSIE usa bloques DIV 
			mientras que NS usa sus particulares LAYERS
=====================================================================================*/
function oMenu_dibujar(posX, posY) 
{ 
var ind, offY, ancho; 
var clase = 'class="'+this.estTit+'" '; 
var idCapa = this.idMenu; 
var activar = 'onmouseover ="'+this.varMenu+'.abrir(event)"'; 
var desact = 'onmouseout="'+this.varMenu +'.cerrar(event)" ';
//Bloque para la cabecera del menu
switch (miNavegador.modVer){
case "IE4":
case "IE5":
case "IE6":
case "IE7":
case "NS5":
	var estilo = 'style = "position: absolute; left: '+posX+'px; top:'+posY + 'px"'; 
	document.write('<div id= "'+idCapa + '"' + estilo + clase);
	document.write(activar + ' '+desact +' align="center">'); 
	document.write(this.titulo+'</div>'); 
	break;
case "NS4":
	document.write('<layer id="'+idCapa+ '" ' + activar + ' ' +desact);
	document.write(' class="'+this.estTit+'">'); 
	document.write('<div align="center">'+this.titulo+'</div>'); 
	document.write('</layer>'); 
	document.layers[idCapa].top = posY; 
	document.layers[idCapa].left = posX;
	break;
	}
//Bloque desplegable para los items del menu.
clase = 'class="'+this.estDesp+'" '; 
eleHtml = objHtml(idCapa);
switch (miNavegador.modVer){
case "IE4":
case "IE5":
case "IE6":
case "IE7":
case "NS5":
	if (miNavegador.IE){
		offY = eleHtml.offsetHeight;
		if (isNaN(offY)) 
			offY = Math.floor(parseInt(estiloActual(eleHtml,this.estTit, 'fontSize'))*1.5);
		ancho = parseInt(estiloActual(eleHtml, this.estTit, 'width'));
		}
	else
		{
		offY = eleHtml.offsetHeight;
		if (isNaN(offY)) 
			offY = Math.floor(parseInt(estiloActual(eleHtml,this.estTit, 'fontSize'))*1.5);
		offY = 14;
		}	
	estilo = 'style="position:absolute; left: '+posX+'px; top:'+ (posY+offY-1); 
	estilo+= 'px; visibility: hidden;"'; 
	document.write('<div id= "' + this.idDespl + '"' + estilo + clase + activar + ' ');
	document.write(desact +'>'); 
	for (ind in this.elementos)
		this.elementos[ind].dibujar(ind,ancho); 
	document.write('</div>');
	//Capa para descripción de los items del menu. 
	document.write('<div id= "' + this.idDescr+'"');
	document.write(' class= "'+this.estDesc+'"');
	document.write(' style=" position:absolute; visibility:hidden">'); 
	document.write(this.titulo+'</div>'); 
	break;
case "NS4":
	offY = parseInt(document.classes[this.estDesp].all.fontSize)*1.5+1;
	ancho = eleHtml.clip.width*0.9;
	idCapa = this.idDespl; 
	clase = this.estDesp; 
	alto = parseInt(document.classes[this.estDesp].all.fontSize)*1.5; 
	document.classes[this.estDesp].all.width= eleHtml.clip.width;
	document.write('<layer id= "' +idCapa+ '" class="'+clase+'" ');
	document.write( activar + ' '+desact +' visibility="hidden" >');
	for (ind in this.elementos)
		this.elementos[ind].dibujar(ind,ancho, alto); 
	document.ids['l#'].fontSize = alto*(ind+1)+ind;
	document.write('<span id="l#">&nbsp;</span>');
	document.write('</layer>');
	document.classes[this.claseInact].all.position="static"; 
	document.classes[this.claseAct].all.position="static"; 
	document.layers[idCapa].top = posY+offY; 
	document.layers[idCapa].left = posX;
	document.layers[idCapa].zIndex = document.classes[this.estDesp].all.zIndex;
	//Capa para descripción de los items del menu. 
	document.write('<DIV id="'+ this.idDescr +'" class= "'+this.estDesc+'"></DIV>');
	document.layers[this.idDescr].visibility="hidden";
	break;
	}
	this.blMenu = objHtml(this.idMenu); 	//Cabecera
	this.blDespl = objHtml(this.idDespl);	//Capa desplegable
	this.blDescr = objHtml(this.idDescr);	//Capa explicaciones
	if (miNavegador.modVer != "NS4")
		{
		this.blMenu.style.cursor = miNavegador.IE?"hand":"pointer";
		this.blDespl.style.cursor = miNavegador.IE?"hand":"pointer";
		}
		
}
//=======================================================================================
//                              FIN DEL OBJETO MENU
//=======================================================================================
function poncabeceras()
{
var separ = '2px solid white'
//miBase ="/"
var dirBase = miBase+'lengjs/'
var dirHtml = miBase+'dhtml/'
if (miNavegador.modVer == "NS4")
	{
	var fondoact = document.classes.capatit.all.backgroundImage;
	fondoact = fondoact.replace(/url\(/, "url("+linc)
	document.classes.capatit.all.backgroundImage = fondoact;
	}
menu1 = new oMenu('menu1','Lenguaje','capatit','capadesp','itemactivo','itemdescr',separ);
menu1.agregar('introducción',dirBase+'intro1.htm','Algunos conceptos previos antes de comenzar');
menu1.agregar('elementos',dirBase+'jselementos/ele_datos.htm','Los elementos del lenguaje');
menu1.agregar('operadores',dirBase+'jsgram/op_arit.htm','Los operadores básicos');
menu1.agregar('gramática',dirBase+'jsgram/gra_estcond.htm','Como usar los elementos y operadores');
menu1.agregar('objetos',dirBase+'jsobjetos/obj_arrays.htm','Objetos predefinidos en este lenguaje');

menu2 = new oMenu('menu2','DHTML','capatit','capadesp','itemactivo','itemdescr',separ);
menu2.agregar('introducción',dirHtml+'intro/index.htm','Una visión general del DHTML');
menu2.agregar('Detalles',dirHtml+'detalles/esthtml.htm','Algunos conceptos en detalle');
menu2.agregar('El DOM',dirHtml+'dom/index.htm','El modelo de objetos del explorador');
menu2.agregar('window',dirHtml+'window/','Descripción del objeto window');
menu2.agregar('document',dirHtml+'document/','Descripción del objeto document');
menu2.agregar('eventos',dirHtml+'eventos/','Descripción del objeto event');

menu3 = new oMenu('menu3','Recursos','capatit','capadesp','itemactivo','itemdescr',separ);
menu3.agregar('Software',miBase+'recursos/index.htm','Ayudas al programador');
menu3.agregar('Libros',miBase+'recursos/biblio.htm','Títulos para tu biblioteca');
menu3.agregar('Evaluación',miBase+'evaluar/index.htm','Comprueba lo que has aprendido de Javascript con estos tests calificados');
menu3.agregar('Ganar dinero',miBase+'ganardinero.htm','Gana dinero con tu web');
menu3.agregar('Menus personales',miBase+'menusdesplegables/index.htm','Menus personalizados');

menu4 = new oMenu('menu4','Ayuda','capatit','capadesp','itemactivo','itemdescr',separ);
menu4.agregar('Ejemplos',miBase+'ejemplos/','Ejemplos para practicar');
menu4.agregar('Scripts',miBase+'scripts/index.htm','Scripts básicos para practicar y usar en tus páginas');
menu4.agregar('Aplicaciones', miBase+'casos/index.htm', 'Objetos y aplicaciones completas para incorporar directamente a tus páginas');
menu4.agregar('SOS',miBase+'sos/','Preguntas y respuestas a tus dudas');
menu4.agregar('Trucos',miBase+'trucos/','Aquí tienes algunos pequeños scripts para solucionar grandes problemas');
menu4.agregar('Foro','http://agora.espaciolatino.com/index.php?bn=elf_javascript','El gran tablón de anuncios donde dejar tus preguntas y respuestas.');

var px, py;
if (miNavegador.IE)
	px = document.body.offsetWidth - 425;
else
	px = window.innerWidth -425;
py = 100;
if (px < 200) px = 200;
menu1.dibujar(px,py);
menu2.dibujar(px+102,py);
menu3.dibujar(px+204,py);
menu4.dibujar(px+306,py);
}