// JScript source code

//cache 2 arrow images
	imageUp = new Image();
	imageUp.src = "skins/vtc/media/up.jpg";
	imageDown = new Image();
	imageDown.src = "skins/vtc/media/Down.jpg";
	
	var count;										// for doing the loop
	var spanIndex=0;										// for doing the loop
	var objSpanCollection;							// store a collecion of Menu Spans
	var menuHeightCollection = new Array(); 		// store a collection of Menulists' height
	var clickedMenu;									// the menu is clicked on
	var clickedMenuSpan;
	var isBlocked;
	var objImgArrow;
	
	function initializeLeftMenu() 
	{
		// Menu Span Style
		
		// __________________________________
		//|                                  |
		//| Menu Header             <img>    |
		//|__________________________________|  Div 1
		//|                                  |
		//|                                  |
		//|       Menu Items                 |
		//|                                  |
		//|                                  |  Div 2
		//|                                  |
		//|                                  |
		//|                                  |
		//|                                  |
		//|__________________________________|
		
		// get the Main Span "topMenu"
		mainSpan = document.getElementById("leftMenu");
		if(mainSpan != null)
		{
			// get a collection of menus (Spans)
			objSpanCollection = mainSpan.getElementsByTagName("SPAN");
			
			// Iterate through all collected Spans i.e. objSpanCollection
			for (var index = 0; index < objSpanCollection.length; index++)
			{
				// objSpan is the current span during iteration 
				var objSpan = objSpanCollection[index];
				
				// Get a collection of Div 2(containing Menu Items) Height
				//  objSpan.childNodes.item(1) = Div 2 = Menu Items
				
				
				menuHeightCollection[index] = document.getElementById("leftMenuItem" + index + "SubMenu").clientHeight + 'px';
			
				// Assign the click event to every Menu Header
				//  objSpan.childNodes.item(0) = Div 1 = Menu Header
				
				
				document.getElementById("leftMenuItem" + index + "SubMenuHead").onclick = leftMenuHandler;;
				//objSpan.childNodes.item(0).onclick = leftMenuHandler;
				
			}
		}
	}
	
	function leftMenuHandler() 
	{
		// this = Div 1 = Menu Header
		// this.parentNode.childNodes.item(1) = Div 2 = Menu Items = clickedMenu
		clickedMenu = document.getElementById(this.id);	// memorize the Menulist has been clicked
		
		clickedMenuSpan = this.parentNode;
		count = 1;
		spanIndex = 0;
		isBlocked = false;
		if(spanIndex < objSpanCollection.length)
		{
			var objSpan = objSpanCollection[spanIndex];
			clickedMenu = document.getElementById("leftMenuItem" + spanIndex + "SubMenu");
		}
		showHideMenu();
	}
	function showHideMenu()
	{
		// Get the arrow that belongs to the clicked menu
		// starting with <div> then <table> then <tbody> then <tr> then <td> and the last one is
		// what we need: <img>
		
		//  this.childNodes(0) = <table>
		//  this.childNodes(0).childNodes(0) = <tbody>
		//  this.childNodes(0).childNodes(0).childNodes(0) = <tr>
		//  this.childNodes(0).childNodes(0).childNodes(0).childNodes(0) = <td> first td of <tr>
		//  this.childNodes(0).childNodes(0).childNodes(0).childNodes(1) = <td> second td of <tr>
		//  this.childNodes(0).childNodes(0).childNodes(0).childNodes(1).childNodes(0) = <img> = objImgArrow
		
		if(objSpanCollection != null)
		{
			if(clickedMenu == null)
			{
				openInitialized();
			}
			else
			{
				if(spanIndex < objSpanCollection.length)
				{
					objImgArrow = document.getElementById("leftMenuItem" + spanIndex + "Image");
					if( (objSpanCollection[spanIndex] == clickedMenuSpan) && (clickedMenu.style.display == "none" || isBlocked == true) )
					{ 
						// Div 2 = Menu Items = clickedMenu
						// clickedMenu.childNodes.item(0) = first <Div> of clickedMenu (Menu List) 
						// objList = clickedMenu.childNodes.item(0)
						
						var objList = document.getElementById("leftMenuItem" + spanIndex + "SubMenuItems");	// get the Linkslist of the Menulist
						
						// For opening the Menu Items to its maximum height in 10 steps
						if (count < 10)
						{
							increaseHeight();
							
							// Set TimeOut and call the same function again (Recursive Call)
							// Do this function again after 20 miliseconds until the actual Menu List height will be closed
							setTimeout("showHideMenu()",20);
						}
						
						// Make visible the Menu List (Text + Background) if it's actual height is returnrd
						if (count >= 10)
						{
							isBlocked = false;
							objList.style.display = "block";  
							
							setValues();
							
						}
					}
					
					//********************************************** if(objSpanCollection[spanIndex] == clickedMenuSpan)
					else
					{
						if (clickedMenu.style.display == "none")
						{
							setValues();
							showHideMenu();	
						}
						else
						{
							objImgArrow.src = imageUp.src;  //change to the Up Arrow
							var objList = document.getElementById("leftMenuItem" + spanIndex + "SubMenuItems");	// get the Linkslist of the Menulist
							// For closing the Menu Items in 10 steps
							if (count < 10)
							{
								decreaseHeight(objList);
								// Set TimeOut and call the same function again (Recursive Call)
								// Do this function again after 20 miliseconds until the actual Menulist will be closed
								
								setTimeout("showHideMenu()",20); 
								
							}
						
							// Make Invisible the Menu List (Text + Background) if it's height is = 0
							if (count >= 10)
							{
								clickedMenu.style.display = "none";						
								setValues();
							}
						}
					}
				}
				else
				{
						spanIndex = 0;
				}
			}
		}
	}
	function openInitialized()
	{
		var isOpened = false;
		var allClosed = true;
		
		for(var spansIndex=0; spansIndex<objSpanCollection.length; spansIndex++)
		{
			isOpened = false;
			var objSpan = objSpanCollection[spansIndex];
			
			var hyperlinksCollection = objSpan.getElementsByTagName("a");
		
			for (var hyperlinksIndex = 0; hyperlinksIndex < hyperlinksCollection.length; hyperlinksIndex++)
			{
				var hyperlink = hyperlinksCollection[hyperlinksIndex];
				
				if(hyperlink.href.toLowerCase() == window.location.href.toLowerCase())
				{
											// div      // div    // div menu items //span
					//var objSpan = hyperlink.parentNode.parentNode.parentNode.parentNode;
					hyperlink.parentNode.className="Menu_Items1";
					clickedMenu = document.getElementById("leftMenuItem" + spansIndex + "SubMenu");
								
					objImgArrow = document.getElementById("leftMenuItem" + spansIndex + "Image");
					objImgArrow.src = imageDown.src;  //change to the Up Arrow
					
					clickedMenu.style.display = "block";
					var objList = document.getElementById("leftMenuItem" + spansIndex + "SubMenuItems");
					objList.style.display = "block";
					
					isOpened = true;
					allClosed = false;
				}
				else
				{
					if(!isOpened)
					{
						clickedMenu = document.getElementById("leftMenuItem" + spansIndex + "SubMenu");
						//alert("leftMenuItem" + spansIndex + "SubMenuItems");
						var objList = document.getElementById("leftMenuItem" + spansIndex + "SubMenuItems");
						//objList.nodeName.Value = "my node";nodeValue 
						//alert(objList.nodeValue);
						//alert(objSpan.childNodes[0].nodeValue);
						objList.style.display = "none";
						clickedMenu.style.display = "none";
						
						objImgArrow = document.getElementById("leftMenuItem" + spansIndex + "Image");
						objImgArrow.src = imageUp.src;  //change to the Up Arrow
					}
				}
			}
		}
		
		if(allClosed)
		{
			objSpan = objSpanCollection[0];
			clickedMenu = document.getElementById("leftMenuItem" + 0 + "SubMenu");
						
			objImgArrow = document.getElementById("leftMenuItem" + 0 + "Image");;
			objImgArrow.src = imageDown.src;  //change to the Up Arrow
			
			clickedMenu.style.display = "block";
			var objList = document.getElementById("leftMenuItem" + 0 + "SubMenuItems");
			objList.style.display = "block";
		}
				
	}
	
	
	function increaseHeight()
	{
		objImgArrow.src = imageDown.src;  //change to the Down Arrow	
		isBlocked = true;
		// display the Menu List (Text + Background)
		clickedMenu.style.display = "block";
		// Increase the tranparency of the Menu List
		//clickedMenu.filters["alpha"].opacity = clickedMenu.filters["alpha"].opacity + 10;
		
		// objSpanCollection = Collecion of Menu Spans
		// Iterate through all collected Spans i.e. objSpanCollection, to find the position of the Clicked Menu
		// to get the actual height of the Menu List and then increase the height of the Menu List
		
		for (var index = 0; index < objSpanCollection.length; index++)
		{
			// clickedMenu.parentNode = Clicked Menu Span
			// objSpanCollection[index] = current Menu Span in interation	
			if (clickedMenu.parentNode == objSpanCollection[index]) // if current span in iteration is equal to Clicked Menu Span
			{
				// Increase Menu Items height by some factor
				try
				{
					clickedMenu.style.height = clickedMenu.clientHeight + (menuHeightCollection[index]/10) + 'px';
				}
				catch(e)
				{
					clickedMenu.style.height = parseInt(clickedMenu.clientHeight) + (parseInt(menuHeightCollection[index])/10) + 'px';
				}
			}
		}
		// Increment the count by 1
		count++;
	}
	
	function decreaseHeight(objList)
	{
		// Decrease the tranparency of the Menu List
		//clickedMenu.filters["alpha"].opacity = clickedMenu.filters["alpha"].opacity - 10;
		
		// objSpanCollection = Collecion of Menu Spans
		// Iterate through all collected Spans i.e. objSpanCollection, to find the position of the Clicked Menu
		// to get the actual height of the Menu List and then decrease the height of the Menu List
		for (var index = 0; index < objSpanCollection.length; index++)
		{
			// clickedMenu.parentNode = Clicked Menu Span
			// objSpanCollection[index] = current Menu Span in interation				
			if (clickedMenu.parentNode == objSpanCollection[index]) // if current span in iteration is equal to Clicked Menu Span
			{
				// Decrease Menu Items height by some factor
				try
				{
					clickedMenu.style.height = clickedMenu.clientHeight - (menuHeightCollection[index]/10);
				}
				catch(e)
				{
					clickedMenu.style.height = parseInt(clickedMenu.clientHeight) - (parseInt(menuHeightCollection[index])/10);
				}
				
				
			}
		}
		
		// Make Invisible the Menu Items (only text)
		objList.style.display = "none";
		
		// Increment the count by 1
		count+=1;
	}
	
	function setValues()
	{
		count = 1;
		spanIndex += 1;
		
		if(spanIndex < objSpanCollection.length)
		{
			var objSpan = objSpanCollection[spanIndex];
			clickedMenu = document.getElementById("leftMenuItem" + spanIndex + "SubMenu");
		}
	}