var Banner = new Class({
		/**
		 * 
		 * @param {Object} path
		 * String path del joomla
		 * @param {Object} images
		 * String images separadas por ","
		 */
        initialize: function(path, images){
				this.debug			=	true;
				this.maxLoad		=	3;
				this.timer			=	0;
				this.loadedImages	=	[];
				this.gallery		=	$('gallery');
				this.progress		=	$('progress');
				this.start			=	$('start');
				this.busy			=	false;
				this.debug			=	false;
				this.noprogress		=	false;
												
				this.path			=	path;
				this.images			=	[];
				this.loaders		=	[];
				this.galleryImage	=	[];
				this.addImages(images);
				this.setInitialStyles();
				$('start').addEvent('click',this.render.bind(this));				
				this.render();
        },
		addImages:function(images){
			var arImg	=	images.split(",");
			for(i=0;i<arImg.length;i++){
				this.images[i]	=	this.path + arImg[i];
			}
		},
		setInitialStyles:function(){
			this.gallery.setStyles({
				'opacity': 0,
				'display': 'none'
			});
			this.progress.setStyle('visibility', 'hidden');
			this.start.setStyle('visibility', 'hidden');
		},
		getRandom:function(superior){
			var numPosibilidades = superior - 0;
			var aleat = Math.random() * numPosibilidades;
			aleat = Math.round(aleat);
			return parseInt(0) + aleat;
		},
		setrandomImg:function(){
			this.loaders	=	[];
			for(i=0;i<this.maxLoad;i++){
				this.loaders[i]=this.images[this.getRandom(this.images.length-1)];
			}
			if(window.console && this.debug)	console.warn("Set random image: %o",this.loaders);			
		},
		removeGallery:function(){
			//var galleryImgs = $$('#gallery img');
			var galleryImgs = $ES('img','gallery');
			if(window.console  && this.debug)	console.warn("Image removing: object --> %o",galleryImgs);
			if (galleryImgs.length > 0) {
				/*
				galleryImgs.each(function(image){
					image.remove();
				});
				*/
				for(i=0;i<galleryImgs.length;i++){
					galleryImgs[i].remove();
				}
			}
			if(window.console  && this.debug)	console.warn("Image removed: %o",$ES('img','gallery'));
		},
		onprogress:function(){
			this.loaders.each(function(source,i){
					var image = new Element('img', {'src': source});
					image.setStyles({
						'position': 'absolute',
						'opacity': 0,
						//'left': ($('gallery').getCoordinates().width / 2) - (image.width / 2) - 2,
						//'top': ($('gallery').getCoordinates().height / 2) - (image.height / 2) - 7
						left:0,
						top:-5
					});
					$('gallery').adopt(image);
					if (window.console && this.debug) 
						console.info("Image injection:  nº %d, object: %o", i, image);
				}.bind(this));
		},
		oncomplet:function(){
			$('progress').setStyle('visibility', 'hidden');
			var galleryImgs = $$('#gallery img');
			//var galleryImgs = $ES('img','gallery');
			var fx = $('gallery').effect('opacity').start(1);
			if(window.console  && this.debug)	console.warn("Image captured with $$('#gallery img'): object --> %o",galleryImgs);
			galleryImgs.each(function(image, i){
			//for(i=0;i<galleryImgs.length;i++){
				if(window.console  && this.debug)	console.info("Image processing:  nº %d, object: %o",i,image);
				var imgEffect = image.effect('opacity', {duration: 1500});
				fx = function(){
					imgEffect.start(1).chain(function(){
						if (i < this.maxLoad - 1) {
							imgEffect.start(0).chain(function(){
								image.remove();
							});
						}
						else {
							this.busy = false;
							this.timer=0;
							if($('start')) 
								$('start').setStyle('visibility', 'visible');
						}
					}.bind(this));
				}.bind(this).delay(this.timer * 2);
				this.timer += 2500;
			}.bind(this));
			//}
			if(window.console  && this.debug)	console.warn("Oncomplete process ends");
		},
		render:function(ev){
			if (ev!=null)
				new Event(ev).stop();
			if(window.console  && this.debug)	console.info("Start rendering");			
			if (!this.busy) {
				this.removeGallery();
				this.start.setStyle('visibility', 'hidden');
				this.loaders	=	[];
				this.setrandomImg();
				this.busy = true;
				this.progress.setStyle('visibility', 'visible');
				this.gallery.setStyle('display', 'block');
				this.onprogress();
				this.oncomplet();
				/*
				var imgsLoaded = new Asset.images(this.loaders, {
					onProgress: function(i){
						//this.injectInside($('gallery'));
						$('gallery').adopt(this);
						this.setStyles({
							'position': 'absolute',
							'opacity': 0,
							'left': ($('gallery').getCoordinates().width / 2) - (this.width / 2) - 2,
							'top': ($('gallery').getCoordinates().height / 2) - (this.height / 2) - 7
						});
						if (window.console) 
							console.info("Image injection:  nº %d, object: %o", i, this);
						//var percent = ((i + 1) * progress.getStyle('width').toInt()) / loaders.length;
						//$E('#progress .bar').setStyle('width', percent).setHTML(i + 1 + ' / ' + loaders.length);
						//$('progress').setStyle('visibility', 'visible');
					},
					*/
					/*
					onComplete: function(){
						$('progress').setStyle('visibility', 'hidden');
						var galleryImgs = $$('#gallery img');
						//var galleryImgs = $ES('img','gallery');
						var fx = $('gallery').effect('opacity').start(1);
						if(window.console)	console.warn("Image captured with $$('#gallery img'): object --> %o",galleryImgs);
						galleryImgs.each(function(image, i){
						//for(i=0;i<galleryImgs.length;i++){
							if(window.console)	console.info("Image processing:  nº %d, object: %o",i,image);
							var imgEffect = image.effect('opacity', {duration: 1500});
							fx = function(){
								imgEffect.start(1).chain(function(){
									if (i < this.maxLoad - 1) {
										imgEffect.start(0).chain(function(){
											image.remove();
										});
									}
									else {
										this.busy = false;
										this.timer=0;
										$('start').setStyle('visibility', 'visible');
									}
								}.bind(this));
							}.bind(this).delay(this.timer * 2);
							this.timer += 2500;
						}.bind(this));
						//}
						this.busy = false;
						this.removeGallery();
						$('start').setStyle('visibility', 'visible');
						if(window.console)	console.warn("Oncomplete process ends");
					}.bind(this)
				});
				*/
			}
		}
})