////////////////////////////////////////////////////////////////////////////////
// Horizontal Menu Library
//   Notes: The menu items must be included in a span called 'spnHorizMenu'
////////////////////////////////////////////////////////////////////////////////

// <script language="javascript">
// Copyright (c) Home Automation, Inc. All rights reserved.          
// Copyright (c) HomeRun Software Systems LLC. All rights reserved.

////////////////////////////////////////////////////////////////////////////////
// Globals
////////////////////////////////////////////////////////////////////////////////
var g_iDisplayableMenuItems;
var g_iMenuItemWidth = 220;	// Width of each menu item
var g_iMenuCurrentFirst;	// First menu item that is displayed in the UI

////////////////////////////////////////////////////////////////////////////////
// Constants
////////////////////////////////////////////////////////////////////////////////
var HM_DIRECTION_RIGHT = 1;
var HM_DIRECTION_LEFT  = 2;

////////////////////////////////////////////////////////////////////////////////
// HM_Init: Initialize Horizontal Menu
////////////////////////////////////////////////////////////////////////////////
function HM_Init()
{
	if ( document.all.spnHorizMenu[0] )
	{
		// Determine the number of menu items that can fit on the page
		var iPageWidth     = document.body.clientWidth;
		var iLeftMargin;

		if (g_bPageScaledDown)
		{
			g_iDisplayableMenuItems = 4;
			iLeftMargin             = 72;
		}
		else
		{
			// Set Table widths to be wider than default
			tblBody.width   = iPageWidth;
			
			var iMargins = 120;	// Includes both left and right margins for left/right arrows
			g_iDisplayableMenuItems = Math.floor((iPageWidth - iMargins) / g_iMenuItemWidth);
			iLeftMargin = Math.round((iPageWidth - (g_iDisplayableMenuItems * g_iMenuItemWidth)) / 2);
		}
				
		// Check if there are less menu items than the screen says can be displayed
		if ( g_iDisplayableMenuItems > spnHorizMenu.length)
			g_iDisplayableMenuItems = spnHorizMenu.length;
			
		// Position Page Title
		//if (!g_bPageScaledDown)
		//	spnPageTitle.style.left = iLeftMargin + ((g_iDisplayableMenuItems-2) * 220) + 132;

		// Align the page menu items
		for (var x = 0; x < spnHorizMenu.length; x++)
		{
			document.all.spnHorizMenu[x].style.left = (g_iMenuItemWidth * x) + iLeftMargin;
			
			// Hide/Show the respective menu items
			if ( x < g_iDisplayableMenuItems )
				document.all.spnHorizMenu[x].style.display = "block";
			else
				document.all.spnHorizMenu[x].style.display = "none";
		}
		
		// Show/Hide and position the scroll buttons
		document.all.spnScrollLeft.style.left = iLeftMargin - 50;
		document.all.spnScrollLeft.style.display = "none";
		document.all.spnScrollRight.style.left = (g_iDisplayableMenuItems * g_iMenuItemWidth) + iLeftMargin + 10;

		if (spnHorizMenu.length > g_iDisplayableMenuItems)
			document.all.spnScrollRight.style.display = "block";
		else
			document.all.spnScrollRight.style.display = "none";
			
		// Default the selection to the first item in the list
		g_iMenuCurrentFirst = 0;
		HM_Select(document.all.spnHorizMenu[0]);
	}
}

