// <?

/*
esta version de slideShow usa un div con la imagen de background para hacer fade, 
toma el tamanio del div contenedor por lo que este lo necesita como style.
es para evitar que los idiotas carguen imagenes mas grandes que el tamaņo del contenedor, 
aunque no evita que lo hagan previene desbordamientos
*/

function SdmSlideShow($sso,$elements,$aImages,$path,$auto,$delay){
// variables de la "clase"
	var $ia,$th,$es,$fs,$ci,$tar,$tarl,$autorun,$halt,$ad,$pc;
// bloquea todo
	$halt																		= false;
// separa los contenedores de imagen y texto
	$es																			= $elements.split(";");
// captura el contenedor de las imagenes
	$ia																			= document.getElementById($es[0]);
// cambia de imagen cada $auto segundos o no
	$autorun																	= $auto || false;
// frames por segundo para los fadein y fadeouts
	$fs																			= $delay || 5;

// captura el body para peload y trace
	$ad																			= document.getElementsByTagName("body");
// getElementsByTagName siempre devuelve una matriz
	$b																			= $ad[0];
// contador de la imagen actual para el preload
	$pc																			= 1;

// INICIALIZACION --------------------------------------------------------------------------------------------------
	this.init = function(){
		if($aImages != "nodata"){
	// crea un AFANADISIMO DE hyt_scrolling.js
			$this																	= "$"+this.hash();
			eval($this+" = this");
	// establece la cantidad de indices en $aImages
			$tarl																	= $aImages.length;
	// hace de $tar una matriz
			$tar																	= new Array();
	// recorre $tar hasta $tarl
			for($i=0;$i<$tarl;$i++){
	// cada i de $tar es un array
				$tar[$i]															= new Array();
	// pasa las imagenes de $aImages a $tar (los nombres de las imagenes son el indice 0 de cada matriz que forma $aImages)
				$tar[$i][0]															= $aImages[$i][0];
				$tar[$i][1]															= $aImages[$i][1];
				$tar[$i][2]															= this.hash();
	// llama la funcion getimg en la primera vuelta, para cargar la primera imagen
				if($i == 0){
					this.FireForEfect($i);
				}
			}
	// ejecuta la funcion preload
			this.preload();
		}else{
			$halt = true;
			$ia.style.background = "#FFFFFF";
		}
	}

// GENERA UN HASH, AFANADISIMO DE hyt_scrolling.js -----------------------------------------------------------------
	this.hash = function(){
		var $eNow																= new Date();
		return "_"+this.shuffle($eNow.getTime());
	}

// MEZCLA UN HASH PARA USAR COMO IDENTIFICADOR ---------------------------------------------------------------------
	this.shuffle = function($sh){
		return String($sh).split("").sort(function(){return Math.random()<0.5?-1:1}).join("");
	}

// HACE PLAY SI NO HAY $autorun ------------------------------------------------------------------------------------
	this.play = function(){
		if(!$autorun){
			$autorun															= $autorun || 5;
			this.nav(1);
		}
	}

// HACE STOP SI HAY $autorun ---------------------------------------------------------------------------------------
	this.stop = function(){
		if($autorun){
			$autorun															= false;
			clearInterval($ia.timer);
		}
	}

// LLAMA LAS FUNCIONES DE IMAGEN Y TEXTO ---------------------------------------------------------------------------
	this.FireForEfect = function($i){
		if($ia != null){
			this.getimg($i);
			this.gettxt($i);
		}else{
			alert("missing declared image holder element id '"+$es[0]+"'");
			$halt																= true;
		}
	}

// LLAMA LA IMAGEN A MOSTRAR ---------------------------------------------------------------------------------------
	this.getimg = function($id){
	// si hay $autorun
		if($autorun){
	// mata el interval de ia
			clearInterval($ia.timer);
		}
	// si $ci es diferente de null ($ci = "curren image")
		if($ci != null){
	// variable para usar dentro del if
			var $ts,$tsl,$o;
	// ts es todos los div con imagen dentro del div contenedor
			$ts																	= $ia.getElementsByTagName("div");
	// $tsl es la cantidad de elementos img en $ts
			$tsl																= $ts.length;
	// por cada img en ia
			for($x=0;$x<$tsl;$x++){
	// o es el elemento img de esta vuelta
				$o																= $ts[$x];
	// se mata el interval de $o
				clearInterval($o.timer);
	// y se le aplica fadeout
				$o.timer														= setInterval(function(){eval($sso).fdout($o)},$fs);
			}
		}
	// si no existe ningun elemento img con el $id indicado
		if(!document.getElementById($tar[$id][2])){
	// i es un elemento div
			var $i																= document.createElement("div");
	// se le incluye i a ia
			$ia.appendChild($i);
	// se le da el $id generado al indexar
			$i.id																= $tar[$id][2];
	// valor para hacer fadein, i es un objeto despues de todo
			$i.av																= 0;
	// es declara el background
			$i.style.background													= "url('"+$path+$tar[$id][0]+"') center center no-repeat";
	// aplica los estilos necesarios al contenedor de la imagen (modo muestra)
			this.stileto($i,true);
	// si si existe un elemento con el $id indicado
		}else{
	// se captura el elemento img que cuadra con $id
			$i																	= document.getElementById($tar[$id][2]);
	// y se le mata el interval
			clearInterval($i.timer);
		}
	// se le agrega a i un fade in
		$i.timer																= setInterval(function(){eval($sso).fdin($i)},$fs);
	}

// LLAMA AL TEXTO QUE VA CON LA IMAGEN -----------------------------------------------------------------------------
	this.gettxt = function($i){
		if($es[1]){
	// captura el contenedor del texto
			$th																	= document.getElementById($es[1]);
			if($th != null){
	// se lo mete
				$th.innerHTML													= $tar[$i][1];
			}else{
				alert("declared text holder element id '"+$es[1]+"'");
			}
		}
	}

// APLICA LOS ESTILOS AL DIV CONTENEDOR DE LA IMAGEN ---------------------------------------------------------------
	this.stileto = function($i,$bl){
	// usa $bl es true se usan los estilos de image para mostrar
		if($bl){
	// le aplica un ancho igual al del contenedor
			$i.style.width = $i.parentNode.style.width;
	// le aplica un alto igual al del contenedor
			$i.style.height = $i.parentNode.style.height;
	// posicion absoluta para poder encimar
			$i.style.position													= "absolute";
	// se le da style.opacity 0 para que no se vea
			$i.style.opacity													= 0;
	// o filter alpha si es mierdaexplorer
			$i.style.filter														= "alpha(opacity=0)";
	// si no los de imagen para precarga
		}else if(!$bl){
	// lo pone invisible
			$i.style.visibility													= "hidden";
	// lo pone intangible
			$i.style.display													= "none";
	// alto y ancho 1px
			$i.style.width = $i.style.height									= "1px";
		}
	}

// TIMER PARA CAMBIO ENTRE IMAGENES --------------------------------------------------------------------------------
	this.auto = function(){
		$ia.timer																= setInterval(function(){eval($sso).nav(1)},$autorun*1000);
	}

// NAVEGA ENTRE LAS IMAGENES ---------------------------------------------------------------------------------------
	this.nav = function($d){
	// si el script no esta bloqueado
		if(!$halt){
			var $c,$np,$g;
	// indice de la imagen actual en $tar, el default es 0
			$c																	= 0;
	// cual es el indice de $tar donde $tar[n][2] es igual a $ci.id
			for(x=0;x<$tarl;x++){
	// si se encuentra una coincidencia
				if($tar[x][2] == $ci.id){
	// se establece $c como el indice que matchea
					$c															= x;
				}
			}
	// $np es $c+$d que es new position es current+direction
			$np																	= parseInt($c)+$d;
	// si $np es mayor que $tarl
			if($np>($tarl-1)){
	// $g es vuelta al principio
				$g																= 0;
	// si $np es meor que 0
			}else if($np<0){
	// $g es ir al inicio
				$g																= $tarl-1;
	// si no
			}else{
	// $g es $np
				$g																= $np;
			}
	// llama al par $g
			this.FireForEfect($g);
		}else{
			this.FireForEfect();
		}
	}

// FADEIN ----------------------------------------------------------------------------------------------------------
	this.fdin = function($i){
	// se establece av como av + fs en $i para la proxima llamada
		$i.av																	= $i.av+$fs;
	// opacity es $i.av/100 (opacity va de 0 a 1)
		$i.style.opacity														= $i.av/100;
	// filter es $i.av (filter va de 0 a 100)
		$i.style.filter															= "alpha(opacity="+$i.av+")";
	// si av de $i es mayor o igual a 100
		if($i.av>=100){
	// si hay $autorun
			if($autorun && $tarl > 1){
	// ejecuta auto
				this.auto();
			}
	// mata el interval de $i
			clearInterval($i.timer);
	// establece i como $ci
			$ci																	= $i;
		}
	}

// FADEOUT ---------------------------------------------------------------------------------------------------------
	this.fdout = function($i){
	// $i es el elemento img al que se le deve hacer fadeout
	// se establece av como av + fs en $i para la proxima llamada
		$i.av																	= $i.av-$fs;
	// opacity es $i.av/100 (opacity va de 0 a 1)
		$i.style.opacity														= $i.av/100;
	// filter es $i.av (filter va de 0 a 100)
		$i.style.filter															= "alpha(opacity="+$i.av+")";
	// si av de $i es menor o igual a 0
		if($i.av<=0){
	// mata el interval de $i
			clearInterval($i.timer);
	// si $i tiene elemento parent
			if($i.parentNode){
	// elimina $i del elemento parent de $i
				$i.parentNode.removeChild($i);
			}
		}
	}

// HACE UNA PRECARGA DE LAS IMAGENES CADA 5 SEGUNDOS DESPUES DE QUE LA IMAGEN SE CARGO -----------------------------
	this.preload = function(){
	// si $pc es menor que $tarl + 1
		if($pc <= parseInt($tarl)-1){
	// crea un elemento img
			var $i																= document.createElement("img");
	// le incluye $i a $b
			$b.appendChild($i);
	// aplica los estilos necesarios a la imagen (modo preload)
			this.stileto($i,false);
	// es declara el src
			$i.src																= $path+$tar[parseInt($pc)][0];
	// se le agrega autoerase a $i cada 5 milesimas de segundo
			$i.timer															= setInterval(function(){eval($sso).autoerase($i)},5);
	// incrementa $pc
			$pc++;
		}
	}

// HACE QUE UNA IMAGEN SE BORRE A SI MISMA CUANDO COMPLETE ---------------------------------------------------------
	this.autoerase = function($i){
	// si la imagen esta complete
		if($i.complete){
	// mata el interval de $i
			clearInterval($i.timer);
	// ejecuta preload para que cargue la siguiente imagen
			this.preload();
	// elimina la imagen
			$i.parentNode.removeChild($i);
		}
	}

// IMPRIME EN PANTALLA UN DIV CON LOS VALORES PASADOS, CADA VEZ QUE SE LA LLAMA ------------------------------------
	this.trace = function($v){
		var $d,$t,$e;
	// crea el contenido con lo que se le paso
		$t																		= document.createTextNode($v);
	// crea el contenedor
		$d																		= document.createElement("div");
	// aplica el contenido al contenedor
		$d.appendChild($t);
	// aplica el contenedor al documento
		$b.appendChild($d);
	}

// INICIALIZACION --------------------------------------------------------------------------------------------------
	this.init();

}