var mTimeout	= 200;
var closeTimer	= 0;
var ddmenuitem	= 0;
var submenuZIndex = 100;

function mOpen(id){

	// cancel close timer
	mClearCloseTimer();

	// close old layer
	if(ddmenuitem){

		var ddmenuitemtmp = ddmenuitem;
		window.setTimeout(function(){
			ddmenuitemtmp.style.display = 'none';
		}, 200);

	}

	submenuZIndex += 1;

	// get new layer and show it
	ddmenuitem = $(id);
	ddmenuitem.style.display = 'block';
	ddmenuitem.style.zIndex = submenuZIndex;

}

function mClose(){
	if(ddmenuitem) {
		new Effect.Fade(ddmenuitem, {duration: 0.2, queue: 'end'});
		ddmenuitem	= 0;
	}

}


function mSetCloseTimer(){
	closeTimer = window.setTimeout(mClose, mTimeout);
}

function mClearCloseTimer(){
	if(closeTimer){
		window.clearTimeout(closeTimer);
		closeTimer = null;
	}
}

Event.observe(window, 'click', mClose);
Event.observe(window, 'load', function(){

	$$('.submenu').each(function(elm){
		Event.observe(elm, 'mouseover', mClearCloseTimer);
		Event.observe(elm, 'mouseout', mSetCloseTimer);
	});

});