//-------------------------------------------------------------------------------------- --------------------------------------------------------------------------------------------
// Author: Victor Sanchez
// Date: May 1, 2007
// Purpose, to build a dynamic menu that is easy to manage non-programmers..
//-------------------------------------------------------------------------------------- --------------------------------------------------------------------------------------------
// First we need to declare some global variables...
arrDynamicMenu = new Array();
gblBlnIsOverMenu = false;
gblMenuHasBeenCreated = false;
var intWidth = window.screen.availWidth;
var intHeight = window.screen.availHeight;
gblArrMenuHeaders = new Array();
gblIntColumnId = 0;
blnIsIE = navigator.appName.indexOf("Internet Explorer") == -1?false:true; 
//===========================================================================================================================================
// Start of Menu building functions...
//===========================================================================================================================================
function createHeader(strText, strURL, intColumnID, strNormalColor, strActiveColor)
{
	intColumnID--;
	strNormalHeaderColor = "orange";
	strActiveHeaderColor = "white";
	if(strNormalColor)
	{
		strNormalHeaderColor = strNormalColor;
	}
	if(strActiveColor)
	{
		strActiveHeaderColor = strActiveColor;
	}
	objColumnTemp = new Object();
	objColumnTemp.columnID = intColumnID;
	objColumnTemp.headerText = strText;
	objColumnTemp.destinationURL = strURL;
	objColumnTemp.strNormalColor = strNormalHeaderColor;
	objColumnTemp.strActiveColor = strActiveHeaderColor;
	objColumnTemp.arrColumnCells = new Array();
	return objColumnTemp;
}

function addMenuItem(objColumnTemp, strText, strURL, strNormalColor, strActiveColor)
{
	intTempIndex = objColumnTemp.arrColumnCells.length;
	// Set these are default colors if the user does not provide them...
	strNormalMenuItemColor = "lime";
	strActiveMenuItemColor = "white";
	if(strNormalColor)
	{
		strNormalMenuItemColor = strNormalColor;
	}
	if(strActiveColor)
	{
		strActiveMenuItemColor = strActiveColor;
	}
	objMenuItem = new Object();
	objMenuItem.strText = strText;
	objMenuItem.destinationURL = strURL;
	objMenuItem.strNormalColor = strNormalMenuItemColor;
	objMenuItem.strActiveColor = strActiveMenuItemColor;
	objMenuItem.intXPosition = objColumnTemp.columnID;
	objMenuItem.intYPosition = intTempIndex;	
	objColumnTemp.arrColumnCells[objColumnTemp.arrColumnCells.length] = objMenuItem;
}

function buildMenu3434()
{
	for(k = 0; k < gblArrMenuHeaders.length; k++)
	{
		objNewDiv = document.createElement("div");
		objNewDiv.innerHTML = gblArrMenuHeaders[k].headerText;
		objNewDiv.destinationURL = gblArrMenuHeaders[k].destinationURL;
		objNewDiv.style.position = 'absolute';
		objNewDiv.style.top = gblMenuTop;
		objNewDiv.style.left = gblMenuLeft + (gblArrMenuHeaders[k].columnID * gblIntColumnPositioningWidth); // Note: 130px represents the widht of each of the flash menu buttons...
		objNewDiv.columnID = gblArrMenuHeaders[k].columnID;
		objNewDiv.style.color = gblArrMenuHeaders[k].strNormalColor;
		objNewDiv.normalColor = gblArrMenuHeaders[k].strNormalColor;
		objNewDiv.activeColor = gblArrMenuHeaders[k].strActiveColor;
		objNewDiv.style.backgroundColor = '#000000';
		objNewDiv.style.border = '1px solid #333333';
		objNewDiv.style.fontFamily = 'Georgia';
		objNewDiv.style.fontWeight = 'bold';
		objNewDiv.style.fontSize = '8pt';
		objNewDiv.style.textAlign = 'center';
		objNewDiv.style.padding = '3px';
		objNewDiv.style.width = gblIntColumnPositioningWidth;
		objNewDiv.style.height = gblMenuItemHeight;
		objNewDiv.style.zIndex = 3434;
		objNewDiv.style.display = 'none'
		if(blnIsIE)
		{
			objNewDiv.attachEvent('onmouseover', handleMouseOverMenuHeader);
			objNewDiv.attachEvent('onmouseout', handleMouseOutMenuHeader);
			objNewDiv.attachEvent('onclick', handleClick);
		}
		else
		{			
			objNewDiv.addEventListener('mouseover', handleMouseOverMenuHeader, true);
			objNewDiv.addEventListener('mouseout', handleMouseOutMenuHeader, true);
			objNewDiv.addEventListener('click', handleClick, true);
		}
		document.body.appendChild(objNewDiv);
		// Build cells below this column...
		for(m = 0; m < gblArrMenuHeaders[k].arrColumnCells.length; m++)
		{
			arrDynamicMenu[arrDynamicMenu.length] = gblArrMenuHeaders[k].arrColumnCells[m];
		}
	}
} 
//--------------------------------------------------------------------------------------------------------------------------------------------
function createMenu()
{
	for(k = 0; k < arrDynamicMenu.length; k++)
	{
		arrDynamicMenu[k].objMenuItem = createMenuItem(arrDynamicMenu[k].strText, 
													   arrDynamicMenu[k].strNormalColor, 
													   arrDynamicMenu[k].strActiveColor, 
													   arrDynamicMenu[k].intXPosition, 
													   arrDynamicMenu[k].intYPosition,
													   arrDynamicMenu[k].destinationURL);
	}
	gblMenuHasBeenCreated = true;
}

