var GalleryBox = new function() {

	this.id = 'gallery_box';
	this.images = false;
	this.width = 0;
	this.scrollLeft = 0;
	this.contentWidth = 0;
	this.contentTableWidth = 0;
	this.timeout = 0;

	this.display = function (images) {
		this.images = images;
		html  = '<div id="' + this.id + '">';
		html += '<a id="' + this.id + '_left" href="javascript:GalleryBox.scroll(-200, 0);" onmouseover="GalleryBox.scroll(-10, 20);" onmouseout="GalleryBox.scroll(0, 0)"></a>';
		html += '<a id="' + this.id + '_right" href="javascript:GalleryBox.scroll(200, 0);" onmouseover="GalleryBox.scroll(10, 20);" onmouseout="GalleryBox.scroll(0, 0)"></a>';
		html += '<div id="' + this.id + '_content">';
		html += '<table cellpadding="0" cellspacing="0" id="' + this.id + '_content_table">';
		html += '<tr>';
		html += '<td><div style="width: 22px"></div></td>';
		for (i = 0; i < images.length; i++) {
			html += '<td><a href="' + images[i][0] + '" rel="lightbox" title="' + images[i][2] + '"><img src="' + images[i][1] + '" alt="" /></a></td>';
		}
		html += '<td><div style="width: 22px"></div></td>';
		html += '</tr>';
		html += '</table>';
		html += '</div>';
		html += '</div>';
		document.write(html);
		Event.observe(window, 'load', this.onLoad);
	}

	this.onLoad = function () {
		GalleryBox.width = $(GalleryBox.id).getWidth();
		rw = $(GalleryBox.id + '_right').getWidth();
		$(GalleryBox.id + '_right').style.margin = '0 0 0 '  + (GalleryBox.width - rw) + 'px';
		$(GalleryBox.id + '_content').style.width = GalleryBox.width + 'px';	
		GalleryBox.scrollLeft = $(GalleryBox.id + '_content').scrollLeft;
		GalleryBox.contentWidth = $(GalleryBox.id + '_content').getDimensions().width;
		GalleryBox.contentTableWidth = $(GalleryBox.id + '_content_table').getDimensions().width;
		GalleryBox.timeout = 0;
	}

	this.scroll = function (dir, timeout) {
		this.scrollLeft += dir;
		if (this.scrollLeft < 0) {
			this.scrollLeft = 0;
		}
		if (this.scrollLeft > this.contentTableWidth - this.contentWidth) {
			this.scrollLeft = this.contentTableWidth - this.contentWidth;
			if (this.scrollLeft < 0) {
				this.scrollLeft = 0;
			}
		}
		$(this.id + '_content').scrollLeft = this.scrollLeft;
		if (timeout != undefined) {
			this.timeout = timeout;
		}
		if (this.timeout) {
			setTimeout('GalleryBox.scroll(' + dir + ')', this.timeout);
		}
	}
	
}
