/* 
	-- Version
	1.00a
	-- Updates
	u0001 - Firefox supported (Feb 14, 06)
	-- Bugs
	b0001 - Submenu differences with IE and FF
	b0002 - Hack applied for submenu top position (-5px hardcoded for FF)
	b0003 - Dropdown arrow is not center aligned in FF
	b0004 - Vertical menu breaks browser
	*/

	var SubMenu = Class.create();
	SubMenu.prototype = {
		initialize: function(title,href,iconpath,ajax,onclick) {
			this.title = title;
			this.href = href;
			this.iconpath = iconpath;
			this.ajax = ajax;
			this.onclick=onclick;
			this.initialized = true;
		},
		click : function (event)
		{
			if (this.ajax) {
				Effect.Fade(this.parentmenu.submenu,{duration:0.3});
				this.parentmenu.submenu = null;
				new Ajax.Updater(this.container, this.href, { onComplete: this.onclickCallback(), asynchronous:true, evalScripts:true });
			}
			else {
				if (this.onclick)
					eval(this.onclick);
				window.location = this.href;
			}
		},
		onclickCallback : function (event)
		{
			eval(this.onclick);	
		}
	}

	var Menu = Class.create();
	Menu.prototype =  {
		initialize: function(handle, submenus, container) {
			this.handle = $(handle);
			this.submenus = submenus;
			this.submenu = null;
			this.isopen = false;
			this.container = container;
			if (this.container == null) {
				this.container = handle;
			}
			
			this.options =  Object.extend({ isContext:'false', iconWidth:0, iconHeight:0, submenuOpen:'vertical', submenuOrientation:'below' }, arguments[2] || {});

			this.eventMouseDown = this.open.bindAsEventListener(this);
			this.eventContext = this.openContext.bindAsEventListener(this);
			this.documentMouseDown = this.documentClick.bindAsEventListener(this);

			if (this.options.isContext == 'true')
				Event.observe(this.handle,"contextmenu",this.eventContext);
			else
				Event.observe(this.handle, "click", this.eventMouseDown);
			Event.observe(document,"mousedown",this.documentMouseDown);

			for (var i=0;i<this.submenus.length;i++) {
				this.submenus[i].container = container;
				this.submenus[i].parentmenu = this;
			}
			this.initialized = true;	
		},
		openContext : function(event) {
			this.open(event);
			Event.stop(event);
		},
		open : function(event) {
			//$A(document.getElementsByTagName('select')).each(function (el) { el.style.visibility ="hidden"; });
			this.submenu = document.getElementById('submenu' + this.container);
			if (this.submenu != null) {
				document.body.removeChild(this.submenu);
			}
			this.submenu = document.createElement("span");
			this.submenu.className = 'submenu';
			this.submenu.id = "submenu" + this.container;
			var ul = this.submenu.appendChild(document.createElement("ul"));
			this.submenu.appendChild(ul);
			Element.hide(this.submenu);
			document.body.appendChild(this.submenu);
			// menuitem
			for (var i=0;i<this.submenus.length;i++)
			{
				this.submenus[i].menu = this;
				var li = document.createElement("li");
				ul.appendChild(li);
				var a = document.createElement("a");
				a.className = "submenuitem";
				a.title = this.submenus[i].title;
				Event.observe(a,"mousedown",this.submenus[i].click.bindAsEventListener(this.submenus[i]));

				// icon
				if (this.submenus[i].iconpath.length > 0)
				{
					var img = document.createElement("img");
					if (this.options.iconWidth != '0')
						img.style.width=this.options.iconWidth;
					if (this.options.iconHeight != '0')
						img.style.height=this.options.iconHeight;		
					img.src=this.submenus[i].iconpath;
					a.appendChild(img);
				}
				// test
				var span = document.createElement("span");
				span.innerHTML = this.submenus[i].title;
				a.appendChild(span);
				li.appendChild(a);
				// TODO:breaks browser, fix
				/*if (false || this.options.submenuOpen == "vertical")
					li.style.float='left'; */
			}
			if (true)
			{
				var pointer = [Event.pointerX(event), Event.pointerY(event)];
				this.submenu.style.left = pointer[0] + 10 + "px";
				this.submenu.style.top = pointer[1] - 10 + "px";
			} 
			else
			{
				// we redo the positioning everytime incase the element has changed position since last opening
				this.submenu.style.left = this.currentLeft()+"px";
				// subtract 5px from height for FF, perhaps offsetHeight isnt the proper property to use here?
				this.submenu.style.top = this.currentTop()+parseInt(this.handle.offsetHeight)-(document.all ? 1 : 5)+"px";
			}
			this.handle.parentNode.className += ' menuitem-container-open';
			Effect.Appear(this.submenu,{duration:0.3});
			this.isopen = true;
		},
		close : function(event) {
			this.isopen = false;
			if (this.handle.parentNode != null)
				this.handle.parentNode.className = this.handle.parentNode.className.replace(' menuitem-container-open','');
			Effect.Fade(this.submenu,{duration:0.3});
			//$A(document.getElementsByTagName('select')).each(function (el) { el.style.visibility ="visible"; });
		},	  
		currentLeft: function() {
			return parseInt(this.handle.parentNode.style.left || '0')  + Position.cumulativeOffset(this.handle.parentNode)[0];
	 	},
	 	currentTop: function() {
			return parseInt(this.handle.parentNode.style.top || '0') + Position.cumulativeOffset(this.handle.parentNode)[1];
		},
		isContained : function (el) {
			if (el == this.handle)
				return true;	
			while (el.parentNode != null)
			{
				if (el.parentNode == this.handle)
					return true;
				else
					el = el.parentNode;
			}
			return false;
		},
		documentClick : function (event) {
			if (this.submenu != null && !this.isContained(Event.element(event)))
				this.close();
			if (!Event.isLeftClick(event))
				Event.stop(event);
		}
	}