// JavaScript Document
var Menu = Class.create();

Menu.prototype = {
	reltag: 'menu',
	selected: {show: true, className: 'selected'},
	
	initialize: function() {
		this.hide();
		
		if(!$(this.reltag))
			return;
		
		document.observe('click', (function(event) {
			var target = event.findElement('#'+this.reltag+' ul li');
			if(!target)
				return;
			
			/*if($(target).up('#'+this.reltag+'') && $(target).down('ul'))
				event.stop();*/
				
		}).bind(this));
		
		$(this.reltag).observe('mouseover', (function(event) {
			this.show(event);
		}).bind(this));
		
		document.observe('mouseout', ( function(event) {
			var target = event.findElement('#'+this.reltag+'');
			if(target)
				return;
			
			this.hide();

		}).bind(this));
	},
	
	show: function(event) {
		var target = event.findElement('#'+this.reltag+' ul li');
		if(!target)
			return;
		
		var sub = target.down('ul');
		if(sub)
			sub.show();
		
		var sArr = target.siblings();
		$A(sArr).each( function(item) {
			var sub = item.down('ul');
			if(sub)
				sub.hide();
		});
	},
	
	hide: function() {
		var mArr = $$('#'+this.reltag+' ul ul');
		if(this.selected.show)
			$A(mArr).each( (function(item) {
				var parent = item.up('li');
				if(parent.hasClassName(this.selected.className))
					item.show();
				else
					item.hide();
			}).bind(this));
		else
			mArr.invoke('hide');			
	}
}

document.observe('dom:loaded', function () { new Menu(); });