/*<![CDATA[*/
var myImgBox = new imgBox();
var ie;
if (ie == undefined) {
	ie = null;
	if (navigator.userAgent.indexOf('Opera') != -1) {
		ie = 7;
	}
}
if (ie) {
	window.onload=function() {myImgBox.init();}
}
function imgBox() {
	this.init = init;
	this.close = close;
	this.click = click;
	this.stopLoading = stopLoading;
	this.next = next;
	this.prev = prev;
	
	var imgbox;
	var ds1;
	var imgboxImage;
	var imgboxLoading;
	var aPrev;
	var aNext;
	var caption;

	var activeAnchor;

	var prevImage = new Image();
	var nextImage = new Image();
	function init() {
		if (!document.getElementById('images')) {
			return;
		}

		/* Generate HTML Code */
		/*
		 * 	<div id="imgbox">
		 * 		<div class="ds1">
		 * 			<div class="ds2">
		 * 				<div class="ds3">
		 * 					<img />
		 *	 			</div>
		 * 			</div>
		 * 			<a href="#" class="close"></a>
		 * 		</div>
		 * 		<div id="imgboxLoading">
		 * 			<img src="loading.gif" alt="Loading..." height="32" width="32" />
		 * 		</div>
		 * 		<a href="#" class="next"></a>
		 * 		<a href="#" class="prev"></a>
		 * 		<p></p>
		 * 	</div>
		 */
		imgbox = document.createElement('div');
		imgbox.id = 'imgbox';
		document.getElementById('contentpane').appendChild(imgbox);

		ds1 = document.createElement('div');
		ds1.className = 'ds1';
		ds1.id = 'ds1';
		imgbox.appendChild(ds1);
		
		var ds2 = document.createElement('div');
		ds2.className = 'ds2';
		ds1.appendChild(ds2);

		var ds3 = document.createElement('div');
		ds3.className = 'ds3';
		ds2.appendChild(ds3);

		imgboxImage = document.createElement('img');
		imgboxImage.onclick=function() {myImgBox.close(); return false;};
		imgboxImage.id = 'imgboxImage';
		ds3.appendChild(imgboxImage);

		imgboxLoading = document.createElement('div');
		imgboxLoading.id = 'imgboxLoading';
		if (!ie)
			imgbox.appendChild(imgboxLoading);

		var loading = document.createElement('img');
		loading.src = '/image/loading.gif';
		loading.alt = 'Loading...';
		loading.height = '32';
		loading.width = '32';
		loading.onclick = function() {myImgBox.close(); return false;};
		loading.style.cursor = 'pointer';
		imgboxLoading.appendChild(loading);

		var aClose = document.createElement('a');
		aClose.href="#";
		aClose.className="close";
		aClose.onclick=function() {myImgBox.close(); return false;};
		ds1.appendChild(aClose);

		aPrev = document.createElement('a');
		aPrev.href="#";
		aPrev.className="prev";
		aPrev.id = 'aPrev';
		aPrev.onclick=function() {myImgBox.prev(); return false;};
		imgbox.appendChild(aPrev);

		aNext = document.createElement('a');
		aNext.href="#";
		aNext.className="next";
		aNext.id = 'aNext';
		aNext.onclick=function() {myImgBox.next(); return false;};
		imgbox.appendChild(aNext);

		caption = document.createElement('p');
		caption.id = 'caption';
		imgbox.appendChild(caption);

		/* Apply onClick events on all anchors below #images */
		var anchors = document.getElementById('images').getElementsByTagName('a');
		for (var i = 0; i < anchors.length; i++) {
			if (anchors[i].href) {
				anchors[i].onclick=function() {myImgBox.click(this); return false;};
			}
		}
	}

	/**
	 * Hide the popup
	 */
	function close() {
		hide(imgbox);
	}
	/**
	 * Callback for thumb onClick
	 */
	function click(anchor) {
		activeAnchor = anchor;
		show(imgbox);
		changeImage();
	}
	/**
	 * Hides current image and shows the Loading stuff
	 */
	function startLoading() {
		if (!ie) {
			hide(ds1);
			show(imgboxLoading);
		}
		if (getNext()) {
			show(aNext);
		}  else {
			hide(aNext);
		}
		if (getPrev()) {
			show(aPrev);
		} else {
			hide(aPrev);
		}
	}
	function changeImage() {
		startLoading();
		imgboxImage.src = activeAnchor.href;
		imgboxImage.onload = myImgBox.stopLoading;
		setCaption();
		preload();
	}

	/**
	 * Stops the load and display the image.
	 * Called from onload on curImage
	 */
	function stopLoading() {
		if (!ie) {
			hide(imgboxLoading);
		}
		imgboxImage.onload = function(){}; // Something with IE

		if (activeAnchor.lastChild.height > activeAnchor.lastChild.width) {
			ds1.style.marginLeft = '102px'; /* This (470 - 266) / 2 */
			if (ie == '6') {
				ds1.style.marginLeft = '51px';  /* Double margin bug */
			}
		} else {
			ds1.style.marginLeft = '0';
		}
		if (!ie) {
			show(ds1);
		}
	}
	/**
	 * Get next anchor
	 */
	function getNext() {
		var x = activeAnchor.parentNode.parentNode.parentNode.nextSibling;
		if (x && x.className == 'clear') {
			x = x.nextSibling;
		}
		if (x && x.nodeType != 3)
			return x.lastChild.lastChild.lastChild;
		return false;
	}
	/**
	 * Get previous anchor
	 */
	function getPrev() {
		var x = activeAnchor.parentNode.parentNode.parentNode.previousSibling;
		if (x && x.className == 'clear') {
			x = x.previousSibling;
		}
		if (x && x.nodeType != 3)
			return x.lastChild.lastChild.lastChild;
		return false;
	}
	function preload() {
		var x = getPrev();
		if (x) { // Load prev image
			prevImage.src = x.href;
		}
		var x = getNext();
		if (x) { // Load next image
			nextImage.src = x.href;
		}
	}
	function next() {
		activeAnchor = getNext();
		changeImage();
	}
	function prev() {
		activeAnchor = getPrev();
		changeImage();
	}
	function setCaption() {
		caption.innerHTML= activeAnchor.title;
	}
	function hide(obj) {
		obj.style.display = 'none';
	}
	function show(obj) {
		obj.style.display = 'block';
	}
}

