
function showGalleryImage(index) {
	var photos = $$('.viewport');
	var thumbs = $$('.thumb img');
	
	if(index >= photos.length || index >= thumbs.length) {
		if(window.console) console.warn("index too high: %d", index);
		return;
	}
	
	photos.each(function(photo) {
		photo.hide();
	});
	thumbs.each(function(thumb) {
		thumb.removeClassName("active");
	});
	
	photos[index].show();
	thumbs[index].addClassName("active");
}

var fullGalleryInfo = null;

function createGallery(galleryHashParameters) {
	fullGalleryInfo = $H({
		thumbWidth: "86px",
		thumbHeight: "60px",
		width: "440px", // pass a value like "440px"
		height: "307px", // pass a value like "307px"
		images: [],
		thumbs: null
	});
	fullGalleryInfo.update(galleryHashParameters);
	
	var divGallery = $("divGallery");
	var divThumbs = $("divThumbs");
	
	if(fullGalleryInfo.get("thumbs") == null)
		fullGalleryInfo.set("thumbs", fullGalleryInfo.get("images"))
	if(window.console && fullGalleryInfo.get("images").length != fullGalleryInfo.get("thumbs").length)
		console.warn("Image count does not match thumb count");
	
	if(fullGalleryInfo.get("images").length == null)
		return;
	
	$A(fullGalleryInfo.get("images")).each(function(image) {
		imageElement = document.createElement('img');
		imageElement.alt = '';
		imageElement.src = image;
		if(fullGalleryInfo.get("width")) imageElement.style.width = fullGalleryInfo.get("width");
		if(fullGalleryInfo.get("height")) imageElement.style.height = fullGalleryInfo.get("height");
		
		divElement = $(document.createElement('div'));
		divElement.addClassName("viewport");
		divElement.appendChild(imageElement);
		divGallery.insertBefore(divElement, divThumbs);
	});
	
	var index = 0;
	
	if(fullGalleryInfo.get("thumbs").length > 1) {
		$A(fullGalleryInfo.get("thumbs")).each(function(image) {
			imageElement = document.createElement('img');
			imageElement.alt = '';
			imageElement.src = image;
			if(fullGalleryInfo.get("thumbWidth")) imageElement.style.width = fullGalleryInfo.get("thumbWidth");
			if(fullGalleryInfo.get("thumbHeight")) imageElement.style.height = fullGalleryInfo.get("thumbHeight");
			
			divElement = $(document.createElement('div'));
			divElement.addClassName("thumb");
			divElement.appendChild(imageElement);
			divThumbs.appendChild(divElement);
			
			Event.observe(divElement, 'click', function(j) {
				return function() {
					showGalleryImage(j);
				};
			}(index));
			
			index += 1;
		});
	}
}
