// JavaScript Document

var MenuOriginX		= 0;
var MenuOriginY		= 0;
var MenuBarWidth	= 100;
var MenuBarHeight	= 20;
var MenuItemWidth	= 120;
var MenuItemHeight	= 20;

function ListNodes( Node, Deep, Index ) {
	if( Node.nodeName == "LI" ) {
		alert( "ID: " + Node.id + "\n" +
			   "Deep: " + Deep + "\n" +
			   "Index: " + Index + "\n" +
			   "Value: " + Node.nodeValue + "\n" + 
			   "Data: " + Node.data + "\n" +
			   "Class: " + Node.className + "\n" +
			   "Syle: " + Node.style );
	}
	if( Node.firstChild )
		if( Node.nodeName == "UL" )	ListNodes( Node.firstChild, Deep + 1, 0 );
		else						ListNodes( Node.firstChild, Deep, 0 );
	if( Node.nextSibling )
		if( Node.nodeName == "LI" ) ListNodes( Node.nextSibling, Deep, Index + 1 );
		else						ListNodes( Node.nextSibling, Deep, Index );
}

function getStyleById( Id, Property ) {
	var Element;
	if( document.all ) { /* IE */
		Element = document.all( Id );
	} else if( document.getElementById ) { /* W3C DOM */
		Element = document.getElementById( Id );
	}
	if( Element.currentStyle ) { /* IE */
		return Element.currentStyle[ Property ];
	} else if( window.getComputedStyle ) { /* W3C DOM */
		var ElementStyle = window.getComputedStyle( Element, "" );
		return ElementStyle.getPropertyValue( Property );
	}
} 

function FindPosX( Node ) {
	var PosX = 0;
	if( Node.offsetParent ) {
		PosX = Node.offsetLeft;
		while( Node = Node.offsetParent ) PosX += Node.offsetLeft;
	}
	return PosX;
}

function FindPosY( Node ) {
	var PosY = 0;
	if( Node.offsetParent ) {
		PosY = Node.offsetTop;
		while( Node = Node.offsetParent ) PosY += Node.offsetTop;
	}
	return PosY;
}

function FindParent( Node, Name ) {
	while( Node.parentNode != null ) {
		Node = Node.parentNode; if( Node.nodeName == Name ) return Node;
	}
	return null;
}

function FindChild( Node, Name ) {
	for( i = 0; i < Node.childNodes.length; i++ ) {
		if( Node.childNodes[ i ].nodeName == Name ) return Node.childNodes[ i ];
	}
	return null;
}

function HideChilds( Node ) {
	if( ( Child = FindChild( Node, "UL" ) ) != null ) {
		for( i = 0; i < Child.childNodes.length; i++ ) {
			if( Child.childNodes[ i ].nodeName == "LI" ) {
				Child.childNodes[ i ].style.visibility = "hidden";
				//Child.childNodes[ i ].onmouseover = null;
				//Child.childNodes[ i ].style.zIndex = "0";
			}
		}
	}
}

function ShowChilds( Node ) {
	if( ( Child = FindChild( Node, "UL" ) ) != null ) {
		for( i = 0; i < Child.childNodes.length; i++ ) {
			if( Child.childNodes[ i ].nodeName == "LI" ) {
				Child.childNodes[ i ].style.visibility = "visible";
				//Child.childNodes[ i ].onmouseover = null;
				//Child.childNodes[ i ].style.zIndex = "100";
			}
		}
	}
}

function IsVisible( Node ) {
	if( Node.style.visibility && Node.style.visibility == "hidden" ) return false;
	else return true;
}

function SetupNodes( Node, Deep, Index ) {
	if( Node.nodeName == "LI" ) {
		if( Deep == 0 ) {//Node.parentNode.id == "MenuRoot" ) {
			Node.className = "MenuBarNormal";
			Node.style.visibility = "visible";
			//Node.style.zIndex = Deep * 100 + Index;
			
			Node.style.position = "absolute";
			Node.style.left = String( MenuBarWidth * Index + MenuOriginX ) + "px";
			Node.style.top = String( MenuOriginY ) + "px";
			
			/*Node.style.marginLeft = String( -40 + 80 * Index ) + "px";
			if( Index > 0 ) Node.style.marginTop = "-20px";*/
			
			Node.onmouseover = function() {
				this.className = "MenuBarSelected";
				ShowChilds( this );
			}
			Node.onmouseout = function() {
				this.className = "MenuBarNormal";
				HideChilds( this );
			}
			Node.onmousedown = function() {}
		} else {
			Node.className = "MenuItemNormal";
			Node.style.visibility = "hidden";
			//Node.style.zIndex = Deep * 100 + Index;
			
			Node.style.position = "absolute";
			Parent = FindChild( FindParent( Node, "UL" ), "LI" );
			if( Deep == 1 ) {
				Node.style.left = "0px";
				Node.style.top = String( Index * MenuItemHeight + MenuBarHeight ) + "px";
			} else {
				Node.style.left = String( MenuItemWidth ) + "px";
				Node.style.top = String( Index * MenuItemHeight ) + "px";
			}
			
			/*if( Deep == 1 ) Node.style.marginLeft = "-40px";			
			if( Deep > 1 ) Node.style.marginLeft = String( -40 + 100 ) + "px";
			if( Deep > 1 && Index == 0 ) Node.style.marginTop = "-20px";*/
			
			Node.onmouseover = function() {
				this.className = "MenuItemSelected";
				ShowChilds( this );
			}
			Node.onmouseout = function() {
				this.className = "MenuItemNormal";
				HideChilds( this );
			}
			Node.onmousedown = function() {}
		}
	}
	if( Node.firstChild )
		if( Node.nodeName == "UL" )	SetupNodes( Node.firstChild, Deep + 1, 0 );
		else						SetupNodes( Node.firstChild, Deep, 0 );
	if( Node.nextSibling )
		if( Node.nodeName == "LI" ) SetupNodes( Node.nextSibling, Deep, Index + 1 );
		else						SetupNodes( Node.nextSibling, Deep, Index );
}

function Init() {
	//alert( "Init" );
	
	//MenuBarWidth = parseInt( getStyleSheet("MenuBarNormal" ).getProperty( "width" ) );
	//MenuBarHeight = parseInt( getStyleById( "MenuBarNormal", "height" ) );
	//MenuItemWidth = parseInt( getStyleById( "MenuItemNormal", "width" ) );
	//MenuItemHeight = parseInt( getStyleById( "MenuItemNormal", "height" ) );
	
	//alert( "MBW=" + MenuBarWidth + " MBH=" + MenuBarHeight + " MIW=" + MenuItemWidth + " MIH=" + MenuItemHeight );
	
	var MenuRoot = document.getElementById( "MenuRoot" );
	MenuOriginX = FindPosX( MenuRoot );
	MenuOriginY = FindPosY( MenuRoot );
	//ListNodes( MenuRoot.firstChild, -1, 0 );
	SetupNodes( MenuRoot.firstChild, -1, 0 );
}