(function($j){

	window["Gallery"] = (function(){
				  
			function Gallery(opts){
				var I = this;
				I.opts=opts;
				
				$j.extend(I.thumbSize, opts.thumbSize);
				$j.extend(I.imageSize, opts.imageSize);
				$j.extend(I, opts);
				
				if(I.thumbnails!=null && I.image!=null) I.init();
			}
			
			Gallery.prototype={
				className:"Gallery",
				opts:null,
				thumbnails:null, //jQuery selector for thumbnail image containers - e.g $j("div.gallery-thumbnails li")
				thumbSize:{height:75, width:75},
				_image:null,
				image:null, //jQuery selector for large image container - e.g $j("div.gallery-image img")
				imageSize:{height:300, width:300},
				init:function(){
					var I = this;
					
					if(typeof(I.thumbnails.jquery)!="string") I.thumbnails = $j(I.thumbnails);
					if(typeof(I.image.jquery)!="string") I.image = $j(I.image);
					
					I.doThumbnails();					
					I.showImage(1);
				},
				doThumbnails:function(){
					var I = this;
					I.thumbnails.css({display:"none"});
					var onThumbLoad=function(evt){
						setTimeout(function(){
							var thumb = evt.target;
							$j(thumb).css({display:""});
							var newSize = ratioResize(thumb.height, thumb.width, I.thumbSize);
							thumb.height=newSize.height;
							thumb.width=newSize.width;	
						}, 50)
					}
					
					I.thumbnails.each(function(i, t){
						var thumb = $j(t);
						
						thumb.load(onThumbLoad);
						
						thumb.click(function(evt){
							I.showImage(i);		
						});
						
						if(thumb[0].complete){
							
								thumb.trigger("load");
							
						}				   
											   
					});
				
					
					
				},
				showImage:function(itemIdx){
					var I = this;
					var thumb = $j(I.thumbnails[itemIdx]);
					
					if(I._image!=null) $j(I._image).unbind("load");
					
					I._image = new Image();
					I._image.src = thumb.attr("src");
					
					var onImageLoad=function(evt){
						
						var newSize = ratioResize(I._image.height, I._image.width, I.imageSize);
						I.image[0].src=I._image.src;
						//trace(newImage.src);
						
						I.image[0].width=newSize.width;
						I.image[0].height=newSize.height;
						
						I.image.fadeIn(500);
						
					}
						
					I.image.fadeOut(200, function(){
						//I.image.attr("src", );	

						$j(I._image).load(onImageLoad);
						
						if(I._image.complete){
							$j(I._image).trigger("load");	
						}
									  
					});
									
				}
				
			};
			
			function ratioResize(height, width, constraint){
					var newSize = {height:height, width:width};				
					if(constraint.height==0) constraint.height=10000;
					if(constraint.width==0) constraint.width=10000;
					
					if(constraint.width && width > constraint.width){				
						newSize.width = constraint.width;
						newSize.height = height * (constraint.width/width);
					}else if(constraint.height && height > constraint.height){
						newSize.height = constraint.height;
						newSize.width = width * (constraint.height/height);
					}
					if(newSize.height > constraint.height || newSize.width > constraint.width) newSize = ratioResize(newSize.height, newSize.width, constraint);
					
					return newSize;
				
				
			}
			
			
			return Gallery;
			
	})();

})(jQuery);