var DropdownMenuItem = newClass (null, {
	constructor: function(parentMenu, node) {
		this.parentMenu = parentMenu;
	
		this.node = node;
		for (var i = 0; i < this.node.childNodes.length; i++) {
			var child = this.node.childNodes[i];
			if (child.className == "menu-link")
				this.link = child;
			if (child.className == "top-category-menu")
				this.menu = child;
		}
		
		this.menuShowed = false;

		
		addEvent (this.link, "mouseover", this.onMouseOver.bind(this) );
		addEvent (this.menu, "mouseover", this.onMouseOver.bind(this) );
		
		var mo = function(e) { fixOnMouseOut(this.menu, e, this.onMouseOut.bind(this)) };
		var lo = function(e) { fixOnMouseOut(this.link, e, this.onMouseOut.bind(this)) };
		addEvent (this.menu, "mouseout", mo.bind(this) );			
		addEvent (this.link, "mouseout", lo.bind(this) );
	},
	
	showMenu: function() {
		this.parentMenu.setActiveItem (this);
		addClass (this.node, "showmenu");
		this.menuShowed = true;
	},
	
	hideMenu: function() {
		removeClass (this.node, "showmenu");
		this.menuShowed = false;
	},
	
	menuActive: function() {
	},
	
	onMouseOver: function () {
		if (this.hideTimer) {
			clearTimeout (this.hideTimer);
			this.hideTimer = null;
		}
		if (!this.menuShowed)
			this.showMenu();
	},
	
	onMouseOut: function () {
		this.hideTimer = setTimeout (this.hideMenu.bind(this), 100);
	}
});

var DropdownMenu = newClass (null, {
	constructor: function(id) {
		this.elem = $(id);
		this.menuItems = new Array();
		for (var i = 0; i < this.elem.childNodes.length; i++) {
			var node = this.elem.childNodes[i];
			if (node.className != "menu-item")
				continue;
			this.addMenuItem(node);
		}
	},
		
	addMenuItem: function(node) {
		this.menuItems.push(new DropdownMenuItem(this, node));
	},
	
	setActiveItem: function(item) {
		if (this.activeItem && this.activeItem != item) {
			this.activeItem.hideMenu();
		}
		this.activeItem = item;
	}
});