function recreateMenu()
{
	gblMenuTop = 131; // This value is hard-coded and is designed specifically for J & S Technology Consultants' page...
	gblMenuLeft = (window.document.body.clientWidth-780)/2;  // 780 represents the width of the Flash-J&S homepage menu...
	//reposition all menu cells based on new origin...
}
//window.onresize = recreateMenu;
function createMenuItem(strText, strNormalColor, strActiveColor, intXPosition, intYPosition, destinationURL)
{
	objNewDiv = document.createElement("div");
	objNewDiv.innerHTML = strText + "&nbsp;&raquo;";
	objNewDiv.destinationURL = destinationURL;
	objNewDiv.style.position = 'absolute';
	objNewDiv.style.top = gblMenuItemHeight + gblMenuTop + (intYPosition * gblMenuItemHeight);
	objNewDiv.style.left = gblMenuLeft + (intXPosition * gblIntColumnPositioningWidth); // Note: 130px represents the widht of each of the flash menu buttons...
	objNewDiv.intXPosition = intXPosition;
	objNewDiv.style.color = strNormalColor;
	objNewDiv.normalColor = strNormalColor;
	objNewDiv.activeColor = strActiveColor;
	objNewDiv.style.backgroundColor = '#000000';
	//objNewDiv.style.backgroundImage = 'url(images/menuBG.jpg)';
	objNewDiv.style.border = '1px solid #333333';
	objNewDiv.style.fontFamily = 'arial';
	objNewDiv.style.fontWeight = 'bold';
	objNewDiv.style.fontSize = '12px';
	objNewDiv.style.textAlign = 'left';
	objNewDiv.style.paddingLeft = '3px';
	objNewDiv.style.width = gblMenuItemWidth;
	objNewDiv.style.height = gblMenuItemHeight;
	objNewDiv.style.lineHeight = gblMenuItemHeight + "px";
	//objNewDiv.style.lineHeight = gblMenuItemHeight;
	objNewDiv.style.zIndex = 3434;
	if(blnIsIE)
	{
		objNewDiv.style.filter = "FILTER: progid:DXImageTransform.Microsoft.Alpha(style=1,opacity=" + gblTransparencyLevel + ",finishOpacity=100,startX=100,finishX=100,startY=100,finishY=100)";
		objNewDiv.attachEvent('onmouseover', handleMouseOver);
		objNewDiv.attachEvent('onmouseout', handleMouseOut);
		objNewDiv.attachEvent('onclick', handleClick);
	}
	else
	{
		objNewDiv.addEventListener('mouseover', handleMouseOver, true);
		objNewDiv.addEventListener('mouseout', handleMouseOut, true);
		objNewDiv.addEventListener('click', handleClick, true);		
	}
	objNewDiv.style.display = 'none'; // Start out hidden, becomes divisible only no mouse-over event...
	document.body.appendChild(objNewDiv);
	return objNewDiv;
}
//--------------------------------------------------------------------------------------------------------------------------------------------
// Helper functions...
//--------------------------------------------------------------------------------------------------------------------------------------------
function handleMouseOverMenuHeader(objDiv, intMenuColumn)
{
	objDiv.style.color=objDiv.activeColor;	
	objDiv.style.cursor='pointer';
	gblBlnIsOverMenu = true;
	// Delay hiding the menu a bit...
	setTimeout("displayMenuColumn(" + intMenuColumn + ")", 34);
	
	// Report this menuHeader's current position on the page...
	reportMyPosition(objDiv);
}
function handleMouseOutMenuHeader(objDiv, intMenuColumn)
{
	objDiv.style.color=objDiv.normalColor;
	gblBlnIsOverMenu = false;
	// Delay hiding the menu a bit...
	setTimeout("hideMenuColumn(" + intMenuColumn + ")", 500);
}

