function Gallery(images, config)
{
	this.page = 1;
	this.images = images;
	this.perPage = 6;
	this.config = config;
	this.init = function(config, data)
	{
		if(config!=null)
			this.setConfig(config);
		this.images = (data)?data:this.images;
		this.container = $(this.config.c);
		this.populate();
		initLightbox();
	};
	this.setConfig = function(ov)
	{
		for(key in ov)
		{
			this.config[key] = ov[key];
		}
	};
	this.populate = function()
	{			
		var img = null; var c = null;
		var si = (6*(this.page-1));
		var str = (this.config.h_bg)?this.createHeader():"<div class=\"pager\"></div>";
		str += "<div id=\"images\">";
		for(var i=si; i<(((si+this.perPage)>this.images.length)?this.images.length:(si+this.perPage)); i++)
		{
			img = this.images[i];
			img.dimensions = this.resizeImage(img.dimensions);
			c = ((i%2)==0)?"gi left":"gi";
			mt = (Math.round(227/2))-((img.dimensions[1]+20)/2);
			str +=this.buildTile(img, c, mt);
		}
		str += "</div>";
		this.container.innerHTML = str;
	};
	this.buildTile = function(img, c, mt)
	{
		return "<div class=\""+c+"\"><div style=\"width:"+(img.dimensions[0]+20)+"px; height:"+(img.dimensions[1]+20)+"px;margin-top:"+mt+"px;\"><a href=\""+img.src+"\" rel=\"lightbox[Gallery]\" title=\""+img.title+"\"><img alt=\""+img.title+"\" src=\""+img.thumb+"\" width=\""+img.dimensions[0]+"\" height=\""+img.dimensions[1]+"\" /></a></div><div class=\"title\"><div style=\"float:left; width:85%; height:17px; line-height:1.5em; border:none; font-size:1em;\">"+img.title+"</div><div style=\"width:15%; border:none; float:right; height:17px; overflow:hidden;\"><a href=\""+img.src+"\" rel=\"lightbox[Gallery]\" title=\""+img.title+"\"><img src=\"resources/images/mag.gif\" style=\"border:none;\" /></a></div></div></div>";
	};
	this.goToPage = function(p)
	{
		/* clear off all class info */
		var ps = $("pages").getElementsByTagName("a");
		for(var i=0; i<ps.length; i++)
			ps[i].className = "";
		
		/* kill current images and show the images for the page selected */
		var imgs = $("images");
		imgs.style.visibility = "hidden";
		this.page = p;
		imgs.innerHTML = this.populate();
		imgs.style.visibility = "visible";		
		initLightbox();
	};
	this.createHeader = function()
	{
		var c = null;
		var str = "<div class=\"pager\" style=\"background:url("+this.config.h_bg+") repeat-x;\">";
		str += "<div id=\"pages\" style=\"height:20px; float:left; width:15%; text-align:left;\">";
		for(var i=0; i<(this.images.length/this.perPage); i++)
		{
			c = ((i+1)==this.page)?"class=\"selected\" ":"";
			str += (i != (Math.round(this.images.length/this.perPage)))?"<a id=\"p"+(i+1)+"\" "+c+"href=\"javascript:gallery.goToPage("+(i+1)+");\">"+(i+1)+"</a> | ":"<a id=\"p"+(i+1)+"\" "+c+"href=\"javascript:gallery.goToPage("+(i+1)+");\">"+(i+1)+"</a>";
		}
		str += "</div>";
		str += "<div style=\"width:70%; float:left; text-align:center;\" id=\"pageId\">Page "+this.page+" of "+Math.ceil(this.images.length/this.perPage)+"</div>";
		str += "<div style=\"float:left; text-align:right; width:15%;\" id=\"vOpt\"><a href=\"javascript:gallery.showAll();\">Show all</a></div></div>";
		return str;
	};
	this.showAll = function()
	{
		$("pages").innerHTML = "";
		$("pageId").innerHTML = "Page 1 of 1";
		$("vOpt").innerHTML = "<a href=\"javascript:gallery.init();\">Show pages</a>";
		
		var str = ""; var img; var c; var mt;
		for(var i=0; i<this.images.length; i++)
		{
			img = this.images[i];
			//img.dimensions = this.resizeImage(img.dimensions);
			c = ((i%2)==0)?"gi left":"gi";
			mt = (Math.round(227/2))-((img.dimensions[1]+20)/2);
			str +=this.buildTile(img, c, mt);
		}
		$("images").innerHTML = str;
		initLightbox();
	};
	this.resizeImage = function(dim)
	{
		var mw = 190; var mh = 190;
		var w = dim[0]; var h = dim[1];
		var nw; var nh;	
		if(w > h)
		{
			nw = mw;
			nh = h*(mw/w);
		}
		else if(h > w)
		{
			nh = mh;
			nw = w*(mh/h);
		}
		return [nw, nh];
	};
}
var gallery = new Gallery(imgs, {c:"gallery"});
