var toggleState = 'show';
var whiteBkgd, theH1, colorBar, toggleState;

function toggleProjectInfo() {
	switch(toggleState) {
		case "show" :
			if ((browser.isIE55 || browser.isIE6up) && browser.isWin32) {
				whiteBkgd.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/50-percent-white.png', sizingMethod='scale')";
			} else {
				whiteBkgd.style.background = "url(/images/50-percent-white.png)";
			}
			theH1.style.display = 'block';
			colorBar.style.display = 'block';
			toggleState = 'hide';
			
			//	For some reason, the height and width is not picked up
			document.getElementById('imgFU').style.width = "19px";
			document.getElementById('imgFU').style.height = "20px";
			
			break;
		case "hide" :
			whiteBkgd.style.background = "none";
			whiteBkgd.style.filter = "none";
			theH1.style.display = 'none';
			colorBar.style.display = 'none';
			toggleState = 'show';
			break;
	}
}

function initPastProjects() {
//	Grab our objects
	whiteBkgd = document.getElementById('white-translucency');
	theH1 = document.getElementsByTagName("h1")[0];	//	There should only be one
	colorBar = document.getElementById('dark-content-bar');
	
	theH1.style.display = 'none';
	colorBar.style.display = 'none';
	
	document.getElementById('hide-details').innerHTML = "<a href='#' onClick='toggleProjectInfo(); return false;' title='Hide Details'><img src='/images/x-close-white.png' class='png' id='imgFU'  /></a>";
	
}