function addPopup(id) {
	var menuroot = document.getElementById(id);
	// Add the HTMl Code
	var popup = document.createElement('div');
	popup.id = 'popup';
	menuroot.parentNode.appendChild(popup);

	var ds1 = document.createElement('div');
	ds1.classNames = 'ds1';
	popup.appendChild(ds1);

	var ds2 = document.createElement('div');
	ds2.classNames = 'ds2';
	ds1.appendChild(ds2);

	var ds3 = document.createElement('div');
	ds3.classNames = 'ds3';
	ds2.appendChild(ds3);

	var img = document.createElement('img');
	ds3.appendChild(img);

	// Add onmouse events
	var anchors = menuroot.getElementsByTagName('a');
	for (var i = 0; i < anchors.length; i++) {
		if (anchors[i].nextSibling && anchors[i].nextSibling.tagName == 'IMG' && anchors[i].parentNode.className.indexOf("selected") == -1) {
			anchors[i].onmouseover=function() {
				var popup = document.getElementById('popup');
				popup.getElementsByTagName('img')[0].src = this.nextSibling.src;
				popup.getElementsByTagName('img')[0].alt = this.nextSibling.alt;
				popup.style.display = 'block';
			};
			anchors[i].onmouseout=function() {
				document.getElementById('popup').style.display = 'none';
			};
		}
	}
}

function addMoreInfo() {
	if (document.getElementById('home_info')) {
		var anchors = document.getElementById('home_info').getElementsByTagName('a');
		for (var i = 0; i< anchors.length; i++) {
			anchors[i].onclick = function() {
				var divs = this.parentNode.getElementsByTagName('div');
				for (var i = 0; i < divs.length; i++) {
					divs[i].style.display = 'none';
				}
				this.nextSibling.style.display = 'block';
				return false;
			}
		}
		var divs = document.getElementById('home_info').getElementsByTagName('div');
		for (var i = 0; i < divs.length; i++) {
			divs[i].onclick = function() {this.style.display = 'none';}
		}
	}
}
/*]]>*/
