/*
JavaScript Document
Top Navigation Animated Draw Menus
www.earthboundmediagroup.com
Written By Elias Pettengill
July 30th, 2008
*/
/* Declare and Set Menu Variables */
var indexBarId;
var curSubMenuId;
var subMenuBarId;
var subMenuId;
var curLinkObj;
var activeLinkColor;
var barShowStatus = false;
var barIncSpeed = 5;
var barStart = 0;
var barEnd = 20;
var barTopOffSet = 3;
var barPos;
var barOffPos;
var barTimer;
var linksAlpha = 0
/* Sets the Parent navigation bar Id */
function animBarSetIndexBar(Id) {
	indexBarId = Id;
	indexBarObj = document.getElementById(indexBarId);
}
/* Sets a link to have mouseover event to displayMenu */
function animBarAddChild(linkId, subMenuId) {
	//Get link Objects
	linkObj = document.getElementById(linkId);
	subMenuObj = document.getElementById(subMenuId);
	// add mouseover even to link to toggle menu animation
	animBarAddLinksHandlers(linkObj, subMenuId);
	var links = subMenuObj.getElementsByTagName('a');
	// loop through links
	for (var i = 0; i < links.length; ++i) {
		animBarAddLinksHandlers(links[i]);
	}
}
/*This functions sets a link to clear the mouseover color and collapse the bar */
function animBarClearChild(linkObjId) {
	linkObj = document.getElementById(linkObjId);
	addEventListener( linkObj, 'mouseover', function(e) {
													 if (barShowStatus == true) {
															 curLinkObj.style.color = '';
															 animHideSubMenuBar();
															 barShowStatus = false;
															 animMenuClearPos();
															  animBarToggleIndexBar();
															clearTimeout(barTimer);
													 }
													    }, false);
}
/* This function adds the mouseover state to the links*/
/* Adds mouseover event handler to main links */
function animBarAddLinksHandlers(linkObj, subMenuId) {
	// If object exists add event to call
	if (linkObj) {
		addEventListener( linkObj, 'mouseover', function(e) { 
															//If bar is already open, reset timer so bar stays up
															if (subMenuId) {
																//Set current index bar link to active mouse over color
																animSetLinkActive(linkObj);
																curLinkObj = linkObj;
																//Set mouseoverlinks submenu links to be shown
																animSwapSubMenu(subMenuId);
																barShowStatus = true;
																curSubMenuId = subMenuId
																//Call index bar to raise up and show submenu
																animBarToggleIndexBar();
																clearTimeout(barTimer);
															}															
															}, false );
		addEventListener( linkObj, 'mouseout', function(e) { 													
															if (subMenuId) {
																barTimer = setTimeout(function() { barShowStatus = false; animMenuClearPos(); animHideSubMenuBar(); animBarToggleIndexBar(); curLinkObj.style.color = ''; }, 1000);
															}
															}, false );
	}
}
/* This function adds even handlers to the menu itself to stay open */
function animBarAddIndexBarHandlers(indexBarObj) {
		//Add mouseover even where if the user is mousing over the menu, if so keep the menu open
		addEventListener(indexBarObj, 'mouseover', function(e) { 
															//If bar is already open, reset timer so bar stays up
															clearTimeout(barTimer);
															}, false );	 
		//Add mouseout event to collapse menu when mouse is out and away from the menu bar
		addEventListener(indexBarObj, 'mouseout', function(e) { 															
															if (barShowStatus == true) {
 																barTimer = setTimeout(function() { barShowStatus = false; animMenuClearPos(); animHideSubMenuBar(); animBarToggleIndexBar(); curLinkObj.style.color = ''; }, 1000);
															}
															}, false );
}
/* Sets the initial obj.style.top */
function animBarSetInitialTop(top) {
	barStart = top;
	barPos = top;	
}
/* Set the number of pixels for the top menu index bar to move up */
function animBarSetTopIncrease(topInc) {
	barEnd = topInc;
}
/* Set the offset height where the top menu bar will rise up and then fall back down */
function animBarSetTopOffSet(offSet) {
	barTopOffSet = offSet;
}
/* Set the submenu container */
function animBarSetSubMenu(objectId) {
	subMenuId = objectId;
	subMenuObj = document.getElementById(subMenuId);
	animBarAddIndexBarHandlers(subMenuObj);	
}
/* set the link active color on mouse over/selected submenu bar */
function animBarSetActiveLinkColor(linkColor) {
	activeLinkColor = linkColor;
}
/* adds a menu event - cross browser compliant. */
function addEventListener( element, event_name, observer, capturing ) {
    if ( element.addEventListener ) // the DOM2, W3C way  
        element.addEventListener( event_name, observer, capturing );
    else if ( element.attachEvent ) // the IE way  
        element.attachEvent( "on" + event_name, observer );
}
/* Animation function that moves the bar up */
function animBarToggleIndexBar() {
	topBarObj = document.getElementById(indexBarId);
	//Get the increment
	if (barShowStatus == true) {		
		barFinalTop = (barStart - barEnd);
		// if the bar Position is not yet at the final top
		if (barPos > barFinalTop) {
			incSpeed = animGetIncSpeed(barPos, barFinalTop,  barIncSpeed);
			barPos = barFinalTop;
			barOffPos = barPos;
			subMenuHeight = (barStart) - barPos;			
			animDrawSubMenu(barFinalTop);
			setTimeout("animBarToggleIndexBar()", 1);	
		// if the bar is at the final position, do a quick offset for the bubble effect
		} else if (barPos > barFinalTop - (barTopOffSet * 2)) {
			if (barPos > barFinalTop - barTopOffSet) {
				barOffPos--;		
			} else {
				barOffPos++;
			}
			barPos--;
			subMenuHeight = (barStart) - barOffPos;			
			animDrawSubMenu(subMenuHeight);		
			topBarObj.style.top = barOffPos + 'px';
			setTimeout("animBarToggleIndexBar()", 20);
		} else {		
			animShowSubMenuBar();
		}
	}
	if (barShowStatus == false) {			
		if (barPos < barStart - barTopOffSet) {			
			//incSpeed = animGetIncSpeed(barPos, barStart,  barIncSpeed);
			//barPos = barPos + incSpeed;
			barPos = barStart - barTopOffSet;
			subMenuHeight = barStart - barPos;			
			animDrawSubMenu(subMenuHeight);
			topBarObj.style.top = barPos + 'px';
			setTimeout("animBarToggleIndexBar()", 1);			
		} else if (barPos < barStart && barPos >= barStart - barTopOffSet) {
			barPos++;
			subMenuHeight = barStart - barPos;	
			topBarObj.style.top = barPos + 'px';	
			animDrawSubMenu(subMenuHeight);
			setTimeout("animBarToggleIndexBar()", 1);
		}
	}
}
/* function that draws the submenu bar as the top navigation bar is moving up */
function animDrawSubMenu(height) {
	subMenuObj = document.getElementById(subMenuId);
	subMenuObj.style.display = "block"			
	//Draw the submenu bar as the topmenu is expanding up
		
	subMenuObj.style.height = subMenuHeight + 'px';	
	topBarObj.style.top = barPos + 'px';
}
/* function resets the bar position to account for the offset bubbble when the menu is about to collapse */
function animMenuClearPos() {
	barPos = barOffPos;
}
/* Animation function shows the submenu and draws the links in the lower bar */
function animShowSubMenuBar() {
	//get submenu object
	subMenuObj = document.getElementById(curSubMenuId);	
	subMenuObj.style.display = "block"
	animDrawSubMenuLinks();
}
/* Animation function hides the submenue bar */
function animHideSubMenuBar() {
	//get submenu object
	subMenuObj = document.getElementById(curSubMenuId);
	subMenuObj.style.display = "none";
}
/* Animation to swap the sub menu */
function animSwapSubMenu(subMenuId) {
	if (curSubMenuId) {
		linksAlpha = 0;
		curSubObj = document.getElementById(curSubMenuId);
		curSubObj.style.display = "none";
		oldSubMenuObj = document.getElementById(curSubMenuId);
		oldSubMenuObj.style.display = "none";
	}
}
/* This function sets the mouseover link to have a perment color while it's submenu bar is selected as shown */
function animSetLinkActive(linkObj) {
	//If there is an old link set to active, reset it
	if (curLinkObj) {
		curLinkObj.style.color = '';
	}
	linkObj.style.color = activeLinkColor;	
}
/* Gets the increase speed based on the difference between two numbers and the increase number(fact) between them*/
function animGetIncSpeed(num1, num2, fact) {
	//get the difference between the two numbers
	if (num2 > num1) {
		diff = num2 - num1;	
	} else {
		diff = num1 - num2;
	}
	//if the difference is less then the factor, return the difference, if else return the factor
	if (diff < fact) {
		return diff;
	} else {
		return fact;	
	}
}
/* This functions displays the lower links in a faded method */
function animDrawSubMenuLinks() {
	//If the alpha of the submenu is less then 100, increase it by 10% and run recurisvely til it hits 100
	if (linksAlpha < 100) {
		//Get current dropdown menu object
		curSubObj = document.getElementById(curSubMenuId).getElementsByTagName('ul')[0];
		setOpacity(curSubObj, linksAlpha);
		linksAlpha = linksAlpha + 10;
		setTimeout("animDrawSubMenuLinks()", 30);
	}
}
/* Set the opacity of an object by an amount from 1-100 */
function setOpacity(obj, amount) {
	obj.style.MozOpacity = amount/100;
	obj.style.KHTMLOpacity = amount/100;
	obj.style.filter = "alpha(opacity=" + amount + ")";
	obj.style.opacity = amount/100;
}