var Menu = Class.create(
{
	delay: 0,

	initialize: function()
	{
		this.dochoverCB = this.dochover.bind(this);
	},

	parse: function()
	{
		$$('.menuMain ul.depth0 > li[id]').each(this.handler, this);
	},

	handler: function(element)
	{
		if (!element.hasClassName('active') && (element.submenu = element.select('ul').shift()))
		{
			element.expanded = false;

			//element.hasClassName('active') && (this.item_prev = element) && this.toggle(this.item_prev, true);

			element.observe('mouseover', this.hover.bind(this, element));
			element.observe('click', this.toggle.bind(this, element, false));

			element.submenu.insert({ top: new Element('li', { 'class': 'top'}) });
			element.submenu.insert({ bottom: new Element('li', { 'class': 'bottom'}) });
		}
	},

	hover: function(element)
	{
		if (element.expanded)
		{
			this.item_next = null;
		}
		else
		{
			this.item_next = element;

			var appear = (function() { if (this.item_next) { this.item_prev && this.toggle(this.item_prev); this.item_now && this.toggle(this.item_now); this.item_now = this.item_next; this.item_next = null; this.toggle(this.item_now, true); } }).bind(this);

			this.item_now ? appear.delay(this.delay) : appear();

			document.stopObserving('mouseover', this.dochoverCB);
			document.observe('mouseover', this.dochoverCB);
		}
	},

	dochover: function(event)
	{
		if (event.findElement() != this.item_now && !event.findElement().descendantOf(this.item_now))
		{
			this.item_now && this.toggle(this.item_now);

			this.item_now = this.item_next = null;

			this.item_prev && this.toggle(this.item_prev, true);

			document.stopObserving('mouseover', this.dochoverCB);
		}
	},

	toggle: function(element, show)
	{
		(element.expanded = show) ? element.submenu.removeClassName('depth1') : element.submenu.addClassName('depth1');
	}
});

var menu = new Menu();
document.observe('dom:loaded', function(event) { menu.parse(); });