// Declare arrays for Departments and Categories --------------------------------------------------------------
var dept = ["classical", "popular", "instruction", "books", "supplies"]; 

var cat = new Array(2);
cat[0] = ["c_piano", "c_organ", "c_strings", "c_woodwinds", "c_vocal", "c_choral", 
			"c_brass", "c_scores", "c_chamber","c_guitar", "c_percussion"];
cat[1] = ["p_anthologies", "p_songs", "p_shows", "p_jazz", "p_artist", 
			"p_childrens", "p_folk", "p_piano", "p_instrumental"];
cat[2] = ["i_piano", "i_strings", "i_woodwinds", "i_vocal", "i_brass", "i_guitar", "i_percussion"];
cat[3] = ["b_biography", "b_education", "b_history", "b_theory", "b_reference", "b_performance"];
cat[4] = ["s_baton", "s_flashcard", "s_practice", "s_manuscript", "s_musicstand", "s_metronome", "s_software"];

// Functions to Handle Navigation Menu ------------------------------------------------------------------------
function closeMenus()
{
	var catName;
	var curDept;
	var curMenu;
	var image;	

	for (var i=0; i<dept.length; i++)
	{		
		for (var j=0; j<cat[i].length; j++)			 
		{
			catName = cat[i][j];
			curDept = document.getElementById(catName);			
			curMenu = document.getElementById(catName + "_menu");
			image = "images/navbar/" + catName + ".jpg";
			if (curDept !== null)
				{curDept.setAttribute('src', image);}
			if (curMenu !== null)					
				{curMenu.style.visibility = 'hidden';}			
		}
	}
}
// --------------------------------------------------------------
function clickDept(deptID)
{
	var curElement;
	var image;
	var i, j;

	// Close any open pull down menus.
	closeMenus();
	
	for (i=0; i<dept.length; i++)
	{	
		if (deptID == i)
			{
				// Show the selected department in dark gray.
				curElement = document.getElementById(dept[i]);
				image = "images/navbar/s_" + dept[i] + ".jpg";
				if (curElement !== null)
					{curElement.setAttribute('src', image);}
				
				// Show the categories within the selected department.
				for (j=0; j<cat[i].length; j++)
				{
					curElement = document.getElementById(cat[i][j]);
					if (curElement !== null)
						{curElement.style.visibility = 'visible';}
				}
				
			}
		else
			{
				// Show the unselected departments in light gray.
				curElement = document.getElementById(dept[i]);
				image = "images/navbar/" + dept[i] + ".jpg";
				if (curElement !== null)
					{curElement.setAttribute('src', image);}
				
				// Hide the categories within the unselected departments.
				for (j=0; j<cat[i].length; j++)
				{
					curElement = document.getElementById(cat[i][j]);
					if (curElement !== null)					
						{curElement.style.visibility = 'hidden';}
				}				
				
			}					
	}
	return;
}
// --------------------------------------------------------------
function outDept(deptID)
{
	var curElement;
	var curImage;
	var image;
	
	curElement = document.getElementById(dept[deptID]);
	if (curElement === null)
		{return;}
	
	curImage = curElement.getAttribute('src');
	
	if (curImage == "images/navbar/h_" + dept[deptID] + ".jpg")
		{
		image = "images/navbar/" + dept[deptID] + ".jpg";
		curElement.setAttribute('src', image);			
		}

	return;
}
// --------------------------------------------------------------
function overDept(deptID)
{
	var curElement;
	var curImage;
	var image;
	
	curElement = document.getElementById(dept[deptID]);
	if (curElement === null)
		{return;}
		
	curImage = curElement.getAttribute('src');
	
	if (curImage == "images/navbar/" + dept[deptID] + ".jpg")
		{
		image = "images/navbar/h_" + dept[deptID] + ".jpg";
		curElement.setAttribute('src', image);			
		}

	return;
}
// --------------------------------------------------------------
function openMenu(deptID, catID)
{
	var catName;
	var curDept;
	var curMenu;
	var image;	
	
	for (var j=0; j<cat[deptID].length; j++)
		{
			catName = cat[deptID][j];

			curDept = document.getElementById(catName);			
			curMenu = document.getElementById(catName + "_menu");
			
			// Set the current category to hover text, and drop down the menu.
			if (catID == j)
				{
					image = "images/navbar/h" + catName + ".jpg";
					if (curDept !== null)
						{curDept.setAttribute('src', image);}
					if (curMenu !== null)
						{curMenu.style.visibility = 'visible';}
				}
			// Set to regular text in category image, and hide the menu. 
			else
				{
					image = "images/navbar/" + catName + ".jpg";
					if (curDept !== null)
						{curDept.setAttribute('src', image);}
					if (curMenu !== null)					
						{curMenu.style.visibility = 'hidden';}
				}
		}
}
// --------------------------------------------------------------