////////////////////////////////////////////////////////////////////////////////
// HM_Scroll: Scroll Horizontal Menu left or right
// Params: Integer specifying HM_DIRECTION
////////////////////////////////////////////////////////////////////////////////
function HM_Scroll
(
	iDirection
)
{
	var iAdjust;
	
	// Perform direction-specific actions
	if (iDirection == HM_DIRECTION_RIGHT)
	{
		iAdjust = g_iMenuItemWidth * -1;
		g_iMenuCurrentFirst++;
		HM_Select(spnHorizMenu[g_iMenuCurrentFirst+g_iDisplayableMenuItems-1])
	}
	else
	{
		iAdjust = g_iMenuItemWidth;
		g_iMenuCurrentFirst--;
		HM_Select(spnHorizMenu[g_iMenuCurrentFirst])
	}
	
	// Need to specifically set width to avoid only partial display of transition
	spnHorizMenuItems.style.width = document.body.clientWidth;
	
	spnHorizMenuItems.filters[0].Apply();		// Set state for beginning of transition                 
	
	// Move each item accordingly
	for (var x = 0; x < spnHorizMenu.length; x++)
	{
		// Reposition
		var tmp = new String(spnHorizMenu[x].style.left);
		var iCurrentLeft = tmp.substring(0,tmp.indexOf("p"))-0;
		spnHorizMenu[x].style.left = iCurrentLeft + iAdjust;
		
		// Hide or Show
		if ( (x >= g_iMenuCurrentFirst) && (x < (g_iMenuCurrentFirst + g_iDisplayableMenuItems)) )
			spnHorizMenu[x].style.display = "block";
		else
			spnHorizMenu[x].style.display = "none";
	}
	
	// Hide/Show the scroll buttons
	if ( g_iMenuCurrentFirst == 0 )
		document.all.spnScrollLeft.style.display = "none";
	else
		document.all.spnScrollLeft.style.display = "block";

	if (g_iMenuCurrentFirst >= (spnHorizMenu.length - g_iDisplayableMenuItems) )
		document.all.spnScrollRight.style.display = "none";
	else
		document.all.spnScrollRight.style.display = "block";
	
	spnHorizMenuItems.filters[0].Play();		// Begin transition
	
		
}

////////////////////////////////////////////////////////////////////////////////
// HM_MouseOver: MouseOver event for menu item
////////////////////////////////////////////////////////////////////////////////
function HM_Select
(
	spnMenuItem
)
{
	// Explicitly Deselect all items first
	for (var x=0; x < spnHorizMenu.length; x++)
	{
		HM_Deselect(spnHorizMenu[x]);
		
		// Determine the item to be selected
		if (spnMenuItem == spnHorizMenu[x])
			g_CurrentFocus = x;
	}
		
	// Produce highlight effect
	spnMenuItem.childNodes[0].childNodes[0].childNodes[0].childNodes[0].className = "ItemTitleSelected";
	spnMenuItem.childNodes[0].childNodes[0].childNodes[1].childNodes[0].className = "ImageSelected";
	spnMenuItem.childNodes[0].childNodes[0].childNodes[2].childNodes[0].className = "ItemDescriptionSelected";
	spnMenuItem.childNodes[0].childNodes[0].childNodes[1].childNodes[0].childNodes[0].className = "IconSelected";
	
	// If user selects an item beyond the right of displayable region then scroll right
	if ( g_CurrentFocus == (g_iMenuCurrentFirst + g_iDisplayableMenuItems) )
		HM_Scroll(HM_DIRECTION_RIGHT)
		
	// If user selects an item beyond the left of displayable region then scroll left
	if ( g_CurrentFocus < g_iMenuCurrentFirst )
		HM_Scroll(HM_DIRECTION_LEFT)

	PlaySound(SOUND_SELECT);
	
}

////////////////////////////////////////////////////////////////////////////////
// HM_MouseOut: MouseOut event for menu item
////////////////////////////////////////////////////////////////////////////////
function HM_Deselect
(
	spnMenuItem
)
{
	// Remove highlight effect
	spnMenuItem.childNodes[0].childNodes[0].childNodes[0].childNodes[0].className = "ItemTitle";
	spnMenuItem.childNodes[0].childNodes[0].childNodes[1].childNodes[0].className = "Image";
	spnMenuItem.childNodes[0].childNodes[0].childNodes[2].childNodes[0].className = "ItemDescription";
	spnMenuItem.childNodes[0].childNodes[0].childNodes[1].childNodes[0].childNodes[0].className = "Icon";
}

////////////////////////////////////////////////////////////////////////////////
// HM_Resize: Resize event
////////////////////////////////////////////////////////////////////////////////
function HM_Resize()
{
}