/**** VISIBILIDAD ****/

//------------------------------------------------------------------------------
//Hace que un elemento visible sea invisible y viceversa
function cambiarVisibilidad(foo, img) {
	if(document.getElementById(foo).style.display=="block")	{
		document.getElementById(foo).style.display="none";
		img.firstChild.firstChild.src='images/flecha.down.gif';
	} else {
		document.getElementById(foo).style.display="block";
		img.firstChild.firstChild.src='images/flecha.up.gif';
	}
}
//------------------------------------------------------------------------------

//Igual que la anterior, pero cambiando el color de las flechas
function cambiarVisibilidad2(foo, img) {
	if(document.getElementById(foo).style.display=="block")	{
		document.getElementById(foo).style.display="none";
		img.firstChild.firstChild.src='images/flecha2.down.gif';
	}
	else {
		document.getElementById(foo).style.display="block";
		img.firstChild.firstChild.src='images/flecha2.up.gif';
	}
}
//------------------------------------------------------------------------------
/**** MISCELANEA ****/
function abrirPopUp(direccion, alto, ancho){
	if(ancho==null)
		ancho="800";
	if(alto==null)
		alto="600";
	sub1=open(direccion, "", "fullscreen=no,resizable=yes,scrollbars=yes,toolbar=yes,height="+alto+",width="+ancho);
}
//------------------------------------------------------------------------------
//Genera unos botones para controlar el tamaño de la letra.
function controlTamanyoLetra(){
	var out='<img src="imagenes/reducir.png" style="cursor:pointer;" onclick="javascript:document.body.style.fontSize=\'60%\';" alt="Reducir tamaño de letra"/> \
	<img src="imagenes/normal.png" style="cursor:pointer;" onclick="javascript:document.body.style.fontSize=\'85%\';" alt="Tamaño de letra normal"/> \
	<img src="imagenes/ampliar.png" style="cursor:pointer;" onclick="javascript:document.body.style.fontSize=\'130%\';" alt="Ampliar tamaño de letra"/>';
	return out;
}
//------------------------------------------------------------------------------
/*
 * Redimensionamiento de elementos
 */
//------------------------------------------------------------------------------
//Redimensionar una ventana
function set(){
	window.resizeTo(640,480);
	var width=640-173;
	var height=480-220;
	document.getElementById("mainBody").style.width=String(width)+"px";
	document.getElementById("mainBody").style.height=String(height)+"px";
}/**/
//------------------------------------------------------------------------------
//Ajustar el layout de un elemento dado al ancho de la ventana.
//Elemento="mainBody",margIzq=160,margArri=20,margDer=10,margAba=20
function adjustLayout(Elemento,margIzq,margArri,margDer,margAba){
	if(Elemento==null)
		Elemento="mainBody";
	if(margIzq==null)
		margIzq=160;
	if(margArri==null)
		margArri=20;
	if(margDer==null)
		margDer=10;
	if(margAba==null)
		margAba=20;
	//Obtengo el objeto a ajustar
	ajuste=document.getElementById(Elemento);
	//Calcula el ancho y el alto
	width=document.body.offsetWidth-(margDer+margIzq);
	height=document.documentElement.clientHeight-40;
	//Establece el tamaño de los diferentes elementos
	ajuste.style.width=String(width)+"px";
	ajuste.style.height=String(height)+"px";
	ajuste.style.marginLeft=String(margIzq)+"px";
	ajuste.style.marginRight=String(margDer)+"px";
	ajuste.style.marginTop=String(margArri)+"px";
	ajuste.style.marginBottom=String(margAba)+"px";
}/**/
//------------------------------------------------------------------------------
//Establece el Ancho y alto de un elemento
function setWidth(elemento,ancho,alto,borde){
	var objeto=document.getElementById(elemento);
	objeto.style.width=ancho+"px";
	objeto.style.height=alto+"px";
	if(borde==true){
		objeto.style.borderStyle="solid";
		objeto.style.borderWidth="4px";
		objeto.style.backgroundColor="white";
		objeto.style.position="relative";
	}
	else{
		objeto.style.borderStyle="none";
		objeto.style.padding="0px";
	}
}
/******************************************************************************/
//Técnica del "desvanecimiento amarillo"
function desvanecer(objID, color,original,bgImage){
//	var desv;
	desv = new ResaltarAnim();
	desv.desvanecer("desv",objID);
}

