$.extend(rmp, {
	Gallery:function(name, images){
		var $t = this;
		var page = null;
		var display = null;
		var image = null;
		var controls = null;
		var thumbs = null;
		var thumb_images = null;
		var global = {id:'gallery_' + name};
		var html = $.render(
			['<div id="display"><img src="" /></div><div id="controls"><div id="prev">&lsaquo;</div><div class="thumbs"><ul id="thumbs">',[global]],
			['<li><img src="{src}" /></li>', images],
			['</ul></div><div id="next">&rsaquo;</div></div>',[global]]
		);
		function img_load() {
			display.width(display.height()*images[$t.current].aspect);
			image.center(display, images[$t.current].aspect, true);
			/*display.animate(
				{width:display.height()*images[$t.current].aspect}, 
				{
					speed:250,
					complete:function(){
						image.center(display, images[$t.current].aspect, true);
				}
			});*/
			
			var c = thumbs.find('li').eq($t.current);
			c.addClass('selected');
			var p = thumbs.parent();
			var sl = p.scrollLeft() + c.offset().left - p.offset().left;
			sl -= p.outerWidth(true)/2 - c.outerWidth()/2;
			//p.animate({scrollLeft:sl}, 500);
			p.scrollLeft(sl);
		}
		function size(noimage) {
			var h = page.height();
			h -= thumbs.outerHeight(true);
			h -= (display.outerHeight(true) - display.height());
			display.height(h);
			display.width(h*images[$t.current].aspect - 1);
			image.center(display, images[$t.current].aspect, true);
		}
		function bind() {
			page.resize(size);
			$('#next').click($t.next);
			$('#prev').click($t.prev);
			image.hide();
			image.load(img_load);
			display.width(display.height()*images[0].aspect);
			thumb_images.click(function(){
				$t.go(thumb_images.index(this));
			});
			thumb_images.hide();
			thumb_images.hover(
				function() {$(this).parent().addClass('hover');},
				function() {$(this).parent().removeClass('hover');
			});
			thumb_images.load(function(){
				$(this).center($(this).parent(), images[thumb_images.index(this)].aspect, true);
				$(this).show();
				$(this).unbind('load');
			});
		}
		$.extend(this,{
			current:-1,
			length:images.length,
			render:function (container) {
				page = container;
				page.html(html);
				display=$('#display');
				controls=$('#controls');
				image = display.find('img');
				thumbs=$('#thumbs');
				thumb_images=thumbs.find('img');
				bind();
				$t.go(0, true);
			},
			next:function(){
				$t.go(($t.current+1) % $t.length);
			},
			prev:function(){
				$t.go(($t.current+$t.length-1) % $t.length);
			},
			go:function (i, init) {
				if($t.current == i) return;
				thumbs.find('li').eq($t.current).removeClass('selected');
				$t.current = i;
				if(init) size();
				display.stop(true, true);
				image.stop(true,true);
				image.hide();
				image.attr('src',images[$t.current].src);
/*				image.fadeOut(250, function(){
					image.attr('src',images[$t.current].src);
				});*/
				
			}
		});
	}
	
});

$(function(){
	rmp.initGallery();
});