function handleMouseOver(theEvent)
{
	if(blnIsIE)
	{
		objDiv = event.srcElement;
		objDiv.style.filter = "FILTER: progid:DXImageTransform.Microsoft.Alpha(style=1,opacity=100,finishOpacity=100,startX=100,finishX=100,startY=100,finishY=100)";
	}
	else
	{
		objDiv = theEvent.currentTarget;
	}
	objDiv.style.color=objDiv.activeColor;
	objDiv.style.cursor='pointer';
	gblBlnIsOverMenu = true;
	// Delay hiding the menu a bit...
	setTimeout("displayMenuColumn(" + objDiv.intXPosition + ")", 34);
}
function handleMouseOut(theEvent)
{
	if(blnIsIE)
	{
		objDiv = event.srcElement;
		objDiv.style.filter = "FILTER: progid:DXImageTransform.Microsoft.Alpha(style=1,opacity=" + gblTransparencyLevel + ",finishOpacity=100,startX=100,finishX=100,startY=100,finishY=100)";
	}
	else
	{
		objDiv = theEvent.currentTarget;
	}
	objDiv.style.color=objDiv.normalColor;
	gblBlnIsOverMenu = false;
	// Delay hiding the menu a bit...
	setTimeout("hideMenuColumn(" + objDiv.intXPosition + ")", 500);
}

function handleClick(theEvent)
{
	if(blnIsIE)
	{
		objDiv = event.srcElement;
	}
	else
	{
		objDiv = theEvent.currentTarget;
	}
	window.location = objDiv.destinationURL; // Opens in same window...
	//window.open(objDiv.destinationURL, '', 'width=' + intWidth + ', height=' + intHeight + ', left=0, top=0, fullscreen=no'); // Opens in new window..
}

// This function will enable the selected column, and disable all others...
function displayMenuColumn(intMenuColumn)
{
	if(gblMenuHasBeenCreated == false)
	{
		createMenu();
	}
	
	for(k = 0; k < arrDynamicMenu.length; k++)
	{
		if(arrDynamicMenu[k].intXPosition == intMenuColumn)
		{
			arrDynamicMenu[k].objMenuItem.style.display = 'inline';
			// reporition:
			arrDynamicMenu[k].objMenuItem.style.top = gblMenuItemHeight + gblMenuTop + (arrDynamicMenu[k].intYPosition * gblMenuItemHeight);
			arrDynamicMenu[k].objMenuItem.style.left = gblMenuLeft;
		}
		else
		{
			arrDynamicMenu[k].objMenuItem.style.display = 'none';
		}
	}
}

// This function will disalbe the selected column...
function hideMenuColumn(intMenuColumn)
{
	if(gblMenuHasBeenCreated == false)
	{
		createMenu();
	}
	
	if(!gblBlnIsOverMenu)
	{
		for(k = 0; k < arrDynamicMenu.length; k++)
		{
			if(arrDynamicMenu[k].intXPosition == intMenuColumn)
			{
				arrDynamicMenu[k].objMenuItem.style.display = 'none';
			}
		}
	}
}
//===========================================================================================================================================
// Helper functions used to determine the absolute position of an object...
	function reportMyPosition(webObj)
	{
		
		arrPosition = findPos(webObj);
		
		gblMenuTop = arrPosition[1] + 2;
		gblMenuLeft = arrPosition[0] + 2;
		
		strPosition = "x: " + arrPosition[0] + " y: " + arrPosition[1];
		window.status = strPosition
		return strPosition;
	}
	
	/* Function returns the absolute position of any web-object on a page...*/
	function findPos(obj) 
	{
		var curleft = curtop = 0;
		if(obj.offsetParent) 
		{
			curleft = obj.offsetLeft
			curtop = obj.offsetTop
			while(obj = obj.offsetParent) 
			{
				curleft += obj.offsetLeft
				curtop += obj.offsetTop
			}
		}
		/* Returns an array of the element's x/y coordinates... */
		return [curleft,curtop];
	}
//===========================================================================================================================================
// End of Menu building functions......
//===========================================================================================================================================