// JavaScript Document
//creacion: 21/01/05
//descripcion: archivo que contien la clase menuDeslizante
//version 1.0: 	se crea todo para una sola titulacion
//				"the count-down begins"
//version 47.9: despues de tocar mil veces parece que hace una reposicion (al redimensionar la ventana) del menu algo simple 
//				no hace falta hacer esto para todas las titulaciones y parece funcionar aceptablemente de "las dos perlitas":
//				netscape y firefox

menuDeslizante.Registry = [];
menuDeslizante.aniLen = 250;
menuDeslizante.retraso = 1000;
menuDeslizante.minCPU = 10;

///////////////////////////////constructor
function  menuDeslizante(id, dir, izq, top, ancho, alto,offset)
{
	//mayo de 2006:
	//hemos cambiado la cabecera y el menú aparece más abajo de lo que debe
	//para no tener que cambiar todas las llamadas metemos una neuva var q sea
	//desplazamiento que se añada lo que ya tenemos
	
	desplazamiento = 15;
	
	top += desplazamiento;
	
	this.ie = document.all? 1 : 0; //es internet expolrer?
	this.ns4 = document.layers? 1 : 0; //es netscape?
	this.dom = document.getElementById? 1 : 0;
	this.offset = offset;
	
	if (this.ie || this.ns4 || this.dom)
	{
		this.id = id;
		this.dir = dir;
		this.orientacion = dir == "izquierda" || dir == "derecha" ? "h" : "v"; //direccion horizontal o vertical
		this.TipoDireccion = dir == "derecha" || dir == "abajo" ? "-" : "+";
		this.dim = this.orientacion == "h" ? ancho : alto;
		this.escondeTimer = false;
		this.aniTimer = false;
		this.open = false;
		this.over = false;
		this.startTime = 0;
		this.gRef = "menuDeslizante_"+id;
		eval(this.gRef+" = this");
		menuDeslizante.Registry[id] = this;
		
		var d = document
		var strCSS = '<style type="text/css">';
		strCSS += '#' + this.id + 'Container { visibility:hidden; '
		strCSS += 'left:' + izq + 'px; '
		strCSS += 'top:' + top + 'px; '
		strCSS += 'overflow:hidden; z-index:10000; }'
		strCSS += '#' + this.id + 'Container, #' + this.id + 'Content { position:absolute; '
		strCSS += 'width:' + ancho + 'px; '
		strCSS += 'height:' + alto + 'px; '
		strCSS += 'clip:rect(0 ' + ancho + ' ' + alto + ' 0); '
		strCSS += '}'
		strCSS += '</style>'
		
		d.write(strCSS)
		
		nombre = this.id+"Container";
	
		document.getElementById(nombre).style.left = izq+'px';
		document.getElementById(nombre).style.top = top+'px';
		
		this.load();
	} 
}



////////////////////////LOAD
menuDeslizante.prototype.load = function()
{
	var d = document
	var lyrId1 = this.id + "Container"
	var lyrId2 = this.id + "Content"
	var obj1 = this.dom ? d.getElementById(lyrId1) : this.ie ? d.all[lyrId1] : d.layers[lyrId1]
	if (obj1) var obj2 = this.ns4 ? obj1.layers[lyrId2] : this.ie ? d.all[lyrId2] : d.getElementById(lyrId2)
	
	var temp
	if(!obj1 || !obj2) window.setTimeout(this.gRef + ".load()", 100)
	else
	{
		this.container = obj1;
		this.menu = obj2;
		this.style = this.ns4 ? this.menu : this.menu.style;
		this.homePos = eval("0" + this.TipoDireccion + this.dim);
		this.outPos = 0;
		this.accelConst = (this.outPos - this.homePos) / menuDeslizante.aniLen / menuDeslizante.aniLen; //¿?
		
		//manejadores de eventos
		if (this.ns4)
			this.menu.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
		this.menu.onmouseover = new Function("menuDeslizante.muestraMenu('" + this.id + "')");
		this.menu.onmouseout = new Function("menuDeslizante.ocultaMenu('" + this.id + "')");
		
		this.finDesliza();		
	}	
}

/////////////////////////////MUESTRA MENU
menuDeslizante.muestraMenu = function (id)
{
	

	var regisry = menuDeslizante.Registry;
	var objecte = menuDeslizante.Registry[id];
	
	if (objecte.container)
	{
	
		objecte.over = true;
		for (menu in regisry)
			if (id != menu) menuDeslizante.oculta(menu);
		
		if (objecte.escondeTimer)
		{
			regisry[id].escondeTimer = window.clearTimeout(regisry[id].escondeTimer);
		}
	
		if (!objecte.open && !objecte.aniTimer)
		{
			/**************************************/
			regisry[id].comienzaDeslizar(true);			
		}		
	}
}

///////////////////////////OCULTA MENU
menuDeslizante.ocultaMenu = function (id)
{
	var obj = menuDeslizante.Registry[id];
	if (obj.container)
	{
		if (obj.escondeTimer) window.clearTimeout(obj.escondeTimer);
		obj.escondeTimer = window.setTimeout("menuDeslizante.oculta('" + id + "')",menuDeslizante.retraso);
	}
}

