Menu = Class.create();
Object.extend(Menu, {
	load: function() {
		if ($('nav'))
			Menu.control = new Menu();
	}
});
Object.extend(Menu.prototype, {
	initialize: function() {
		this.items = $('nav').getElementsByTagName("li");

		if (navigator.userAgent.indexOf("AppleWebKit")!="-1") {
			this.webkit = true;
			this.objects = document.getElementsByTagName("embed");
		} else {
			this.webkit = false;
		}

		$A(this.items).each(function(item){
			Event.observe(item, 'mouseover', this.show_submenu.bindAsEventListener(item));
			Event.observe(item, 'mouseout', this.hide_submenu.bindAsEventListener(item));

			if (this.webkit) {
				Event.observe(item, 'mouseover', this.safari_flash_fix.bind(this));
				Event.observe(item, 'mouseout', this.safari_flash_fix.bind(this));
			}
		}.bind(this));
	},
	show_submenu: function(e) {
		Element.addClassName(this, "hover");
	},
	hide_submenu: function(e) {
		Element.removeClassName(this, "hover");
	},
	safari_flash_fix: function() {
		/* This is a nasty hack to prevent rollover menus from colliding
		   with Flash (or _any_ <embed>) elements in Safari */
		for (var i=0; i<this.objects.length; i++)
		    this.objects[i].style.color = (this.objects[i].style.color == "transparent")? "#fff" : "transparent";
	}
});

Event.observe(this.window, 'load', Menu.load);
