var Menu = Class.create({
	initialize: function() {
		this.init();
		var menu = this;
	},
	init: function() {
		var sfEls = $$('#nav li');
		var sfElsA = $$('#nav a');
		for (var i=0; i<sfEls.length; i++) {
			if (sfEls[i].down('ul')) { 
				new Effect.Opacity(sfEls[i].down('ul'), {duration: 0, from: 1, to:0});
				
				sfEls[i].observe(this.useEvent['mouseover'], function(event){
					menu.openMenu(this);
				});
				sfEls[i].observe(this.useEvent['mouseout'], function(event){
					menu.closeMenu(this);
				});
			}
		}
	},
	
	openMenu: function(el) {
		Element.setStyle(el.down('ul'),{left: 'auto'})
		if (el.down('ul').getStyle('opacity') == 0) {
			new Effect.Opacity(el.down('ul'), {duration: 0.5, from: 0, to:1});
		}
			
	},
	closeMenu: function(el) {
		Element.setStyle(el.down('ul'),{left: '-9999px'})
		
		this.closeDelayTimer = setTimeout(function(){ 
			if (el.down('ul').getStyle('left') == '-9999px') {
				new Effect.Opacity(el.down('ul'), {duration: 0, from: 1, to:0});
			}
		}, 10 );
		
	 	
	},
	
	useEvent: (function(IE) { return {
		'mouseover': (IE ? 'mouseenter' : 'mouseover'),
		'mouseout': (IE ? 'mouseleave' : 'mouseout'),
		'mouseenter': (IE ? 'mouseenter' : 'mouseover'),
		'mouseleave': (IE ? 'mouseleave' : 'mouseout')
		};})(Prototype.Browser.IE)
});



function initMenu() {
	menu = new Menu();
}

var console;
function echo(msg) {
	if (console) {
		console.log(msg);
	}
}

Event.observe(window, 'load', initMenu, false);