/*
GALLERY MAKER
Crea galería de fotos a partir de imagenes en documento
Dependencias:
- prototype.js (http://prototype.conio.net)
- scriptaculous (http://script.aculo.us)
@2006 Aardvark (http://aardvark.cl) para i2b (http://www.i2b.cl)
-------------------------------------------------------------------*/
/* Namespace */
var FV = FV || {};
/* Clase */
FV.GaleriaInit = function(){
	var _top = window.attachEvent?-50:0;//correcion para IE
	var f = new FV.FloatBox("floatbox",{top:_top});
	new FV.GalleryMaker("thumbs","detail",{
		loading:"<span id='loader'><img src='/img/lightbox/ajax-loader-mini.gif' /></span>",
		loading_top:120,
		loading_left:225,
		caption:"caption",
		arrow_class:"arrow"
	});
};
FV.GalleryMaker = Class.create();
Object.extend(Object.extend(FV.GalleryMaker.prototype,Enumerable),
	{
		initialize:function(thumbs_container,target){
			try{
			this.target 		= $(target);
			this.thumbs 		= $A($(thumbs_container).getElementsByTagName("img"));
			var opts			= arguments[2] 		|| {};
			this.loadicon		= opts.loading		|| "<span id='loading'>Cargando...</span>";
			this.loading_top	= opts.loading_top	|| 100;
			this.loading_left	= opts.loading_left	|| 100;
			this.fade_speed		= opts.fade_speed	|| .2;
			this.thumb_prefix	= opts.thumb_prefix	|| "thumb";
			this.detail_prefix	= opts.detail_prefix|| "medium";
			this.img_class		= opts.img_class	|| "detail-img";
			this.hover_class	= opts.hover_class	|| "hover";
			this.arrow_class	= opts.arrow_class	|| false;
			this.caption		= opts.caption		|| false;
			this.display_first	= opts.display_first|| 1;
			this.current_thumb_class=opts.current_thumb_class||"current";
			this.current		= false;
			this.prepare();
			this.preparePics();
			this.display(this.display_first-1);
			if(this.arrow_class)this.setPager();
			}catch(e){alert(e)}
		},
		prepare:function(){
			this.loading = document.createElement("div");
			this.loading.innerHTML = this.loadicon;
			this.target.appendChild(this.loading);
			this.loading.style.position = "absolute";
			this.loading.style.top = this.loading_top+"px";
			this.loading.style.left = this.loading_left+"px";	
			this.target.style.position="relative";
			$(this.loading).hide();	
		},
		preparePics:function(){
			this.pics = this.collect(
				function(thumb,index){
					var pic = new Image();
					pic.src = thumb.src.replace( this.thumb_prefix, this.detail_prefix );
					thumb.style.cursor = "pointer";
					thumb.index = index;
					$(pic).addClassName(this.img_class);	
					pic.alt = thumb.alt || "";	
					Event.observe(thumb,"click",function(){this.display(index)}.bind(this));	
					Event.observe(thumb,"mouseover",function(ev){ Element.addClassName(Event.element(ev),this.hover_class) }.bind(this));
					Event.observe(thumb,"mouseout",function(ev){ Element.removeClassName(Event.element(ev),this.hover_class) }.bind(this));
					return pic;
				}.bind(this)
			);
		},
		display:function(index){
			if(this.current==this.pics[index])return false;
			if(this.current){
				//this.target.style.backgroundImage = "url("+this.current.src+")";
				Element.remove(this.current);
				Element.removeClassName(this.current_thumb,this.current_thumb_class);
			}
			this.current_index = index;
			this.current_thumb = $(this.thumbs[index]);
			Element.addClassName(this.current_thumb,this.current_thumb_class);
			$(this.loading).show();
			this.target.appendChild(this.pics[index]);
			this.current = $(this.pics[index]);
			$(this.current).hide();
			if(this.caption)
				$(this.caption).innerHTML = this.pics[index].alt;
			new Effect.Appear(this.current,{duration:this.fade_speed,afterFinish:function(){$(this.loading).hide();}.bind(this)});	
		},
		setPager:function(){
			var flechas = $$("."+this.arrow_class);
			flechas.each(function(el){el.href="javascript:void(0)"});
			Event.observe(flechas[0], "click",function(ev){return this.pager(ev,-1);}.bind(this));
			Event.observe(flechas[1], "click", function(ev){return this.pager(ev,1)}.bind(this));
		},
		pager:function(ev,num){
			var idx = this.current_index+num;
			if(!this.thumbs[idx]){
				idx = num>0?0:this.thumbs.length-1;
			}
			this.display(idx);return false;
		},
		_each:function(iterator){
			this.thumbs.each(iterator);
		}
	}
);
