// JavaScript Document
var sweet = new highlight();

function highlight(){
	this.images = new Array();
	this.container;
	this.counterpreloader = 0;
	this.currentimage = 0;
	this.counter = 0;
	this.rotator;
	this.time;

	this.slider = function(cont, t) {
		// Asinga la raíz al objeto acutal
		var root = this;
		// Asigna el tiempo de deslizamiento a t milisegundos
		this.time = t * 1000;
		// Asgina el contenedor principal (<div class="highlight" [...]>) a cont
		this.container = document.getElementById(cont);
		// Asigna a la matriz de imágenes los elementos <img> del contenedor
		var imagenes = this.container.getElementsByTagName('img');
		//  Itera hasta el número de elementos de la matriz de imágenes
		for (var i = 0; i < imagenes.length; i++){
			// Asinga a una matriz de imágenes del documento cada imagen
			// de la matriz de imágenes del contenedor
			this.images[i] = imagenes[i];
			this.images[i].style.opacity = '0';
			this.images[i].style.filter = 'alpha(opacity=0)';
			// Crea un nuevo elemento de imagen
			var img = new Image();
			// Le asigna un índice de nivel para el eje Z
			img.z = i;
			// Le asigna el origen de la imagen
			img.src = this.images[i].src;
			// Asigna función al cargar la imagen
			img.onload = function() {
				// Asigna el índice del eje Z al elemento en posición z a un nivel 
				// superior al de la nueva imagen
				root.images[this.z].style.zIndex = this.z + 1;
				// Incrementa el contador de pregarga de imágenes
				root.counterpreloader += 1;
				// Actua en caso de que el contador de precarga es superior o igual
				// al número de elementos de la matriz de imágenes del contenedor,
				// cosa que sucederá con la primera carga de la primera imagen
				if (root.counterpreloader >= imagenes.length) {
					// Asigna el índice de nivel en el eje Z al superior al conteo de imágenes
					root.images[0].style.zIndex = imagenes.length + 1;
					// Aplica un efecto de aparición a la imagen (transición de opacidad)
					root.fadeElement(root.images[0], true);
					// Inicializa el contador de pregarga de imágenes
					root.counterpreloader = 0;
					// Cambia de imagen desde la imagen actual (0) a la siguiente
					root.swithImage(root.currentimage);
					root.container.style.background = "#ffffff";
					// Carga los botones (etiquetas <p>) de la matriz de botones del contenedor
					//root.loadButtons(nav);
				}
			}
		}
	}

	this.fadeElement = function(element,fadetype){
		if(fadetype){ var fadenumber = 0; } else { var fadenumber = 10; }
		var fadeopacity;
		var fadealpha;
		var showcontainer = setInterval(fade,100);
		function fade(){
			if(fadetype){
				fadenumber += 2;
				fadeopacity = fadenumber / 10;
				fadealpha = fadenumber * 10;
				if(fadenumber >= 10){
					clearInterval(showcontainer);
					element.style.opacity = '1';
					element.style.filter = 'alpha(opacity=100)';
				}else{
					element.style.opacity = fadeopacity;
					element.style.filter = 'alpha(opacity='+fadealpha+')';
				}
			}else{
				fadenumber-= 2;
				fadeopacity = fadenumber / 10;
				fadealpha = fadenumber * 10;
				if(fadenumber <= 0){
					clearInterval(showcontainer);
					element.style.opacity = '0';
					element.style.filter = 'alpha(opacity=0)';
				}else{
					element.style.opacity = fadeopacity;
					element.style.filter = 'alpha(opacity='+fadealpha+')';
				}
			}
		}
	}

	this.swithImage = function(current){
		this.currentimage = current;
		clearTimeout(this.rotator);
		this.rotator = setTimeout(swithImg,this.time);
		var root = this;
		function swithImg (){
			if(root.currentimage >= root.images.length - 1){
				root.fadeElement(root.images[root.currentimage],false);
				root.images[root.currentimage].style.zIndex = root.currentimage;
				root.fadeElement(root.images[0],true);
				root.images[0].style.zIndex = root.images.length + 1;
				//root.tagMake(0);
				root.currentimage = root.images.length;
			}else{
				root.fadeElement(root.images[root.currentimage],false);
				root.images[root.currentimage].style.zIndex = root.currentimage;
				root.fadeElement(root.images[root.currentimage + 1],true);
				root.images[root.currentimage + 1].style.zIndex = root.images.length + 1;
			}
			if(root.currentimage >= root.images.length){
				root.currentimage = 0;
			}else{
				root.currentimage++;
			}
			root.rotator = setTimeout(swithImg,root.time);
		}
	}

	this.chageItem = function(element){
		if(element != this.botones[this.currentimage]){
			for(var i = 0; i<this.botones.length; i++){
				if(element == this.botones[i]){
					this.tagMake(i);
					this.fadeElement(this.images[this.currentimage],false);
					this.images[this.currentimage].style.zIndex = this.currentimage;
					this.fadeElement(this.images[i],true);
					this.images[i].style.zIndex = this.images.length + 1;
					this.swithImage(i);
				}
			}
		}
	}
}