// JavaScript Document
window.onload = function() {
	assignEvents();
	// resetBoxes();
}

function assignEvents () {
	var nodeImage;
	var staffNodes = document.getElementById("staffList").childNodes;
	for (var i = 0; i < staffNodes.length; i++) {
		if (staffNodes[i].nodeName == "LI") {
			nodeImage = staffNodes[i].getElementsByTagName("img")[0];
			if (nodeImage.addEventListener) {
				nodeImage.addEventListener("click", loadBio, false);
				nodeImage.addEventListener("mouseover", shadePhoto, false);
				nodeImage.addEventListener("mouseout", shadePhoto, false);
			} else {
				nodeImage.attachEvent("onclick", loadBio);
				nodeImage.attachEvent("onmouseover", shadePhoto);
				nodeImage.attachEvent("onmouseout", shadePhoto);						
			}
		}
	}
}

function resetBoxes () {
	var bioBox = document.getElementById("bioBox").getElementsByTagName("div");
	for (var i = 0; i < bioBox.length; i++) {
		bioBox[i].style.visibility = "hidden";
		bioBox[i].style.position = "absolute";		
	}
}

function shadePhoto(e) {
	var allPhotos = document.getElementById("staffList").getElementsByTagName("img");

	if (e.target) {
		var activePhoto = document.getElementById(e.target.id);
		activePhoto.style.opacity = "1";
		for (i = 0;  i < allPhotos.length; i++) {
			if (allPhotos[i].id != activePhoto.id) {
				allPhotos[i].style.opacity = ".25";
			}
		}
		
	} else { 
		var activePhoto = document.getElementById(e.srcElement.id);
		activePhoto.style.filter = "alpha(opacity=100)";
		for (i = 0;  i < allPhotos.length; i++) {
			if (allPhotos[i].id != activePhoto.id) {
				allPhotos[i].style.filter = "alpha(opacity=25)";
			}
		}
	}
}

function loadBio (e) {
	
	resetBoxes();
	shadePhoto(e);

	if (e.target) {
		var bio = document.getElementById(e.target.id + "_bio");	
	} else {
		var bio = document.getElementById(e.srcElement.id + "_bio");	
	}
	if (bio.style.visibility == "hidden" || !bio.style.display ) {
		bio.style.visibility = "visible";	
	} else {
		bio.style.visibility = "hidden";	
	}
}