// Javascript con un bucle infinito para hacer una animacion  

var velocidad = 1000;
var posMarcador = 3;
var idVisible = 0;
var animacion = "off";
var out; //variable que guarda el siteTimeOut de la animación.
function setComienzo(x)
{
	idVisible = x;
}
function aumentarVelocidad ()
{
	if ((posMarcador >= 3) && (posMarcador < 6))
		velocidad -= 300;
	else if ((posMarcador >= 0) && (posMarcador < 3))
		velocidad -= 500;
	posMarcador += 1;
}

function disminuirVelocidad ()
{
	if ((posMarcador > 3) && (posMarcador <= 6))
		velocidad += 300;
	else if ((posMarcador > 0) && (posMarcador <= 3))
		velocidad += 500;
	posMarcador -= 1;
}

function pausa ()
{
    velocidad = 0;
}

function reanudar (nombre, inicio, actual, fin, incremento, tiempo)
{
    velocidad = -1;
	recarga (nombre, inicio, actual, fin, incremento, tiempo);
}

function recarga (nombre, inicio, actual, fin, incremento, tiempo)
{
    if (velocidad < 0)
    {
       velocidad = tiempo;
	}
       
    tiempo = velocidad;
    ocultarVisible();
    mostrarImagen(actual);
	
	actual = actual + incremento;

	if (actual == (fin + incremento))
	{
		actual = inicio;
	}
	if (velocidad > 0)
	{
		out=setTimeout("recarga('" + nombre + "'," + inicio + "," + actual + "," + fin + "," + incremento + "," + tiempo + ")", tiempo);
	}
}
//Mostramos la capa que pasamos por parámetro
function mostrar (nombreCapa)
{
	var capa;
	
	if (document.layers) 
	{
		capa = eval("document." + nombreCapa);
	}

	if (document.all)
	{
		capa = eval(nombreCapa + ".style");
	}

	if (document.getElementById) 
	{
		capa = eval('document.getElementById ("' + nombreCapa + '").style');
	}
		
	capa.visibility = (document.layers) ? "show" : "visible" ;
}

//Ocultamos la capa que le pasamos por parámetro
function ocultar (nombreCapa)
{
	var capa;
	
	if (document.layers) 
	{
		capa = eval("document." + nombreCapa);
	}

	if (document.all)
	{
		capa = eval(nombreCapa + ".style");
	}

	if (document.getElementById) 
	{
		capa = eval('document.getElementById ("' + nombreCapa + '").style');
	}
		
	capa.visibility = (document.layers) ? "hide" : "hidden" ;
}

