// class for individual slides
function MasTiempoItem( url , imgUrl , titulo , resumen, credito ){
	this.url = url;
	this.imgUrl = imgUrl;
	this.titulo = unescape(titulo);
	this.resumen = unescape(resumen);
	this.credito = unescape(credito);
	this.parentBrowser = null;
}						
							
// class for the slide player 
function MasTiempoBrowser( elementId, ArrowsIdUp, displayItemsCount , scrollItemsCount, imgSrc ){
	this.elementId = elementId;						// div contenedor de los divs que se desplazan
	this.ArrowsIdUp = ArrowsIdUp;					// div contenedor de las flechas de navegacion
	this.displayItemsCount = displayItemsCount;		// total number of items to be displayed at one time
	this.scrollItemsCount = scrollItemsCount;		// how many items to scroll by when clicking next or previous
	this.itemArray = new Array();					// arreglo de items
	this.itemIndex = 0;								// index del item actual mostrado en el extremo izquierdo
	this.imgSrc = imgSrc;							// direccion de las imagenes fijas (flechas)
	this.leftImgOff = this.imgSrc + "flecha_izq.gif";
	this.leftImgOn = this.imgSrc + "flecha_izq.gif";
	this.rightImgOff = this.imgSrc + "flecha_der.gif";
	this.rightImgOn = this.imgSrc + "flecha_der.gif";
	this.altoImagen = 230; 							// alto y ancho de la imagen que se muestra en las notas
	this.anchoImagen = 300;
	// self-register
	//this = window.MasTiempoBrowserInstance;
}


MasTiempoBrowser.prototype.showButtons = function(){
	if (document.createElement){
		//begin left arrow
		MOTHArrowsUp = document.getElementById(this.ArrowsIdUp);	
		
		//create image
		isOff = (this.itemIndex == 0);
		MOTHleftArrowImgUp = document.createElement("IMG");
		state = (isOff) ? this.leftImgOff : this.leftImgOn;
		MOTHleftArrowImgUp.setAttribute("src", state );
		MOTHleftArrowImgUp.setAttribute("name", "moth_reverse"); 				
				
		//create anchor
		if (!isOff){
			MOTHleftArrowAnchorUp = document.createElement( "A" );
			MOTHleftArrowAnchorUp.setAttribute("href", "javascript:brTiempo.update(0)");
			MOTHleftArrowAnchorUp.appendChild(MOTHleftArrowImgUp);						
			
			MOTHleftArrowImgUp.className="";
			MOTHArrowsUp.appendChild(MOTHleftArrowAnchorUp);
		} else {
			MOTHleftArrowImgUp.className="flecha_disable";
			MOTHArrowsUp.appendChild(MOTHleftArrowImgUp);
		}
		//end left arrow

		//begin right arrow
		//create image
		isOff = ((this.itemIndex + this.displayItemsCount) >= this.itemArray.length);
		MOTHrightArrowImgUp = document.createElement("IMG");
		state = (isOff) ? this.rightImgOff : this.rightImgOn;
		MOTHrightArrowImgUp.setAttribute("src", state );
		MOTHrightArrowImgUp.setAttribute("name", "moth_forward"); 
				
		 
		//create anchor
		if (!isOff){	
			MOTHrightArrowAnchorUp = document.createElement("A");
			MOTHrightArrowAnchorUp.setAttribute("href" , "javascript:brTiempo.update(1)");
			MOTHrightArrowAnchorUp.appendChild(MOTHrightArrowImgUp);
			
			MOTHrightArrowImgUp.className="";
			MOTHArrowsUp.appendChild(MOTHrightArrowAnchorUp);			
		} else {
		    MOTHrightArrowImgUp.className="flecha_disable";
			MOTHArrowsUp.appendChild(MOTHrightArrowImgUp);
		}	
		//end right arrow
	}
}