function ResaltarAnim() {
	var objetivo; //Contenedor objetivo
	var objVar;	//Variable objetivo
	// This is the amount of time (in milliseconds) that will lapse between each step in the fade
	var FadeInterval = 100;

	// This is where the fade will start, if you want it to be faster and start with a 
	// lighter color, make this number smaller
	// It corresponds directly to the FadeSteps below
	var StartFadeAt = 6;
	var EndFadeAt=1;

	// This is list of steps that will be used for the color to fade out
	var FadeSteps = new Array();
		FadeSteps[1] = "ad";
		FadeSteps[2] = "bd";
		FadeSteps[3] = "ce";
		FadeSteps[4] = "df";
		FadeSteps[5] = "ef";
		FadeSteps[6] = "ff";
		FadeSteps[7] = "99";
		FadeSteps[8] = "88";
		FadeSteps[9] = "77";
		FadeSteps[10]= "66";
		FadeSteps[11]= "55";
		FadeSteps[12]= "44";
		FadeSteps[13]= "33";
		FadeSteps[14]= "22";
		FadeSteps[15]= "11";
		FadeSteps[16]= "00";
	var step=0;
	//Este es el color original. A ver cómo lo mezclo con el amarillo ¬¬
	var original=null;
	var opacidad=null;
	var bgImage=null;
	var degradando=false;
	
	// This is the recursive function call that actually performs the fade
	this.desvanecer = function desv(ObjVar, Objetivo){//targetID, colorId, Original,BgImage) {
		if(ObjVar!=null){
			objVar=ObjVar;
		}
		if(Objetivo!=null)
			objetivo=Objetivo;
		objeto=document.getElementById(objetivo);
		//Guardar configuracion inicial
		bgImage=objeto.style.backgroundImage;
		opacidad=objeto.style.opacity;
		
		if(step==0)
			step=StartFadeAt;

	    if (step >= EndFadeAt) {
			objeto.style.backgroundColor = "#3359" + FadeSteps[step];
			objeto.style.backgroundImage="none";
			
	        // If it's the last color, set it to the original color
	        if (step==EndFadeAt) {
	        	if(original=='' || original==null){
	        		objeto.style.backgroundColor = 'transparent';
	        	}
	        	else
		            objeto.style.backgroundColor = original;
	            objeto.style.backgroundImage = bgImage;
	            objeto.style.opacity='1.0';
				//delete this;
			}
	        step--;
			if(step!=0)
		        setTimeout(objVar+'.desvanecer()', FadeInterval);
		}
	}
}
/******************************************************************************
	CLASE "EfectoVisual"
	METODOS:
		fadeIn - Establece una animación de desvanecimiento (mostrar)
		fadeOut - Establece una animación de desvanecimiento (ocultar)
		show - Muestra un objeto
		hide - Oculta un objeto
		alpha - Establece el nivel de transparencia de un objeto
	FORMA DE USO:
		Se crea un objeto, que es el que se utilizará para almacenar las llamadas. El objeto EfectoVisual creado no será reutilizado por otros, 
		aunque pueda hacerse, porque se induce a confusión, y se reduce la compatibilidad con Internet Explorer
		Al menos en la primera ejecución de fadeIn o fadeOut hay que establecer el 'objetivo' y el 'objVar'
		ej:
			efectoVisual = new EfectoVisual();
			efectoVisual.init('efectoVisual','objetivo');
			efectoVisual.fadeIn();
 ******************************************************************************/