function mostraryocultar (nombre, inicio, actual, fin, incremento, tiempo, nombre2)
{
	ocultarVisible();
	recarga(nombre, inicio, actual, fin, incremento, tiempo	);
}
function boton_click(id)
{
	var boton = construirCadena('boton', id);
	if (animacion == "off")
	{
		ocultarVisible();
		mostrarImagenNueva(id);
	}
	else if (animacion != "off")
	{
		if (eval('document.getElementById ("' + boton + '").style.backgroundImage') == 'url(/imagenes/gif/marcador_on.gif)')
			botonLibre(id);
		else if (eval('document.getElementById ("' + boton + '").style.backgroundImage') == '')
			botonPulsado(id);
	}
}
function mostrarImagen (id)
{	
	var imagen = construirCadena('imagen', id);
	
	mostrarFlecha(id);//mostramos la flecha oculta que está encima del botón.
	botonPulsado(id);
	mostrar(imagen);
	
	idVisible = id;

}
function mostrarImagenNueva (id)
{	
	var imagen = construirCadena('imagen', id);
	
	cargarImagen(imagen);
	
	mostrarFlecha(id);//mostramos la flecha oculta que está encima del botón.
	botonPulsado(id);
	mostrar(imagen);
	
	idVisible = id;
}
function cargarImagen(imagen)
{
	var imagenComentada = document.getElementById(imagen).innerHTML;
	imagenComentada = imagenComentada.replace("<!--", "");
	imagenComentada = imagenComentada.replace("-->", "");
	document.getElementById(imagen).innerHTML = imagenComentada;
}
function ocultarVisible()
{
	ocultar(construirCadena('imagen',idVisible));
	botonLibre(idVisible);
}
function botonLibre(id)
{
	var boton = construirCadena('boton', id);
	eval('document.getElementById("' + boton + '").style.backgroundImage =  ""');
}
function botonPulsado(id)
{
	var boton = construirCadena('boton', id);
	eval('document.getElementById("' + boton + '").style.backgroundImage =  "url(/imagenes/gif/marcador_on.gif)"');
}
function mostrarFlecha(id)
{
	var flecha = construirCadena('flecha', idVisible);
	ocultar(flecha);
	
	flecha = construirCadena('flecha', id);
	mostrar(flecha);
	
}
function animacion_masvel(coord, x)
{
	var numero;
	var Refcapa;
    
	if (posMarcador < 6)
	{
		aumentarVelocidad ();
		moverCapaLeft(coord, "animacion_marcador");

	}
	else
		posMarcador = 6;
}
function animacion_menosvel(coord, x)
{
	var numero;
	var Refcapa;
    	
	if (posMarcador > 0)
	{
		disminuirVelocidad ();
		moverCapaLeft(-coord, "animacion_marcador");

	}
	else
		posMarcador = 0;
}
function moverCapaLeft(x,capa)
{
	var Refcapa;
	var numero;
	
	if(document.getElementById)
	{  
        Refcapa='document.getElementById("' + capa + '").style.left';
	}
	else if(document.layers)
	{  
        Refcapa='document.' + capa + '.left';
	}
	else if(document.all)
	{ 
        Refcapa= capa + '.style.pixelLeft';
	}
	
	numero = parseInt(eval(Refcapa));
	numero += x;
	numero = numero + "px";
	eval(Refcapa + '= numero');
}
function animacion_stop(x,num)
{
	animacion = "off";
	clearTimeout(out);
	apagarTodos(num);
	ocultarVisible();
	mostrarImagen(x);
}
function animacion_pause(x)
{
	if (animacion == 'on')
	{
		animacion = 'pause';
		clearTimeout(out);
	}
	else if (animacion == 'pause')
	{
		animacion = 'on';
		play (idVisible, 1, x);
	}
}
function animacion_play(x)
{
	animacion_stop(x);
	animacion="on";
	encenderTodos(x);
	play(0, 1, x);
}
function play(actual, incremento, fin)
{      
    var tiempo = velocidad;
    var cont = 0;

	if (actual >= (fin + incremento))
		actual = 0;
		
	var boton = construirCadena('boton', actual);
	while (eval('document.getElementById ("' + boton + '").style.backgroundImage') == '' )
	{
		actual += incremento;
		if (actual == (fin + incremento))
			actual = 0;
		boton = construirCadena('boton', actual);
		cont++;
		
		if (cont > fin + incremento)
		{
			animacion_stop(fin);
		}
	}
	
    mostrarFlecha(actual);
    ocultar(construirCadena('imagen', idVisible));
    mostrar(construirCadena('imagen', actual));
    idVisible = actual;
    
    actual += incremento;
	if (actual >= (fin + incremento))
	{
		actual = 0;
	}
	
	if (velocidad > 0)
	{
		out=setTimeout("play(" + actual + "," + incremento + "," + fin + ")", tiempo);
	}
}
function encenderTodos(x)
{
	for (var i = 0; i <= x; i++)
	{
		botonPulsado(i);
		var imagen = construirCadena('imagen', i);
		cargarImagen(imagen);
	}
}
function apagarTodos(x)
{
	for (var i = 0; i <=x; i++)
		botonLibre(i);
}
function construirCadena(cadena, id)
{
	return cadena + id;
}

function isImageLoaded(x) {
	var a = new Boolean(true);
	for (var i = 0; i <= x; i++)
	{
		var imagen = construirCadena('imagen', i);
		do
		{
		 var completo = document.getElementById(imagen).complete;
		}while(completo);	   
    }
    return a;
}

function sleep(milliseconds) 
{
	var start = new Date().getTime();
	for (var i = 0; i < 1e7; i++) 
	{
	    if ((new Date().getTime() - start) > milliseconds)
	    {
	      break;
	    }
	}
}