/////////////////////////////OCULTA TODOS
menuDeslizante.ocultaTodos = function()
{
	var reg = menuDeslizante.Registry;
	for (menu in reg)
	{
		menuDeslizante.oculta(menu);
		if (menu.escondeTimer) window.clearTimeout(menu.escondeTimer);
	}
}

///////////////////////////oculta
menuDeslizante.oculta = function(id)
{
	var obj = menuDeslizante.Registry[id];
	obj.over = false;
	if (obj.escondeTimer) window.clearTimeout(obj.escondeTimer); 	
	obj.escondeTimer = 0;
	if (obj.open && !obj.aniTimer) obj.comienzaDeslizar(false)
}

/////////////////////////COMIENZA DESLIZAR
menuDeslizante.prototype.comienzaDeslizar = function(open)
{
	this[open ? "onactivate" : "ondeactivate"] ();
	this.open = open;
	if (open) this.cambiaVisible(true);
	this.startTime = (new Date()).getTime();
	this.aniTimer = window.setInterval(this.gRef +".desliza()",menuDeslizante.minCPU);
}


///////////////////////desliza
menuDeslizante.prototype.desliza = function()
{

	var elapsed = (new Date()).getTime() - this.startTime;
	if (elapsed > menuDeslizante.aniLen) this.finDesliza ();
	else
	{
		var d = Math.round(Math.pow(menuDeslizante.aniLen - elapsed,2) * this.accelConst);
		if (this.open && this.TipoDireccion == "-") d = -d;
		else if (this.open && this.TipoDireccion == "+") d = -d;
		else if (!this.open && this.TipoDireccion == "-") d = -this.dim + d;
		else d = this.dim + d;
		this.mover(d);
	}
}

///////////////////////////FIN DESLIZA
menuDeslizante.prototype.finDesliza = function() 
{
	this.aniTimer = window.clearTimeout(this.aniTimer);
	this.mover(this.open ? this.outPos : this.homePos);
	if (!this.open) this.cambiaVisible(false)
	if ((this.open && !this.over) || (!this.open && this.over)) 
	{
		this.comienzaDeslizar(this.over);
	}
}


/////////////////////////////////////REPOSICIONA
menuDeslizante.prototype.reposiciona = function ()
{
	//reposicionar el menu dependiendo de la resolucion
	//desdpues de dos dias de pelea parece que al final funciona
	//EXPLICACIÓ DE LA FALLA: 
	//t1 => ancho de la tabla del menu de la izquierda de auxiliar portal. usamos offset para que lo coja bien (separacion real)
	//t2 => separacion entre el menu de la izquierda y el tablon (antes de la sombra izq del tablon). usamos offset para que lo coja bien
	//tablaIzquierda => suma total de ese desplazamiento
	//anchoentrada1 => ancho real de la primera celda de la tabla del menú (en html está en porcentaje)
	//para próximas actualizaciones (supongamos que queremos añadir mas menus deslizantes) vamos a poner todos estos anchos,
	//pero en esta primera versión solo esta puesto el de horarios
	//parte_derecha => pixels excluyendo el menu de la izquierda. nos servira para calcular donde empieza la tabla del menú
	//					p.ej en publicidad la tabla mide 76%, esto implica que tiene un 12% a cada lado de la parte derecha, 
	//					valor que se pasa a través del offset de la clase
	//newLeft => nuevo valor de la posicion izquierda, suma de 17 (imagen sombra) y las vars anteriores
	
		
	var tablaIzquierda  
	var nombre = this.id+"Container";
	
	t1 = parseInt(document.getElementById('contenedorizq').offsetWidth);
	
	t2 = parseInt(document.getElementById('margen').offsetWidth);
	
	var tablaIzquierda = t1 + t2 + 4;

	anchoEntrada1 = parseInt(document.getElementById('entrada1').offsetWidth);
		
	var parte_derecha = this.getWindowWidth() - tablaIzquierda;

	newLeft = 17 + tablaIzquierda + anchoEntrada1  + parte_derecha*this.offset;
	
	document.getElementById(nombre).style.left = newLeft+'px';// + resto;
	
}

//////////////////////////CAMBIA VISIBLE
menuDeslizante.prototype.cambiaVisible = function(bShow) 
{ 
	var s = this.ns4 ? this.container : this.container.style;
	s.visibility = bShow ? "visible" : "hidden";
}


///////////////////////////////////MOVER
menuDeslizante.prototype.mover = function(p) 
{ 
	this.style[this.orientacion == "h" ? "left" : "top"] = this.ns4 ? p : p + "px";
}


/////////////////////////////////ONACTIVATE
menuDeslizante.prototype.onactivate = function (){this.reposiciona()}

///////////////////////////////ONDEACTIVATE
menuDeslizante.prototype.ondeactivate = function (){}

//////////////////////////////GETWINDOWWIDTH
menuDeslizante.prototype.getWindowWidth = function ()
{
	return window.innerWidth ? window.innerWidth : document.body.offsetWidth;
}