var Menu = new Class({
	Implements: Options,
	options: {
		elementId: 'menu'
	},
	initialize: function(options) {
		
		this.setOptions(options);
		
		this.menuElement = $(this.options.elementId);
		this.menuTabList = this.menuElement.getChildren('li');
		
		this.menuTabList.addEvent('mouseover', this.onMenuTabOver.bind(this));
		this.menuTabList.addEvent('mouseout', this.onMenuTabOut.bind(this));
		
		this.currentSubMenu = null;
    },
	hideCurrentSubMenu: function() {
		this.tracer('hideCurrentSubMenu');
		
		if(this.currentSubMenu != null) {
			
			this.currentSubMenu.setStyles({
				'display': 'none'
			});
			
			this.currentSubMenu = null;
		}
	},
	onMenuTabOver: function(event) {
		this.tracer('onMenuTabOver');
		
		var eventTargetTree = $(event.target).getParents();
		
		var menuTab = eventTargetTree[(eventTargetTree.indexOf(this.menuElement) - 1)];
		
		if((this.currentSubMenu == null) || (menuTab != this.currentSubMenu.getParent('li'))) {
			
			this.hideCurrentSubMenu();
			
			this.currentSubMenu = menuTab.getElement('ul');
			
			// displays the block
			if(this.currentSubMenu != null) {
				this.currentSubMenu.setStyles({
					'display': 'block'
				});
			}
		}
	},
	onMenuTabOut: function(event) {
		this.tracer('onMenuTabOut');
		
		var eventTargetTree = $(event.target).getParents();
		
		var menuTab = eventTargetTree[(eventTargetTree.indexOf(this.menuElement) - 1)];
		
		if(($(event.relatedTarget) != null) && (menuTab != $(event.relatedTarget)) && ($(event.relatedTarget).getParents().indexOf(menuTab) == -1)) {
			// hides the block
			this.hideCurrentSubMenu();
		}
		
	},
	tracer: function(toTrace) {
		//console.log(toTrace);
	}
});

/*
window.addEvent('domready', function() { 
	
	var myMenu = new Menu({elementId:'menu'});
	
});
*/