var OVERLAY;

var fx = {
	fade : {
		opacity : 80,
		intval : 20,
		fadeIn : function (el) {
			var z = 25, that = this;
			var fade = window.setInterval(
				function () {
					if (z <= 100) {
						fx.opacity(el, z);
						z += 25;
					} else {
						window.clearInterval(fade);
						el = null;
					}
				}, 20);
		},
		to : function (el) {
			var z = this.intval, that = this;
			var fade = window.setInterval(
				function () {
					if (z <= that.opacity) {
						fx.opacity(el, z);
						z += 20;
					} else {
						window.clearInterval(fade);
						el = null;
					}
				}, 20);
		},
		out : function (el, cb) {
			var z = this.opacity, that = this;
			var fade = window.setInterval(
				function () {
					if (z >= 0) {
						fx.opacity(el, z);
						z -= 20;
					} else {
						window.clearInterval(fade);
						el = null;
						if (cb) {
							cb();
						}
					}
				}, 20);
		}
	},
	opacity : function (el, z) {
		if (document.body.filters) {
			this.opacity = function (el, z) {
				el.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity = ' + z + ')';
			};
		} else {
			this.opacity = function (el, z) {
				el.style.opacity = (z / 100);
			};
		}
		this.opacity(el, z);
	}
};