function EfectoVisual(ObjVar) {
	if(ObjVar!=null)
		objVar=ObjVar;
		
		
	var objetivo;		//Objeto del documento
	var objVar;			//Variable Efecto creada
	var effect;			//El efecto en Uso;
	var FadeInterval = 100;	// Cada cuánto tiempo se actualiza
	var step=5;		//En las animaciones, el porcentaje de progreso
	var opacidad=null;	//Opacidad del objeto
	var repetitions;	//número de repeticiones de cierto efecto (sólo para los recurrentes)
	var temp1;			//variable temporal 1
	var flag1;			//flag value used in various functions
	

	//Inicializa la función
	this.init = function init(ObjVar, Objetivo){
		if(ObjVar!=null)
			objVar=ObjVar;
		if(Objetivo!=null)
			objetivo=Objetivo;
	}
	
	// This is the recursive function call that actually performs the fade
	this.fadeIn = function fadeIn(Objetivo, ObjVar){
		if(effect!="fadeIn"){
			effect="fadeIn";
			opacidad=10;
		}
		if(ObjVar!=null){
			objVar=ObjVar;
		}
		if(Objetivo!=null){
			objetivo=Objetivo;
		}
		if(objetivo==null){
			return;
		}
		if(objetivo.style.display=="none")
			objetivo.style.display="block";
		if(navigator.appName=="Microsoft Internet Explorer"){
			//alert(objVar+'.'+effect+'() -> '+opacidad);
			objetivo.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+opacidad+")";
		}
		else{
			objetivo.style.MozOpacity=String(opacidad / 100);
		}
		if(opacidad<100 && effect=="fadeIn"){
			setTimeout(objVar+'.fadeIn()', this.FadeInterval);
		}
		else{
			effect="ninguno";
		}
		opacidad+=step;
	}
	//------------------------------------------------------------------------------
	// Función recursiva que hace el desvanecimiento
	this.fadeOut = function fadeOut(Objetivo, ObjVar){
		if(effect!="fadeOut"){
			effect="fadeOut";
			opacidad=100;
		}
		if(ObjVar!=null){
			objVar=ObjVar;
		}
		if(Objetivo!=null){
			objetivo=Objetivo;
		}
		if(objetivo==null){
			return;
		}
		//Iniciar operaciones
		if(objetivo.style.display=="none")
			objetivo.style.display="block";
		if(navigator.appName=="Microsoft Internet Explorer"){
			objetivo.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+String(opacidad)+")";
		}
		else{
			objetivo.style.MozOpacity=String(opacidad / 100);
		}
		//Establecer temporizador
		if(opacidad>0 && effect=="fadeOut"){
			setTimeout(objVar+'.fadeOut()', this.FadeInterval);
		}
		else{
			//Ocultamos completamente el objeto
			objetivo.style.display="none";
			effect="ninguno";
		}
		opacidad-=step;
	}
	//------------------------------------------------------------------------------
	// Función recursiva que hace el desvanecimiento
	this.pulsate = function pulsate(Objetivo, ObjVar){
		//Aquí, el flag1 se usa para indicar: true-apareciendo; false-desvaneciendo
		if(effect!="pulsate"){
			effect="pulsate";
			opacidad=100;
			flag1=false;
			repetitions=4;
			temp1=FadeInterval;
			FadeInterval=50;
			step=12.5;
		}
		if(ObjVar!=null)
			objVar=ObjVar;

		if(Objetivo!=null)
			objetivo=Objetivo;
		if(objetivo==null)
			return;

		//Iniciar operaciones
		if(objetivo.style.display=="none")
			objetivo.style.display="block";
		if(navigator.appName=="Microsoft Internet Explorer"){
			objetivo.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+String(opacidad)+")";
		}
		else{
			objetivo.style.MozOpacity=String(opacidad / 100);
		}
		//Establecer temporizador
		if(effect=="pulsate" && repetitions>0){
			setTimeout(objVar+'.pulsate()', this.FadeInterval);
			
			if(opacidad<0 && flag1==false){
				flag1=true;
				repetitions--;
			}else if(opacidad>100 && flag1==true){
				flag1=false;
				repetitions--;
			}
		}
		else{
			FadeInterval=temp1;
			effect="ninguno";
		}
		
		if(flag1==false)
			opacidad-=step;
		else
			opacidad+=step;
	}
	//------------------------------------------------------------------------------
	//Hace visible un elemento
	this.show = function show(object) {
		if(object==null)
			return;
		object.style.display="block";
		if(navigator.appName=="Microsoft Internet Explorer"){
			object.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
		}
		else{
			object.style.MozOpacity="1";
		}
	}
	//------------------------------------------------------------------------------
	//Hace invisible un elemento
	this.hide = function hide(object) {
		if(object==null)
			return;
		object.style.display="none";
		if(navigator.appName=="Microsoft Internet Explorer"){
			object.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
		}
		else{
			object.style.MozOpacity="0";
		}
	}
	//------------------------------------------------------------------------------
	//El valor del canal alfa, se introduce un valor entre 0 y 100
	this.alpha = function alpha(value,object) {
		if(object==null)
			return;
		if(navigator.appName=="Microsoft Internet Explorer"){
			object.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+value+")";
		}
		else{
			object.style.MozOpacity=String(value/100);
		}
	}
}