MenuItem = Class.create({
	initialize: function(name, sub_menu_item_list, onclick) {
		this.name = name;
		this.sub_menu_item_list = sub_menu_item_list;
		this.onclick = onclick;
	},
	
	menuDOM: function(menu) {
		var li = new Element('li', { id: this.item_id });
		var link = new Element('a', { href: '' }).update(this.name);
		li.appendChild(link);
		return li;
	},
	
	addMenuListeners: function(menu) {
		Event.observe(this.item_id, 'click', this.click.bindAsEventListener(this));
	},
	
	click: function(event) {
		event.preventDefault();
		if (this.onclick) {
			this.onclick();
			closeMenu(true);	
		} else if (this.sub_menu_item_list) {
			
		}
	}
})

MenuItem.normal = function(name, onclick) {
	return new MenuItem(name, null, onclick);
}

MenuItem.subMenu = function(item_id, name, sub_menu_item_list) {
	return new MenuItem(name, sub_menu_item_list, null);
}

Menu = Class.create({
	initialize: function(menu_id, small, items) {
		this.menu_id = menu_id;
		this.menu_button_id = "menu_button_" + menu_id;
		this.small = small;
		this.items = items;
		this.items.each(function(item, index) {
			item.item_id = menu_id + "_item_" + index;
		})
	},
	
	menuDOM: function() {
		var element = new Element('div', { id: this.menu_id, 'class': 'inline_menu',
		 																	 style: 'display:none' });
		var container = new Element('div', { 'class': 'menu_container' });
		element.appendChild(container);
		
		container.appendChild(new Element('div', { 'class': 'menu_header' }));
		var list_container = new Element('div', { 'class': 'menu_items_container' });
		container.appendChild(list_container);
		var list = new Element('ul');
		list_container.appendChild(list);
		
		this.items.each(function(item) {
			list.appendChild(item.menuDOM(this));
		}.bind(this));
		
		var footer = new Element('div', { 'class': 'menu_footer'});
		footer.appendChild(new Element('div', { 'class': 'left'}));
		element.appendChild(footer);
		
		return element;
	},
	
	addDOM: function() {
		var current_menu = $$('#popup_menu_container .inline_menu').first();
		if (current_menu) {
			$('popup_menu_container').replaceChild(this.menuDOM(), current_menu);
		} else {
			$('popup_menu_container').appendChild(this.menuDOM());
		}
	},
	
	buttonDOM: function(buttonText) {
		var element = new Element('a', { id: this.menu_button_id,
																		 'class': 'more_button', href: '' });
		var content = new Element('span', {id: this.menu_button_id + '_content'})
		content.update(buttonText)
		element.appendChild(content);
		return element;
	},
	
	updateButtonText: function(buttonText) {
		var element = $(this.menu_button_id + '_content');
		if (element) {
			element.update(buttonText);
		}
	},
	
	addMenuListeners: function() {
		this.items.each(function(item) {
			item.addMenuListeners(this);
		}.bind(this));
	},
	
	addButtonListener: function() {
		Event.observe('menu_button_' + this.menu_id, 'click', this.show.bindAsEventListener(this));
	},
	
	show: function(event) {
		event.preventDefault();
		if (!$(this.menu_id)) {
			this.addDOM();
			this.addMenuListeners();
		}
		showMenu(this.menu_id, 'menu_button_' + this.menu_id, this.small);
	}
});

var active_menu_id = null;
function showMenu(menu_id, position_element_id, small) {
	height = small ? 20 : 24
	closeMenu(false);
  var pos = position($(position_element_id));
  x = pos[0];
  y = pos[1];
  moveElement(menu_id, x + 3, y + height);
	Element.show('popup_menu_overlay');
	if (isIE()) { toggleSelectVisibility(false); }
	// Effect.SlideDown(menu_id, {duration: 0.2});
	Element.show(menu_id);
	active_menu_id = menu_id;
}

var active_submenu_id = null;
function showSubmenu(submenu_id, parent_menu_element_id) {
	closeSubmenu();
	var pos = position($(parent_menu_element_id));
  var width = $(parent_menu_element_id).offsetWidth;
	x = pos[0];
	y = pos[1];
	moveElement(submenu_id, x + width, y - 4);
	Element.show(submenu_id);
	active_submenu_id = submenu_id;
}

function closeSubmenu() {
	if (active_submenu_id != null) {
		Element.hide(active_submenu_id);
		active_submenu_id = null;
	}
}

function closeMenu(hideOverlay) {
	closeSubmenu();
	if (active_menu_id != null) {
		Element.hide(active_menu_id);
		active_menu_id = null;
	}
	if (hideOverlay) {
		Element.hide('popup_menu_overlay');
		actionMenuActive = false;
		$$('.menu_active').each(function(el) {hideObjectActions(el)});
		if (isIE()) { toggleSelectVisibility(true); }
	}
}