function getElement(id){
	return (document.getElementById ? document.getElementById(id) : document.all[id]);
}

function popup(){
	img = images[this.imgNum];

	/* If w already exists (hasn't closed), then img2 will get set */
	try{
		/* img2 = image currently loaded in popup (or nothing thus throwing an error */
		var img2 = w.getElement('picture').childNodes[0];
		/* resizeBy more reliable than resizeTo provided they don't personally resize the window */
		w.resizeBy(img.width - img2.width, 0);
		setImg();
	/* Window doesn't exists, so make one */
	}catch(e){
		/* IE doesn't respect <base> */
		var url = ((navigator.appName == 'Microsoft Internet Explorer') ? '..' : '.') + '/popup.html';
		/* IE forces the side scrollbar, and so creates a bottom scrollbar (which does disappear given enough width) */
		var width = ((navigator.appName == 'Microsoft Internet Explorer') ? 20 : 0) + img.width;

		w = window.open(url, 'thumbView', 'height='+WIN_HEIGHT+',width='+width+',resizable=yes,scrollbars=yes');
	}

	currentImage = this.imgNum;
	w.focus();
}

/****
 * Inserts the image into the popup window.
 * Needed because FF won't define 'picture' until the onLoad event is called
 ****/
function setImg(){
	w.getElement('picture').innerHTML = '<img src="'+img.src+'" alt="">';
}

var w,
	WIN_HEIGHT = 750;

var img = new Image,
	images = new Array(),
	imgTotal = 1,
	currentImage = 1;
window.onload = function (){
		var thumbs = document.getElementsByTagName('IMG');
		var image;

		for(var x=0; x < thumbs.length; x++){
			if(thumbs[x].className != 'thumbnail'){
				continue;	
			}

			image = thumbs[x];

			image.onclick = popup;
			image.parentNode.onclick = function (){ return false; }
			/* Define a custom attribute to keep track of where we are in the gallery */
			image.imgNum = imgTotal;
			
			images[imgTotal] = new Image;
			images[imgTotal].src = image.src.replace(/\/([0-9]+)sm\.jpg/, '/$1.jpg');

			imgTotal++;
		}
	}