if (window.addEventListener)
	window.addEventListener("load", initWindow, false);

function initWindow() {
	initOverlayLinks();
}

// functionality for highlight links to overlay box 
function initOverlayLinks() {
	var links = document.getElementsByTagName("a");
	for (var i = 0; i < links.length; i++) {
		if (links[i].className == 'portfolioLink') {
			links[i].onclick = function () {
				overlayBox();
				loadHighlightPortfolio(this.href);
				return false;
			}
		}
	}
}

// functionality previous and next buttons in overlay box
function initPrevNextPortfolioLinks(div) {
	var links = div.getElementsByTagName("a");
	for (var i = 0; i < links.length; i++) {
		if (links[i].className == 'prevLink' || links[i].className == 'nextLink') {
			links[i].onclick = function () {
				var boxContent = document.getElementById('overlayContent');
				//document.getElementById('overlayBox').removeChild(boxContent);
				document.getElementById('waitIndicator').style.visibility = "visible";
				loadHighlightPortfolio(this.href);
				return false;
			}
		}
	}
}

// append a centered div with id overlayBox, waiting gif and close ui elements
function overlayBox () {
	// darken page div
	var mask = document.createElement('div');
	mask.id = 'pageMask';
	document.body.appendChild(mask);
	// overlay box
	var box = document.createElement('div');
	box.id = 'overlayBox';
	// spinning wait indicator gif
	box.innerHTML = '<img src="images/decorSpin.gif" id="waitIndicator" />';
	// close box
	var closeUI = document.createElement('div');
	closeUI.id = 'overlayCloseUI';
	closeUI.innerHTML = '<img src="images/decorCloseUpR.gif" alt="close" width="18" height="18" />';
	document.body.appendChild(box);
	box.appendChild(closeUI);
	// close functions
	closeUI.onclick = function () {
		document.body.removeChild(box);
		document.body.removeChild(mask);
	}
	mask.onclick = function () {
		document.body.removeChild(box);
		document.body.removeChild(mask);
	}
	centerDiv('overlayBox');
}

// parse url
function parseHighlightURL(link){
	var pattern = new RegExp("/([^/]+)", "g");
	var pathDirs = new Array();
	var result;
	while((result = pattern.exec(link)) != null) {
		pathDirs.push(result[1]);
	}
	var url = 'portfolioItem.php?t=' + pathDirs[1] + '&p=' + pathDirs[2];
	if (pathDirs[3]) {
		url += '&i=' + pathDirs[3];
	}
	return url;
}

// parse url and load php script into overlay Box
function loadHighlightPortfolio (link) {
	var url = parseHighlightURL(link);
	// load external html into overlayBox
	function loadPortfolioContent (url) {
		var request = new XMLHttpRequest();
		request.onreadystatechange = function () {
			if (request.readyState == 4 && request.status == 200) {
				if (!document.getElementById('overlayContent')) {
					var boxContent = document.createElement('div');
					boxContent.id = 'overlayContent';
					document.getElementById('overlayBox').appendChild(boxContent);
				}
				document.getElementById('overlayContent').innerHTML = request.responseText;
				initPrevNextPortfolioLinks(document.getElementById('overlayContent'));
				//window.setTimeout("centerDiv('overlayBox')", 100);
				centerDiv('overlayBox')
				document.getElementById('waitIndicator').style.visibility = "hidden"
			}
		}
		request.open("GET", url, true);
		request.send(null);
	}
	loadPortfolioContent(url);
}

// center a div
function centerDiv (divId) {
	divToCenter = document.getElementById(divId)
	divToCenter.style.position = "absolute";
	
	screenXCenter = getScreenCenterX();
	screenYCenter = getScreenCenterY();
	
	var dvXCenter = getDivCenter(divId).x;
	var dvYCenter = getDivCenter(divId).y;

	divToCenter.style.left = (screenXCenter-dvXCenter)+"px";
	divToCenter.style.top = Math.max((screenYCenter-dvYCenter),0)+"px";
	
	function getScreenCenterY() {
		var y = 0;
		y = getScrollOffset()+(getInnerHeight()/2);
		return(y);
	}

	function getScreenCenterX() {
		return(document.body.clientWidth/2);
	}

	function getInnerHeight() {
		var y;
		// all except Explorer
		if (self.innerHeight) { y = self.innerHeight; }
		// Explorer 6 Strict Mode
		else if (document.documentElement && document.documentElement.clientHeight) { y = document.documentElement.clientHeight; } 
		// other Explorers
		else if (document.body) { y = document.body.clientHeight; }
		return(y);
	}
	
	function getScrollOffset() {
		var y;
		// all except Explorer
		if (self.pageYOffset) { y = self.pageYOffset; }
		// Explorer 6 Strict
		else if (document.documentElement && document.documentElement.scrollTop) { y = document.documentElement.scrollTop; }
		// all other Explorers
		else if (document.body) { y = document.body.scrollTop; } 
		return(y);
	}
	
	function getDivCenter(divId) {
		var div = document.getElementById(divId);
		if (div.offsetWidth) { 
			x = div.offsetWidth/2;
			y = div.offsetHeight/2;
		 }
		else { 
			x = div.style.width/2
			y = div.style.height/2
		}
		return({'x':x,'y':y});
	}

}