var gallery = {
	additionalHeight: 24,
	additionalWidth: 48,
	images: new Array,
	isBlackout: false,
	
	initGallery: function() {
		var links = document.getElementsByTagName('a');
		var index = 0;
		
		for (var i=0; i<links.length; i++) {
			var a = links[i];
			
			if (a.className.indexOf('galleryimage') === 0) {
				var sizes = a.className.substr(12).split('x');
				
				if (sizes.length == 2) {
					this.images[index] = {
						url: a.href,
						width: sizes[0],
						height: sizes[1]
					};
					
					a.index = index;
					a.onmousedown = this.imagePreload;
					a.onmouseup = this.showPreloadedImage;
					a.onclick = function () { return false; };
					
					index++;
				}
			}
		}
		
		this.closeImage = document.createElement('img');
		this.closeImage.className = 'gallery-close';
		this.closeImage.src = '/www/gfx/gallery-close.png';
		this.closeImage.hoverImg = new Image;
		this.closeImage.hoverImg.src = '/www/gfx/gallery-close-hover.png';
		this.closeImage.onmouseover = this.hoverImg;
		this.closeImage.onmouseout = this.unHoverImg;
		this.closeImage.onclick = this.close;

		this.leftImage = document.createElement('img');
		this.leftImage.className = 'gallery-left';
		this.leftImage.src = '/www/gfx/gallery-arrow-left.png';
		this.leftImage.hoverImg = new Image;
		this.leftImage.hoverImg.src = '/www/gfx/gallery-arrow-left-hover.png';
		this.leftImage.onmouseover = this.hoverImg;
		this.leftImage.onmouseout = this.unHoverImg;
		this.leftImage.onmousedown = this.previousImagePreload;
		this.leftImage.onmouseup = this.showPreloadedImage;

		this.rightImage = document.createElement('img');
		this.rightImage.className = 'gallery-right';
		this.rightImage.src = '/www/gfx/gallery-arrow-right.png';
		this.rightImage.hoverImg = new Image;
		this.rightImage.hoverImg.src = '/www/gfx/gallery-arrow-right-hover.png';
		this.rightImage.onmouseover = this.hoverImg;
		this.rightImage.onmouseout = this.unHoverImg;
		this.rightImage.onmousedown = this.nextImagePreload;
		this.rightImage.onmouseup = this.showPreloadedImage;
	},
	
	showGalleryImage: function(index, img) {
		var x, y, url;
		
		gallery.blackoutOn();
		
		gallery.elemForImg.style.width = img.width + 'px';
		gallery.elemForImg.style.height = img.height + 'px';
		
		window.onresize = gallery.verticalCenter;

		var prevImg = document.getElementById('gallery-image');
		if (prevImg) {
			prevImg.removeAttribute("src");
			prevImg.parentNode.removeChild(prevImg);
		}		
		
		gallery.elemForImg.appendChild(img);
		gallery.verticalCenter();
		img.onmousedown = this.nextImagePreload;
		img.onmouseup = this.showPreloadedImage;
		
		// navigation arrows
		gallery.leftImage.style.display = (index == 0) ? 'none' : '';
		gallery.rightImage.style.display = (index+1 >= gallery.images.length) ? 'none' : '';
		
		gallery.current = index;
	},
	
	blackoutOn: function() {
		if (document.getElementById('gallery-blackout-wrapper')) return;
		
		var div = document.createElement('div');
		div.id = 'gallery-blackout-wrapper';
		div.onclick = gallery.outsideClick;

		var div2 = document.createElement('div');
		div2.className = 'gallery-blackout';
		div.appendChild(div2);

		var div3 = document.createElement('div');
		div3.id = 'gallery-blackout-content';
		div.appendChild(div3);
		
		div3.appendChild(gallery.closeImage);
		div3.appendChild(gallery.leftImage);
		div3.appendChild(gallery.rightImage);
		
		gallery.elemForImg = div3;
		
		document.body.appendChild(div);
	},
	
	verticalCenter: function() {
		var img = document.getElementById('gallery-image');
		var origWidth = gallery.images[img.index].width;
		var origHeight = gallery.images[img.index].height;
		
		var sizes = gallery.adjustSizes(origWidth, origHeight);
		
		img.width = sizes[0];
		img.height = sizes[1];
		
		gallery.elemForImg.style.width = img.width + 'px';
		gallery.elemForImg.style.height = img.height + 'px';

		var vpHeight = document.documentElement.offsetHeight;
		
		var y = Math.round(vpHeight/2 - img.height/2);
		
		if (y<gallery.additionalHeight) y=gallery.additionalHeight;
		
		gallery.elemForImg.style.top = y + 'px';
	},
	
	createImg: function(index) {
		
		var sizes = gallery.adjustSizes(gallery.images[index].width, gallery.images[index].height);
				
		var img = document.createElement('img');
		img.id = 'gallery-image';
		img.src = gallery.images[index].url;
		img.width = sizes[0];
		img.height = sizes[1];
		img.index = index;

		return img;		
	},
	
	adjustSizes: function(width, height) {
		// shrink oversized image to viewport size
		width = parseInt(width);
		height = parseInt(height);
		
		var yRatio = 0, xRatio = 0, ratio;

		var vpHeight = document.documentElement.offsetHeight;
		var vpWidth = document.documentElement.offsetWidth;
		
		if (height + 5 > vpHeight - gallery.additionalHeight) {
			yRatio = (height + 5) / (vpHeight - gallery.additionalHeight);
		}

		if (width + 6 > vpWidth - gallery.additionalWidth) {
			xRatio = (width + 6) / (vpWidth - gallery.additionalWidth);
		}
		
		if (yRatio > xRatio) {
			ratio = yRatio;
		} else if (xRatio > yRatio) {
			ratio = xRatio;
		}
		
		if (ratio) {
			width = Math.round(width / ratio);
			height = Math.round(height / ratio);
		}
		
		return [width, height];		
	},
	
	close: function() {
		window.onresize = null;

		if (gallery.closeImage.originalSrc) {
			gallery.closeImage.src = gallery.closeImage.originalSrc;
		}

		var img = document.getElementById('gallery-image');
		if (img) {
			img.removeAttribute("src");
		}

		var div = document.getElementById('gallery-blackout-wrapper');
		if (div) {
			div.parentNode.removeChild(div);
		}
	},
	
	outsideClick: function(e) {
		if (!e) var e = window.event;
		var tg = (window.event) ? e.srcElement : e.target;
		
		if (tg.nodeName == 'DIV') {
			gallery.close();
		}
	},

	imagePreload: function(e) {
		if (!e) var e = window.event;
		if (!gallery.isLeftButton(e)) {
			return;
		}
		
		gallery.preloadedImage = gallery.createImg(this.index);
	},

	nextImagePreload: function() {
		if (gallery.current+1 >= gallery.images.length) {
			gallery.preloadedImage = null;
			return;
		}
		
		gallery.preloadedImage = gallery.createImg(gallery.current+1);
	},

	previousImagePreload: function() {
		if (gallery.current == 0) {
			gallery.preloadedImage = null;
			return;
		}
		
		gallery.preloadedImage = gallery.createImg(gallery.current-1);
	},
	
	showPreloadedImage: function(e) {
		if (!e) var e = window.event;
		if (!gallery.isLeftButton(e)) {
			return;
		}
		
		if (gallery.preloadedImage) {
			gallery.showGalleryImage(gallery.preloadedImage.index, gallery.preloadedImage);
		} else {
			gallery.close();
		}
	},
	
	hoverImg: function() {
		this.originalSrc = this.src;
		this.src = this.hoverImg.src;
	},
	
	unHoverImg: function() {
		this.src = this.originalSrc;
	},
	
	isLeftButton: function(event) {
		var leftClicked = false;
		
		if (!event.which && event.button) {    // IE
			leftClicked = (event.button & 1);
		} else if (event.which) {
			leftClicked = (event.which == 1);
		}
		
		return leftClicked;
	}	
}