//script para cargar con ajax las imagenes e insertarlas en el div imagen_cabecera
function creaSlider() {


//variable global que indica si la imagen grande ha terminado de cargar y desplazarse
//para cargar la siguiente en el modo automático
var activo = true;

var contenedorInfoDinamica = jQuery('#texto_campana');

//contenedor del slider
var contenedor = jQuery('#slider_interior');
//elementos originales del slider
var elementos = contenedor.children();

//funcion para cargar las imagenes, pasando como argumentos el id del contenedor y el de la foto
var cargaTexto = function(contenedor,id) 
{	
	//variable global que debe estar en false mientras la imagen se carga y se desplaza para el modo automático
	activo = true;
	
	var elemento = elementos.eq(id);
	
	var titulo = jQuery(elemento).find('.si_tit');
	var descripcion = jQuery(elemento).find('.si_descripcion');
	var leermas = jQuery(elemento).find('.si_leer_mas');
	titulo = '<p>'+jQuery(titulo[0]).html()+'</p>';
	leermas = '<p id="texto_campana_leermas">'+leermas.html()+'</p>';
	
	if (descripcion.length == 0)
	{
		descripcion = '';
	}
	else
	{
		descripcion = descripcion.html();
	}
  
	//la colocamos en su contenedor
	jQuery(contenedorInfoDinamica).hide().html(titulo+descripcion+leermas).fadeIn();
	
	
}//cargatexto


//funcion para desplazar el slider
function sliderInterior()
{
	//numero de elementos en el slider
	var numEl = contenedor.children().length;
	//anchura de cada elemento
	var anchuraEl = contenedor.find('li:first').width();
	
	//primer elemento del listado
	var elActual = elementos.first;
	//id del primer elemento del listado
	var idElActual = elementos.first().attr('id');
	
	//boton para retroceder
	var botonAvance = jQuery('#si_cont_fwd');
	//boton para avanzar
	var botonRetroceso = jQuery('#si_cont_bwd');


	var activarBotones = function(idElActual)
	{
		//habría que valorar la posibilidad de un slider continuo
		//en ese caso no habría que ejecutar esta funcion
		
		switch (idElActual) 
		{
			//al cargar la página el elemento actual es el 0
			case 'si_elemento_0':
			//desactivamos el boton de retroceder
			botonRetroceso.removeClass('activo');
			botonRetroceso.addClass('inactivo');
			botonRetroceso.unbind('click.miseventos',presionarBoton);
			break;
			
			case 'si_elemento_'+(numEl-1):
			//si al mover el slider el elemento actual es el último,
			//es decir, igual al número de elementos -1 (porque la lista empieza en 0, no en 1)
			//desactivamos el botón de avanzar
			botonAvance.removeClass('activo');
			botonAvance.addClass('inactivo');
			botonAvance.unbind('click.miseventos',presionarBoton);
			//si llegamos al final, paramos el slider
			autoslide('stop');
			break;
			
			default:
			eventosRetroceso = botonRetroceso.data('events') || false;
			eventosAvance = botonAvance.data('events') || false;
				
			//los botones por defecto siempre tienen un evento, correspondiente al click para detener el slider
			//por lo que si solo hay un evento, quiere decir que no hay evento de click para desplazar, y hay que añadirlo
			if (eventosRetroceso)
			{
				if (eventosRetroceso.click.length == 1)
				{
					botonRetroceso.bind('click.miseventos',presionarBoton);
				}
			}
			if (eventosAvance)
			{
				if (eventosAvance.click.length == 1)
				{
					botonAvance.bind('click.miseventos',presionarBoton);
				}		
			}
			
			//si el boton retroceso tiene la clase inactivo, se la quitamos
			if (botonRetroceso.hasClass('inactivo')) botonRetroceso.removeClass('inactivo');
			//si el boton de avance tiene la clase inactivo, se la quitamos
			if (botonAvance.hasClass('inactivo')) botonAvance.removeClass('inactivo');
			//si el boton de avance no tiene la clase activo, se la añadimos
			if (!botonRetroceso.hasClass('activo')) botonRetroceso.addClass('activo');
			//si el boton de avance no tiene la clase activo, se la añadimos
			if (!botonAvance.hasClass('activo')) botonAvance.addClass('activo');
			break;
		}
	}//activarbotones
	
	var moverSlider = function(direccion)
	{
		//elemento que se encuentra actualmente activo
		var primerElemento = contenedor.children().first();
		
		//elemento que se encuentra al final de la lista
		var ultimoElemento = contenedor.children().last();

		
		switch(direccion) 
		{			
			case 'fwd':
			//hacemos desaparecer el elemento
			jQuery(primerElemento).fadeOut('slow', function() {
				//le clonamos y hacemos que sea visible
				var elementoTemp = jQuery(this).clone().css('display','block');
				//eliminamos el elemento original que está sobre los demás transparente
				jQuery(this).remove();
				//insertamos el elemento temporal al final de la lista de elementos
				contenedor.append(elementoTemp);
				});
				//establecemos el id del elemento actual
				elActual = primerElemento.next();
				
		    break;
			
			case 'bwd':
			//hacemos desaparecer el elemento
			jQuery(ultimoElemento).fadeOut('slow', function() {
				//le clonamos 
				var elementoTemp = jQuery(this).clone();
				//insertamos el elemento temporal al principio de la lista de elementos y le hacemos visible
				contenedor.prepend(elementoTemp);
				elementoTemp.fadeIn();
				//eliminamos el elemento original que está al final de la lista
				jQuery(this).remove();
				});
				//establecemos el id del elemento actual
				elActual = ultimoElemento;
				
			break;
			
		}//switch
		
		idElActual = elActual.attr('id');	
		return idElActual;
		
	}//moverslider
	
	//funcion que se ejecuta como callback al hacer click en los botones para mover el slider
	//esta función lleva por defecto el parametro event que recoge el evento y sus propiedades
	//dentro de la función, el objeto $(this) recoge el propio botón sobre el que se ha hecho click
	var presionarBoton = function(event)
	{
		event.preventDefault();
		
		
		
		var idBoton = jQuery(this).attr('id');
		var direccion = '';
		//al hacer click en el boton de avanzar, pasamos el parametro 'fwd' o 'bwd' a la función de mover el slider
		switch(idBoton)
		{
			case 'si_cont_fwd':
			direccion = 'fwd';
			break;
			
			case 'si_cont_bwd':
			direccion = 'bwd';
			break;
		}
		//esta función devuelve el id del elemento que se encuentra en primer lugar en el slider
		var idElActual = moverSlider(direccion);
		//comprobamos si es el primer elemento o el último para activar o desactivar los botones
		activarBotones(idElActual);
		
		//cargamos la imagen correspondiente al elemento que acaba de activarse
		//si el elemento acutal es 'si_elemento_10', tendremos que seleccionar el número '10'
		var numIdElActual = idElActual.substring(12);
		cargaTexto('texto_campana',numIdElActual)
		
	}//presionarboton
	
				
	//función para avanzar el slider
	jQuery(botonAvance).bind('click.miseventos',presionarBoton);
	
	//función para retroceder el slider
	jQuery(botonRetroceso).bind('click.miseventos',presionarBoton);
	
	//inicializamos los botones
	activarBotones(idElActual);
	
	//funcion para hacer click en el slider de forma automática
	//el temporizador hacer que el slider vaya hacia delante solamente
	//por eso asignamos al propio boton de avanzar el temporizador
	//la función ejecuta un click sobre el botón pasados 5s desde la llamada
	var autoslide = function(modo)
	{
		switch(modo)
		{
			case 'play':
			//si activamos el autoslide, ponemos en marcha un temporizador que llamará a la función
			//para cambiar de imagen cada segundo
			jQuery(window).bind('FIN_CARRERA',function()
			{
				cambiaImagen();
			});
			break;
			case 'stop':
			//paramos el temporizador que lanza el vento
			jQuery(window).unbind('FIN_CARRERA');
			break;
		}
		
		
		var cambiaImagen = function()
		{
			botonAvance.oneTime("1s", "autoslide", function() 
			{
				jQuery(botonAvance).trigger("click.miseventos");			
			});	
		}
		
		
	}//autoslide
	
			
		//inicializamos el modo autoslide
		jQuery(autoslide('play'));
		
		//si hacemos click en los botones o en una imagen paramos el autoslide	
		botonAvance.bind("click", function(){
			autoslide('stop')
		});
		botonRetroceso.bind("click", function(){
			autoslide('stop')
		});
		
		var enlaces = jQuery(".si_img_link");
		
		
		//hay que añadir el escuchador mediante el metodo live, puesto que los elementos del DOM
		//se clonan, borran y re-crean para reordenarlos y permitir que el slider sea continuo
		enlaces.live('click',function(e){

            //añadimos el lightbox a la miniatura
			autoslide('stop');
		


		});
	

}//sliderInterior

	//cargamos la primera imagen
	cargaTexto('imagen_cabecera',0)
	//activamos el slider
	sliderInterior();

}//creaSlider


