function addWorkLinkListener() {
	var worklinks = document.getElementsBySelector("#content-main div.catgroup div.grouptext ul li a");
	for(var i=0; i<worklinks.length; i++) {
		YAHOO.util.Dom.setStyle('projectPane_'+worklinks[i].id, 'opacity', 0); 
		YAHOO.util.Event.addListener(worklinks[i], "mouseover", showProject, worklinks[i]);
	}
}
function addGroupListener() {
	var thegroups = document.getElementsBySelector("#content-main div.catgroup");
	//var thesubgroups = document.getElementsBySelector("#content-main div.catgroup div.grouptext");
	for(var i=0; i<thegroups.length; i++) {
		//YAHOO.util.Event.addListener(thegroups[i], "mouseover", massMoveGroups, i);
		groups[i] = thegroups[i].id;
		thegroups[i].setAttribute('leftPos', Number(thegroups[i].style.left.substr(0, thegroups[i].style.left.length-2))-shiftsize)
		thegroups[i].setAttribute('rightPos', Number(thegroups[i].style.left.substr(0, thegroups[i].style.left.length-2)))
	}
}
function positionProjectPanes() {
	var thePanes = document.getElementsBySelector("#content-main div#projectPanes div.projectgroup");
	for(var i=0; i<thePanes.length; i++) {
		var linkID = thePanes[i].id.split("_");
		linkID = linkID[1];
		moveProjectPane(thePanes[i], YAHOO.util.Dom.getXY(linkID));
	}
}

var groups = new Array();
var groupAnimations = new Array();
var projectColumn = 0;
var companyShowing = null;
var lastLinkHovered = null;
var currentProjectPane = null;
var groupSlideTime = 0.3;
var projectPaneWidth = 208;
var shiftsize = 200;
var groupPaneWidth = 185;
var projectPaneLineHeight = 22;
var waiting = false;

/* Function that moves the project pane group next to the link for each client */
function moveProjectPane(pane, linkPosition) {
	pane.style.display = 'block';
	linkPosition[0] = linkPosition[0]-projectPaneWidth;
	linkPosition[1] = linkPosition[1]-projectPaneLineHeight;
	YAHOO.util.Dom.setXY(pane, linkPosition);
	pane.setAttribute('inPlace', "true");
	var origBG = pane.style.backgroundImage;
	var numLinks = pane.getElementsByTagName('a');
	if(numLinks && origBG)
		var newBG = origBG.replace('XXX', numLinks.length);
	pane.style.backgroundImage = newBG;
	pane.style.display = 'none';
}
function toggleProjectPane(pane, display) {
	if(!pane) return false;
	var linkHovered = document.getElementById((pane.id.split("_"))[1]);
	var groupDiv = linkHovered.parentNode.parentNode.parentNode.parentNode;
	if(display) {
		//turn on the project pane
		pane.style.display = 'block';
		var tempAnim = new YAHOO.util.Anim(pane, { opacity: { to: 1 } }, 0.2);
		tempAnim.animate();
	} else {
		//turn off the project pane
		var tempAnim = new YAHOO.util.Anim(pane, { opacity: { to: 0 } }, 0.01);
		tempAnim.onComplete.subscribe(function() { pane.style.display = 'none'; });
		tempAnim.animate();
	}
}

/* Function that moves the groups given the one group that's hovered on */
function massMoveGroups(evt, which, link, callback) {
	if(which==projectColumn) { callback(); return false; }//don't need to move anything, already showing that column
	if(currentProjectPane) { //if there's currently a project pane showing for a different client
		//turn it off
		toggleProjectPane(currentProjectPane, false);
		currentProjectPane = null;
		setLinkInactive(lastLinkHovered);
		lastLinkHovered = null;
	}
	if(which>projectColumn) {
		for(var i=0; i<which; i++) {
			var theGroup = document.getElementById(groups[i]);
			if(theGroup.getAttribute('location')=="right") {
				//Move theGroup to the left side
				theGroup.setAttribute('location', 'left');
				if(Math.abs(which-i)==1)
					moveGroup(theGroup, 'x', theGroup.getAttribute('leftPos'), callback);
				else
					moveGroup(theGroup, 'x', theGroup.getAttribute('leftPos'), null);
			}
		}
	} else if(which<projectColumn) {
		for(var i=projectColumn; i>=which; i--) {
			var theGroup = document.getElementById(groups[i]);
			if(theGroup.getAttribute('location')=="left") {
				//Move theGroup to the right side
				theGroup.setAttribute('location', 'right');
				if(Math.abs(projectColumn-i)==1)
					moveGroup(theGroup, 'x', theGroup.getAttribute('rightPos'), callback);
				else
					moveGroup(theGroup, 'x', theGroup.getAttribute('rightPos'), null);
			}
		}
	} else {
		//already showing this column, don't move anything
//		return false;
		callback();
	}
	projectColumn = which;
}

