addEvent( window, 'load', load );
var popupDelayID;
var timerID;

function load() {
	inMenu = false;
	body = document.getElementsByTagName( "body" )[0];
	lastMenuItem = null;

	if( getNode( "srch" ) == null ) return;

	var srch     = new MenuItemsParent( getNode( "srch" ));

	srch.addMenuItem( new MenuItem( "Квартиры", "fl_srch.php" ) );
	srch.addMenuItem( new MenuItem( "Новостройки", "flnew_srch.php" ) );
	srch.addMenuItem( new MenuItem( "Доходная недвижимость", "fin_srch.php" ) );
	srch.addMenuItem( new MenuItem( "Дома", "h_srch.php" ) );
	srch.addMenuItem( new MenuItem( "Дачи", "c_srch.php" ) );
	srch.addMenuItem( new MenuItem( "Участки", "pl_srch.php" ) );
	srch.addMenuItem( new MenuItem( "Гаражи", "g_srch.php" ) );
	srch.createMenu();
	
	

}


function MenuItemsParent ( node ) {
	this.node = node;
	this.menuItems = new Array();
	
	MenuItemsParent.prototype.addMenuItem = function( menuItem ) {
		this.menuItems[ this.menuItems.length ] = menuItem;	
	}
	
	MenuItemsParent.prototype.createMenu = function( ) {
		var divNode = document.createElement( "div" );
		
		divNode.className = "jsMenu";

		var str = "_" + this.node.id;
		divNode.setAttribute( "id", str );
		//must initialize values once so they don't display extra whitespace at the bottom of screen.
		var w = this.node.offsetWidth;
		divNode.style.width = w > 135 ? w+"px" : "135px";
		divNode.style.top = ( this.node.offsetTop + this.node.offsetHeight ) + "px";
		divNode.style.left = this.node.offsetLeft + "px";

		addEvent( this.node, "mouseover", function() { showMenuInTime(str, 200) } );
		addEvent( this.node, "mouseout", function() { setInMenu(false) } );

		divNode.setAttribute( "parentItemID", this.node.id );
		addEvent( divNode, "mouseover", function() { setInMenu(true) } );
		addEvent( divNode, "mouseout", function() { setInMenu(false) } );

		var html = "<ul>";
		for( var i=0; i<this.menuItems.length; i++ ) {
			html += this.menuItems[i].getLinkHTML();
		}
		divNode.innerHTML = html + "</ul>";
		
		body.appendChild( divNode );

				
		//need to place arrow due to popular demand ;)
		var imgNode = document.createElement( "img" );
		imgNode.setAttribute( "alt", "" );
		imgNode.className = "arrow";

		//add img to this.node, NOT to its hyperlink (firstChild) as other browsers have problems with that. :(
		this.node.appendChild( imgNode );
		
		/*the above would've been really easy like this.. but current html markup prevents that :(
		this.node.className = "arrow";
		*/

	}

}

function MenuItem( value, href ) {
	this.value = ( value == null ) ? "" : value;
	this.href = ( href == null ) ? "" : href;

	MenuItem.prototype.getLinkHTML = function () {

		//if its a complete URL
		if( this.value != "" && this.href != "" ) {
			return "<li><a onclick=\"setInMenu(false); hideMenu(); return true;\" href=\"" + this.href + "\">" + this.value + "</a></li>";
		}
		
		//if its a sub header, no link
		else if( this.value != "" && this.href == "" ) {
			return "<li class='heading'>" + this.value + "</li>";
		}
		
		//if its a separator, no value, no href
		else {
			return "<li class='separator'>&nbsp;</li>";
		}
		
	}
}

function showMenuInTime( node, time ) {
	popupDelayID = setTimeout( "showMenu('" + node + "')", time );
}

function showMenu( node ) {
	clearTimeout( popupDelayID );
	if( typeof node == "string" )
		node = getNode( node );

	if( lastMenuItem != null && lastMenuItem != node ) {
		hideMenu( lastMenuItem );
	} else if( lastMenuItem == node ) {
		setInMenu( true );
		return;
	}

	node.style.display = "block";
	
	//Need to set this values dynamically when the menu is displayed!!
	var parentItem = getNode( node.getAttribute( "parentItemID" ) );
	
	var w = parentItem.offsetWidth;
	node.style.width = w > 135 ? w+"px" : "135px";
//	node.style.top = ( parentItem.offsetTop + parentItem.offsetHeight ) + "px";
	node.style.top = 82 + "px";
	node.style.left = parentItem.offsetLeft + 5 + "px";
	
	setClassName( parentItem.firstChild, "jsHover" );
	
	setInMenu( true );
	lastMenuItem = node;
	timerID = setTimeout( "hideMenu( lastMenuItem )", 500 );
}

function hideMenu( node ) {
	//node is null when called by menu item hyperlink onclick event
	if( node == null ) {
		setInMenu( false );
		hideMenu( lastMenuItem );
		return;
	}
	
	if( typeof node == "string" )
		node = getNode( node );

	if( !inMenu ) {
		node.style.display = "none";
		var parentItem = getNode( node.getAttribute( "parentItemID" ) );
		removeClassName( parentItem.firstChild, "jsHover" );
		lastMenuItem = null;
		clearTimeout( timerID );
	} else {
		timerID = setTimeout( "hideMenu( lastMenuItem )", 500 );	
	}
}

function setInMenu( value ) {
	inMenu = value;	
	if( !value ) clearTimeout( popupDelayID );
}


function addEvent( node, evtType, func ) {
	if( node.addEventListener ) {
		node.addEventListener( evtType, func, false );
		return true;
	} else if( node.attachEvent ) {
		return node.attachEvent( "on" + evtType, func );
	} else {
		return false;
	}
}


function getNode( nodeId ) {
	if( document.getElementById ) {
		return document.getElementById( nodeId );
	}
	else if( document.all && document.all( nodeId ) ) {
		return document.all( nodeId );
	}
	else if( document.layers && document.layers[ nodeId ] ) {
		return document.layers[ nodeId ];
	}
	else {
		return false;
	}
}


function setClassName( node, value ) {
	if( node == null ) return;
	if( " " + node.className + " " . indexOf( value ) >= 0 ) return;
	
	node.className += ( node.className.length==0 ? "" : " " ) + value;
}

function removeClassName( node, value ) {
	if( node == null ) return;
	//RegExp doesn't work well in IE :(
	//node.className =  node.className.replace( new RegExp( /^\s?jsHover\s?$/ ), "" );
	node.className =  node.className.replace( value, "" );
}