var Menu = function() {
	// for testing. stops the mouseout action
	var freeze = false;

	function genMenuItem(itemData, level) {
		// generate the title (span)
		var $title;
		if (itemData.href) {
			$title = $("<a>");
			$title.attr("href", itemData.href);
		}
		else {
			$title = $("<span>");
		}
		$title.addClass("title");
		if (itemData.title) {
			$title.html(itemData.title);
		}

		;
		// generate the menu item (a <li>)
		var $menuItem = $("<li>");
		$menuItem
			.addClass("menu_item menu_item" + level)
			.append($title);
			;
		if (itemData.classes) {
			$menuItem.addClass(itemData.classes);
		}
		// if the item has children, generate the sub menu
		if (itemData.items) {
			var $sub_menu = genMenu(itemData.items, (level+1));
			$menuItem
				.addClass("composite")
				.append($sub_menu)
			;
		}
		return $menuItem;
	}
	// generate the top level menu, AKA tabs
	function genMenu(menuData, level) {
		if (!level) { level = 1; }

		var $menu = $("<ul>");
		$menu.addClass("menu menu" + level);

		for (var i = 0; i < menuData.length; i++) {
			if (i > 0 && level == 2) {
				var $separator = $("<li>");
				$separator.addClass("separator").text("|");
				$menu.append($separator);
			}

			var itemData = menuData[i];
			var $item = genMenuItem(itemData, level);
			if (i == 0) {
				$item.addClass("first");
			}
				$menu.append($item);
		}
		// delays the reset of the hovered menu by 700 milliseconds
		// to allow the mouse to skip over gaps in the menu
		var resetDelayer = new Delayer(700, function() {
			$menu.find(".hover").removeClass("hover");
			$menu.find(".on").addClass("hover");
		});

		$menu.delegate(".menu_item", "mouseover", function() {
			$(this).siblings().add(".hover").removeClass("hover");
			if ($(this).hasClass("composite") && $(this).hasClass("menu_item2")) {
				var self = this;
				$(this).find(".menu3").slideDown("fast", function() {
					$(this).removeAttr("style");
					$(self).addClass("hover");
				});
			}
			else {
				$(this).addClass("hover");
			}
			resetDelayer.reset();
		});
		$menu.bind("mouseout", function() {
			resetDelayer.trigger();
		});
		return $menu;
	}

	// menuDelay: new Delay(1500, function() { Menu.reset(); }),
	return {
		// initialize the menu
		init: function(activeItem) {
			var $menu = genMenu(MENU_DATA);
			$menu.find(activeItem).addClass("on hover");
			var $container = $("#menu_container");
			$container.empty().append($menu);
		}
	};

}();




