/* Function that moves a group based on the parameters passed for direction and amount */
function moveGroup(elm, dir, endPos, callback) {
//	elm.setAttribute('animating', "true");
	groupAnimations[elm.id] = true;
	switch(dir) {
		case 'y':
			var myAnim = new YAHOO.util.Anim(elm, { top: { to: endPos } }, groupSlideTime, YAHOO.util.Easing.easeOut);
			break;
		case 'x':
			var myAnim = new YAHOO.util.Anim(elm, { left: { to: endPos } }, groupSlideTime, YAHOO.util.Easing.easeOut);
			break;
		default:
			break;
	}
//	myAnim.onComplete.subscribe(function() { groupAnimations[elm.id] = false; debug('add', 'we are done moving'); });
	if(callback)
		myAnim.onComplete.subscribe(callback);
	myAnim.animate();
}

/* Functions that change the styles of the link based on hover state */
function setLinkActive(elm) {
	if(!elm) return false;
	YAHOO.util.Dom.addClass(elm, 'active');
	elm.style.backgroundImage = "url('../images/bg/li_anchor_grey_bg.gif')";
	elm.style.color = "#FF8B33";
	elm.style.textDecoration = "underline";
}
function setLinkInactive(elm) {
	if(!elm) return false;
	YAHOO.util.Dom.removeClass(elm, 'active');
	elm.style.backgroundImage = "url('../images/bg/li_anchor_bg.gif')";
	elm.style.color = "#6E6E6E";
	elm.style.textDecoration = "none";
}

function showProject(e, self) {
	//bounce back if the hovered project is the current one shown
	if(self.id==companyShowing) return false;
	//which column is the new client in
	var colNumber = Number(self.parentNode.parentNode.getAttribute('column'));
	//if the columns need to move, move them
	tempfunc = function () {
		toggleProjectPane(currentProjectPane, false);
		//set inactive the previous client links
		var currentActiveLinks = document.getElementsBySelector("#content-main div.catgroup div.grouptext ul li a.active");
		for(var i=0; i<currentActiveLinks.length; i++)
			setLinkInactive(currentActiveLinks[i]);
	
		//change variables to reflect the new project pane showing
		currentProjectPane = document.getElementById('projectPane_'+self.id);
		lastLinkHovered = self;
		
		//change active link and turn on new project pane
		setLinkActive(self);
		toggleProjectPane(currentProjectPane, true);
		companyShowing = self.id;
	}
	var moving = massMoveGroups(null, colNumber, self, tempfunc);
//	if(!moving)
//		tempfunc();
	//bounce back if the column is moving
//	debug('add', 'groupAnimations:'+groupAnimations[groups[colNumber]]);
/*	while(groupAnimations[groups[colNumber]]) {
		
	}*/
//	if(groupAnimations[groups[colNumber]]) return false;
	//turn off the previous project pane
//	debug('replace', "ProjectColumn:"+projectColumn+"<br>Company Showing:"+companyShowing+"<br>currentProjectPane:"+currentProjectPane.id);
}
function debug(func, str) {
	if(func=='add')
		document.getElementById('debug').innerHTML += "<br>"+str;
	else if (func=='replace')
		document.getElementById('debug').innerHTML = str;
}

YAHOO.util.Event.addListener(window, "load", positionProjectPanes);
YAHOO.util.Event.addListener(window, "load", addWorkLinkListener);
YAHOO.util.Event.addListener(window, "load", addGroupListener);