var previousFace;

function init() {
	$("bigMemberPict").style.display = "none";
	var currentMember;
	var membersLoc = new Array();
	for (var i = 0; i < members.length; i++) {
		membersLoc.push(members[i]);
	}
	for (var i = 0; i < members.length; i++) {		
		var rand = Math.round(Math.random() * membersLoc.length) - 1;
		if (rand < 0) {
			rand = 0;
		}
		var member = membersLoc[rand];
		var memberFaceDiv = document.createElement("DIV");
		memberFaceDiv.memberId = member.id;
		memberFaceDiv.onclick = smallImgClick;
		Element.addClassName(memberFaceDiv, "developerFace");
		var memberFaceImg = document.createElement("IMG");
		memberFaceImg.src = member.smallImgSrc;
		memberFaceImg.alt = member.name + "(" + member.occupation + ")";
		
		Element.addClassName(memberFaceImg, "face");
		memberFaceDiv.appendChild(memberFaceImg);
		$("memberFaces").appendChild(memberFaceDiv);
		if (!currentMember) {
			currentMember = member;
			previousFace = memberFaceDiv;
			Element.addClassName(memberFaceDiv, "selected");
		}
		getMemberById(memberFaceDiv.memberId ).memberFaceDiv = memberFaceDiv;
		membersLoc.splice(rand, 1);
	}
	
  var a = document.createElement("A");
  a.href = "jobs.html";

	//var weAreHiringDiv = document.createElement("DIV");
	//Element.addClassName(weAreHiringDiv, "developerFace");
	Element.addClassName(a, "developerFace");
	var weAreHiringImg = document.createElement("IMG");
	weAreHiringImg.src = "./images/memberS/noface_photo_main.gif";
	weAreHiringImg.alt = "Stanfy is hirring"; //member.name + "(" + member.occupation + ")";
	
	Element.addClassName(weAreHiringImg, "face");
	//weAreHiringDiv.appendChild(weAreHiringImg);
	//a.appendChild(weAreHiringDiv);
	a.appendChild(weAreHiringImg);
	$("memberFaces").appendChild(a);
		
	$("bigMemberPict").onload = function() {		
		if ($("bigMemberPict").style.display != "block") {
	  	$("bigMemberPict").style.display = "block";
		}
	}
	
	
	var params = null;
  if (window.location.href.match(/\#(.+)$/)) {
   // only take everything after the #
   params = RegExp.$1;
	}  
	
	if (params) {
		var memberFromUrl = getMemberByName(params); 
		if (memberFromUrl) {
			Element.removeClassName(previousFace, "selected");
			currentMember = memberFromUrl;
			previousFace = memberFromUrl.memberFaceDiv;
			Element.addClassName(memberFromUrl.memberFaceDiv, "selected");
		}
	}
	

	changeMember(currentMember);
}


function changeMember(newMember) {
	
	if ($("bigMemberPict").src != "") {
	  $("bigMemberPict").src = "";
	}
	$("bigMemberPict").style.display = "none";
	$("bigMemberPict").style.left = newMember.largeImgLeft + "px";	
	$("bigMemberPict").alt = newMember.name;
	
	$("developer").style.display = "none";
	$("developerAbout").style.display = "none";
	
	document.getElementsByClassName("name", $("developer"))[0].innerHTML = newMember.name;
	var ocupationEl = document.getElementsByClassName("occupation", $("developer"))[0];
	ocupationEl.innerHTML = newMember.occupation;
	
	if (ocupationEl.childNodes[0].nodeType != 3) {
		var ocupantionSpan = ocupationEl.childNodes[0];
		if (ocupantionSpan.style.opacity && ocupantionSpan.style.opacity < 1) {
			// IE has trouble with opacity if it does not have layout
			// Force it by setting the zoom level
			ocupantionSpan.style.zoom = 1;
			// Set the alpha filter to set the opacity
			ocupantionSpan.style.filter = (ocupantionSpan.style.filter || "").replace( /alpha\([^)]*\)/, "" ) +
			   (parseInt( ocupantionSpan.style.opacity ) + '' == "NaN" ? "" : "alpha(opacity=" + ocupantionSpan.style.opacity * 100 + ")");
		} 
	}
	
	document.getElementsByClassName("lifeMoto", $("developerAbout"))[0].innerHTML = newMember.lifeMoto;
	document.getElementsByClassName("workMoto", $("developerAbout"))[0].innerHTML = newMember.workMoto;
		
	changeDevAboutLocateion(newMember);
	$("bigMemberPict").src = newMember.largeImgSrc;
	
	$("developer").style.display = "block";
	$("developerAbout").style.display = "block";	
	
}


function changeDevAboutLocateion(member) {
	var devAboutTop = member.devAboutTop;
	var devAboutLeft = member.devAboutLeft;
	
	$("developerAbout").style.top = devAboutTop + "px";
	$("developerAbout").style.left = devAboutLeft + "px";
	
	var arrowTop = devAboutTop + 35;
	var arrowLeft = devAboutLeft - 70;
	
	$("arrow").style.top = arrowTop + "px";
	$("arrow").style.left = arrowLeft + "px";	
	
	var devTop = devAboutTop + 105;
	var devLeft = devAboutLeft - 130;
	
	$("developer").style.top = devTop + "px";
	$("developer").style.left = devLeft + "px";
	
	// Background Color White
	//$("developer").style.background = "#FFF";	
}

function getMemberById(id) {
	var member = null;
	for (var i = 0; i < members.length; i++) {
		if (members[i].id == id) {
			member = members[i];
			break;
		}
	}
	return member;
}

function getMemberByName(name) {
	var member = null;
	if (!name) {
		return null;
	}
	for (var i = 0; i < members.length; i++) {
		if (members[i].name.toLowerCase() == name.toLowerCase()) {
			member = members[i];
			break;
		}
	}
	return member;
}

/**
 * Function for processing 
 * small member img onlcick.
 * 
 * @param e event
 */
function smallImgClick(e) {
	if (previousFace != this) {
		if (previousFace) {
			Element.removeClassName(previousFace, "selected");
		}
		Element.addClassName(this, "selected");
		var newMember = getMemberById(this.memberId)	
		var params = null;
		var href = window.location.href;
		if (href.indexOf("#") < 0) {
			href += "#" + newMember.name;
		} else {
			href = href.substring(0, href.indexOf("#")) + "#" + newMember.name;
		}
		window.location.href = href;
		changeMember(newMember);
		previousFace = this;
	}
}