var GalImages = Class.create();

GalImages.prototype =
{
	initialize: function(placeHolder, imageBlocks, thumbnails)
	{
		this.placeHolder = placeHolder;
		this.imageBlocks = imageBlocks;
		this.thumbnails = thumbnails;
		this.currentNum = 0;
		
		for (var i = 0; i < this.thumbnails.length; i++) {
			Event.observe(this.thumbnails[i], 'mouseover', this.showImage.bind(this, i));
		}
		Event.observe(this.placeHolder, 'click', this.showImage.bind(this, null));
		this.placeHolder.style.cursor = 'pointer';
		this.showImage(0);
	},
	
	showImage: function(num)
	{
		if (num == undefined) {
			num = this.currentNum + 1;
		}
		if (this.imageBlocks.length <= num) {
			num = 0;
		}
	
		this.placeHolder.innerHTML = this.imageBlocks[num].innerHTML;
		
		for (var i = 0; i < this.thumbnails.length; i++) {
			if (i == num) {
				if (!Element.hasClassName(this.thumbnails[i], 'thumbnail_active')) {
					Element.classNames(this.thumbnails[i]).set('thumbnail_active');
				}
			}
			else if (!Element.hasClassName(this.thumbnails[i], 'thumbnail')) {
				Element.classNames(this.thumbnails[i]).set('thumbnail');
			}
		}
		
		this.currentNum = num;
	}
}