// 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);

				}

			}

		}

	}

}