var img = {
	i18n : {
		photo : 'Photo',
		of : 'of',
		prev : 'Previous',
		next : 'Next',
		left : '[left arrow]',
		right : '[right arrow]',
		close : 'Close',
		esc : '[esc]'
	},
	count : 0,
	gallery : [],
	legacy : null,
	rel : 'passepartout',
	intrinsic : {
		x : null,
		y : null
	},
	make : function (gi, attr, str) {
		var el = document.createElement(gi.toUpperCase());
		for (val in attr) {
			el[val] = attr[val];
		}
		if (str) {
			el.appendChild(document.createTextNode(str));
		}
		return el;
	},
	create : function () {
		this.passepartout = this.make('DIV', {id: 'passepartout'});
		document.body.appendChild(this.passepartout);
		this.iframe = this.make('IFRAME');
		this.passepartout.appendChild(this.iframe);
		this.background = this.make('DIV', {className: 'background'});
		this.passepartout.appendChild(this.background);
		this.legend = this.make('DIV', {className: 'legend'});
		this.passepartout.appendChild(this.legend);
		this.load = this.make('IMG', {className: 'load', src: '/img/icons/load.gif', alt: 'loading…'});
		this.passepartout.appendChild(this.load);
		this.frame = this.make('DIV', {className: 'frame'});
		this.passepartout.appendChild(this.frame);
		this.close = this.make('DIV', {className: 'close'});
		this.frame.appendChild(this.close);
		this.close.appendChild(this.make('IMG', {src: '/img/icons/close.png', alt: 'x', title: img.i18n.close}));
		this.image = this.make('IMG');
		this.frame.appendChild(this.image);
		var tmp = this.make('DIV', {className: 'toolbar'});
		this.frame.appendChild(tmp);
		this.prev = this.make('A', {className: 'prev', href: '#'});
		tmp.appendChild(this.prev);
		this.prev.appendChild(this.make('IMG', {src: '/img/icons/end.png', title: ''}));
		this.next = this.make('A', {className: 'next', href: '#'});
		tmp.appendChild(this.next);
		this.next.appendChild(this.make('IMG', {src: '/img/icons/end.png', title: ''}));
		this.caption = this.make('SPAN', {className: 'caption'});
		tmp.appendChild(this.caption);
		this.background.onclick = this.hide;
		this.close.onclick = this.hide;
	},
	init : function () {
		this.create();
		var a = document.links, l = a.length, x;
		for (var i = 0; i < l; i++) {
			x = a[i];
			if (this.rel == x.rel) {
				this.count++;
				this.gallery[this.count] = x;
				x.href += '#view=' + this.count;
				x.onclick = img.show;
			}
		}
		a = null, x = null;
		var load = new Image();
		load.src = '/img/icons/load.gif';
		if (window.location.hash) {
			i = window.location.hash.split('=')[1];
			if (img.gallery[+i]) {
				this.show(null, img.gallery[+i]);
			}
		}
	},
	show : function (e, o) {
		var that = o || this;
		var active = false;
		if (!img.passepartout.style.display || 'none' === img.passepartout.style.display) {
			img.passepartout.style.display = 'block';
		} else {
			if (!img.gallery[+that.href.split('=')[1]] || (img.image.src == that.href.split('#')[0])) {
				return false;
			}
			active = true;
			img.frame.style.visibility = '';
		}
		img.caption.innerHTML = (
			that.title
			&& (that.title != img.i18n.prev)
			&& (that.title != img.i18n.next)
		) ? (that.title.split(': ')[1] || that.title) : '';
		img.size();
		img.load.style.visibility = 'visible';
		img.pos(img.load);
		if (img.count > 1) {
			img.legend.style.visibility = 'visible';
			img.legend.innerHTML = img.i18n.close + ': ' + img.i18n.esc;
		}
		img.legend.style.top = (document.body.scrollTop || document.documentElement.scrollTop) + 'px';
		img.legend.style.visibility = 'visible';
		img.legend.innerHTML = img.i18n.close + ': ' + img.i18n.esc;
		if (!active) {
			img.legacy = (document.onkeydown) ? document.onkeydown : null;
			fx.fade.to(img.background);
		}
		var preload = new Image();
		var index = that.href.split('=')[1];
		preload.onload = function () {
			img.legend.style.top = (document.body.scrollTop || document.documentElement.scrollTop) + 'px';
			var h = img.gallery[+index], r, ico;
			if (img.count > 1) {
				img.button((index > 1), 'prev', (+index - 1));
				img.button((index < img.count), 'next', (+index + 1));
				var str = img.i18n.photo + ' ' + index + ' ' + img.i18n.of + ' ' + img.count + ' || ';
				if (index > 1) {
					str += img.i18n.prev + ': ' + img.i18n.left + ' | ';
				}
				if (index < (img.count)) {
					str += img.i18n.next + ': ' + img.i18n.right + ' | ';
				}
				str += img.i18n.close + ': ' + img.i18n.esc;
				img.legend.innerHTML = str;
			}
			img.intrinsic.x = this.width;
			img.intrinsic.y = this.height;
			var tmp = this;
			window.setTimeout(
				function () {
					img.image.src = tmp.src;
					img.fit();
					img.pos(img.frame);
					fx.opacity(img.image, 0);
					window.setTimeout(
						function () {
							img.frame.style.visibility = 'visible';
							img.load.style.visibility = '';
							fx.fade.fadeIn(img.image);
							document.onkeydown = img.keys;
						}, 50);
				}, 50);
		};
		preload.src = img.gallery[+index].href.split('#')[0];
		//preload = null;
		if (window.location.hash) {
			window.location = window.location.toString().replace(window.location.hash, '#view=' + index);
		} else {
			window.location = window.location.toString() + '#' + that.href.split('#')[1];
		}
		return false;
	},
	fit : function () {
		var x = img.intrinsic.x;
		var y = img.intrinsic.y;
		var w = document.body.offsetWidth - 160;
		var h = document.documentElement.clientHeight
			- (80 + img.legend.offsetHeight + img.caption.offsetHeight);
		if (x > w) {
			y = y * (w / x);
			x = w;
			if (y > h) {
				x = x * (h / y);
				y = h;
			}
		} else if (y > h) {
			x = x * (h / y);
			y = h;
			if (x > w) {
				y = y * (w / x);
				x = w;
			}
		}
		img.image.width	 = x;
		img.image.height = y;
		img.frame.style.width = (img.image.width) + 'px';
	},
	button : function (guard, dir, h) {
		var a = img[dir], ico = a.firstChild, el = img.gallery[+h];
		a.style.display = 'block';
		if (guard && (h >= 1)) {
			ico.src = '/img/icons/' + dir + '.png';
			ico.alt = img.i18n[dir];
			a.style.cursor = 'pointer';
			a.href = el.href;
			a.title = img.i18n[dir];
			if (el.title) {
				a.title +=	': ' + el.title;
			}
			a.onclick = img.show;
		} else {
			a.style.cursor = 'default';
			ico.src = '/img/icons/end.png';
			ico.alt = '|';
		}
	},
	hide : function () {
	img.load.style.visibility = '';
		img.frame.style.visibility = '';
		fx.fade.out(img.background, function () {
			img.passepartout.style.display = 'none';
			img.background.style.opacity = 0;
			document.onkeydown = img.legacy;
		});
		window.location = window.location.toString().replace(window.location.hash, '#view');
	},
	pos : function (el) {
		var innerHeight = document.documentElement.clientHeight;
		var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
		var top = (innerHeight / 2) - (el.offsetHeight / 2);
		el.style.top = (scrollTop + top) + 'px';
		el.style.left = (document.body.offsetWidth / 2) - (el.offsetWidth / 2) + 'px';
	},
	size : function () {
		this.iframe.style.width = 0;
		this.iframe.style.height = 0;
		this.background.style.width = 0;
		this.background.style.height = 0;
		var d = document.documentElement.scrollHeight;
		var w = document.documentElement.clientHeight;
		this.iframe.style.width = document.body.offsetWidth + 'px';
		this.iframe.style.height = ((w >= d) ? w : d) + 'px';
		this.background.style.width = document.body.offsetWidth + 'px';
		this.background.style.height = ((w >= d) ? w : d) + 'px';
	},
	keys : function (e) {
	if (!e) {
		e = window.event;
	}
	switch (e.keyCode) {
	case 37:
		img.show(e, img.prev);
			return false;
		break;
	case 39:
		img.show(e, img.next);
			return false;
		break;
	case 27:
		if (img.frame.style.visibility) {
		img.hide();
		}
			return false;
		break;
	default:
		break;
	}
	}
};

function resize() {
	if ('block' == img.passepartout.style.display) {
		img.fit(img.image.width, img.image.height);
		img.size();
		img.pos(img.frame);
	}
}