MasTiempoItem.prototype.write = function( esUltimo ){
	if( document.createElement ){
		var parentElement = document.getElementById( this.parentBrowser.elementId );
		
		// se crea el div que contiene toda la información de la foto
		var newObj = document.createElement( "div" );		
		newObj.className="hc_modcambiante";

		//Se pinta la imagen
		var foto = document.createElement( "div" );
		foto.id = "fotomodcambiante";
		foto.className="hc_fotomodcambiante";
		img = document.createElement("img");
		img.setAttribute("src", this.imgUrl);
		img.setAttribute("alt", this.titulo);
		img.setAttribute("class", "fotonoti");
		img.setAttribute("width", this.parentBrowser.anchoImagen); //definido en la declaracion de la clase 
		img.setAttribute("height", this.parentBrowser.altoImagen); //definido en la declaracion de la clase 
		foto.appendChild(img);
				
		//Uno el div de fotos al modulo de imagen
		var divfranjaflechas = document.createElement("div");
		divfranjaflechas.className = "hc_flechascambiantes";
		divfranjaflechas.id = "franjaflechas";
		
		//Lo uno al modulo de la foto
		foto.appendChild(divfranjaflechas);
		
		
		//Uno la foto al objeto global
		newObj.appendChild(foto);
		
		//Pinto contenedor del contenido
		var contenido = document.createElement("div");
		contenido.className = "hc_infomodcambiante";

		//Pinto contenedor del titulo y la descripcion
		contitdes = document.createElement("div");
		contitdes.className = "hc_infonoticia";
                
		//Pinto el titulo
		var tit = document.createElement("h5");
		
		//Imprimo enlace
		if(this.url != "")
		{		  
		  var ahref = document.createElement("a");
		  ahref.setAttribute("href", this.url);
		  ahref.appendChild( document.createTextNode( this.titulo ) )
		  tit.appendChild(ahref);		
		}
		else
		{
		  tit.appendChild( document.createTextNode( this.titulo ) )
		}

		//Uno el titulo al contenedor del contenido
		contitdes.appendChild(tit);

		//Pinto la descripcion
		var resumen = document.createElement("p");
		resumen.appendChild( document.createTextNode( this.resumen ) );
		contitdes.appendChild(resumen);

		//Cierro contenedor del titulo y la descripcion	
		contenido.appendChild(contitdes);

		//Uno la descripcion al contenedor del contenido
		newObj.appendChild(contenido);

		//Pinto el contenedor del crédito
		var contcredito	= document.createElement("div");
		contcredito.className = "hc_credito";

		//Pinto el crédito
		var cred = document.createElement("p");
		cred.setAttribute("class", "piedefoto");
		cred.appendChild( document.createTextNode( this.credito ) );

		//Cierro el contenedor del crédito
		contcredito.appendChild(cred);
						
		//Cierro contenedor del crédito	
		contenido.appendChild(contcredito);

		//Uno el credito al contenedor del contenido
		//newObj.appendChild(contcredito);
		newObj.appendChild(contenido);

		//Pinto el objeto
		parentElement.appendChild( newObj );			

    }			
}							
							
MasTiempoBrowser.prototype.addItem = function( item ){
	if( item instanceof MasTiempoItem ){
		item.parentBrowser = this;
		this.itemArray.push( item );
	}
}			
							
MasTiempoBrowser.prototype.update = function( doMoveRight ){
	divObj = document.getElementById( this.elementId );
	
	//increment index count
	var origIndex = this.itemIndex;
	this.itemIndex = (doMoveRight) ? this.itemIndex + this.scrollItemsCount : this.itemIndex - this.scrollItemsCount;
	
	//set upper and lower bounds
	this.upperBound = this.itemArray.length - this.displayItemsCount;
	this.itemIndex = ((this.itemIndex + this.displayItemsCount) > this.itemArray.length) ? this.itemArray.length-this.displayItemsCount : this.itemIndex;
	this.itemIndex = (this.itemIndex < 0) ? 0 : this.itemIndex;
		
	if (origIndex != this.itemIndex){
		//clear 
		this.deleteAllChildrenOf( this.getContentRow() );
		
		// re-populate
		for( iUpdate=this.itemIndex ; iUpdate < (this.itemIndex + this.displayItemsCount) ; iUpdate++ ){
			//Se mira si es el último elemento a mostrar para que el metodo 'write' de los estilos correspondientes al ultimo
			esUltimo = (iUpdate == (this.itemIndex + this.displayItemsCount -1)) ? true: false;
			this.itemArray[iUpdate].write(esUltimo);
			if(esUltimo){
				clear = document.createElement("div");
				clear.className = "clear";
				this.getContentRow().appendChild(clear);
			}
		}
	}
	//update button images
	this.deleteAllChildrenOf(document.getElementById(this.ArrowsIdUp));
	this.showButtons();
}

MasTiempoBrowser.prototype.cargar = function( ){
	//clear 
	this.deleteAllChildrenOf( this.getContentRow() );
	
	// re-populate
	for( iUpdate=this.itemIndex ; iUpdate < (this.itemIndex + this.displayItemsCount) ; iUpdate++ ){
		//Se mira si es el último elemento a mostrar para que el metodo 'write' de los estilos correspondientes al ultimo
		esUltimo = (iUpdate == (this.itemIndex + this.displayItemsCount -1)) ? true: false;
		this.itemArray[iUpdate].write(esUltimo);		
	}
	var clearcito = document.createElement("div");
	clearcito.className = "clear";
	this.getContentRow().appendChild(clearcito);
	
	//update button images
	this.deleteAllChildrenOf(document.getElementById(this.ArrowsIdUp));
	this.showButtons();
}
	
MasTiempoBrowser.prototype.getContentRow = function(){
	return document.getElementById( this.elementId );
}


MasTiempoBrowser.prototype.deleteAllChildrenOf = function( elementObj ){
	while (elementObj.hasChildNodes()) elementObj.removeChild(elementObj.firstChild);
}