/*
Modulo Imagen
	Utilizacion
	var obj = new Imagen( template.xml, datos.xml );
	obj.write('id');
	// Donde template.xml es el xml del template q sale de XMLPATH/imagen/
	// Donde datos.xml es el xml de los datos q sale de XMLPATH/
	// Donde 'id' es el id del elemento HTML donde se va a escribir el modulo.
	
	var obj = new Imagen( template.xml);
	obj.addItem('Ruta de la imagen', 'Texto de la imagen');
	obj.addItem('Ruta de la imagen 2', 'Texto de la imagen 2');
	...
	obj.addItem('Ruta de la imagen n', 'Texto de la imagen n');
	obj.write('id');
	
	// Aqui no se especifica un datos.xml, por lo tanto se debe especificar los datos.
*/

Imagen = Class.create();
Object.extend(Imagen.prototype, {
	dataArray: new Array(),
	dataXML: "",
	viewXML: "",
	viewDOM: "",
	ObjImg: "",
	ObjTexto: "",
	cActual: "",
	btPlay: "",
	cnt: 0,
	work: false,
	timer: null,
	
	//Data es opcional ya que puede ser cargado directamente.
	initialize: function(view, data){
		this.setviewXML(view);
		if (data)
			this.setDataXML(data);
		
		//LOAD Template
		var me = this;
		var rqD= new Requester("GET");
		me.work = true;
		rqD.request(this.getviewXML(), "", function(doc) {
			me.setTemplate($Rel(doc, "Imagen"));
			
			if (data){
				var rq = new Requester("GET");				
				rq.request(me.getDataXML(), "", function(d) {
					var img = new Array();
					var coll = d.getElementsByTagName("imagen");

					for(var i=0; i<coll.length;i++){
						var src = $Value(coll[i].getElementsByTagName("src")[0]);
						var texto = $Value(coll[i].getElementsByTagName("texto")[0]);

						me.addItem(src, texto);
					}
					
					me.setImages(img);
				});
			}
			me.work = false;
		});
	},
	
	write: function(id){
		if(!this.work){
			var O = this.getTemplate();
			var oI = $Rel(O, "Img");
				this.ObjImg = oI;
			var oTxt = $Rel(O, "Text");
				this.ObjTexto = oTxt;
			var cA = $Rel(O, "Actual");
				this.cActual = cA;
			var cT = $Rel(O, "Total");
			var bt_l = $Rel(O, "left");
			var bt_r = $Rel(O, "right");
			var bt_pl = $Rel(O, "Play");
				this.btPlay = bt_pl;
			var Pag = $Rel(O, "Pag");
			
			if(this.dataArray.length == 1){
				Pag.parentNode.removeChild(Pag);
			}
			else{
				var me= this;
				bt_l.onclick = function(){	me.prev();}
				bt_r.onclick = function(){	me.next();}
				bt_pl.onclick = function(){	me.play(); }
				cT.replaceChild(document.createTextNode(this.dataArray.length), cT.firstChild);
			}
			
			this.placeImg();
			$(id).appendChild(O);
			
		}else{
			var me = this;
			setTimeout(function() {me.write(id)}, 1000);
		}
	},

	addItem: function(src, texto){
		var item = new ImagenItem(src, texto);
		this.dataArray.push(item);
	},

	placeImg: function(){
		this.ObjImg.src = this.dataArray[this.cnt].getSrc();

		if(this.ObjTexto.firstChild)	this.ObjTexto.replaceChild(document.createTextNode(this.dataArray[this.cnt].getTexto()), this.ObjTexto.firstChild);
		else													this.ObjTexto.appendChild(document.createTextNode(this.dataArray[this.cnt].getTexto()));

		this.upCounter();
	},
	
	next: function(){
		if(this.cnt < (this.dataArray.length - 1))
			this.cnt++;
		else
			this.cnt = 0;
		this.placeImg();
	},

	prev: function(){
		if(this.cnt > 0)
			this.cnt--;
		else
			this.cnt = (this.dataArray.length - 1);
		this.placeImg();
	},
	
	play: function(){
		var me = this;
		this.timer = setInterval(function(){ me.next() }, 7000);
		this.btPlay.onclick = function(){	me.pause(); }
		this.btPlay.src = this.btPlay.src.toString().replace("play","pause");
	},
	
	pause: function(){
		clearInterval(this.timer);
		var me = this;
		this.btPlay.onclick = function(){	me.play(); }
		this.btPlay.src = this.btPlay.src.toString().replace("pause","play");
	},	
	
	upCounter: function(){
		this.cActual.replaceChild(document.createTextNode(this.cnt+1), this.cActual.firstChild);
	},
	// SETTERS
	
	setDataXML: function(sf){
		this.dataXML =	XMLPATH + "/" + sf;
	},

	setviewXML: function(sf){
		this.viewXML =	XMLPATH + "/imagen/" + sf;
	},
	
	setTemplate: function(xn){
		this.viewDOM = Element.importToDocument(xn, true);
	},
	
	setObjImg: function(o){
		this.ObjImg = o;
	},
	
	setText: function(s){
		this.ImageText = s;
	},

	// GETTERS

	getDataXML: function(){
		return this.dataXML;
	},

	getviewXML: function(){
		return this.viewXML;
	},

	getImages: function (){
		return this.dataArray;
	},

	getTemplate: function(){
		return this.viewDOM;
	},

	getText: function(){
		return this.ImageText;
	},
	
	getObjImg: function(){
		return this.ObjImg;
	}

});

ImagenItem = Class.create();
Object.extend(ImagenItem.prototype, {
	src: "",
	Texto: "",
	
	initialize: function(src, texto){
		this.setSrc(src);
		this.setTexto(texto);
	},

//Setters
	
	setSrc: function(src){
		this.src = src;
	},

	setTexto: function(Texto){
		this.Texto = Texto;
	},
	
//Getters

	getSrc: function(){
		return this.src;
	},

	getTexto: function(){
		return this.Texto;
	}
})