function SubMenuItem( menuItem, offsrc, onsrc, href )
{
	this._menuItem = menuItem;
	this._element = document.createElement( "div" );
	this._element.className = "subMenuItem";
	var a = document.createElement( "a" );
	a.href = href;
	var img = document.createElement( "img" );
	img.src = offsrc;
	img.offsrc = offsrc;
	img.onsrc = onsrc;
	
	this.ImageOn = function()
	{
		img.src = img.onsrc;
	};
	
	this.ImageOff = function()
	{
		img.src = img.offsrc;
	};
	
	var self = this;
	
	img.onmouseover = function()
	{
		self.ImageOn();
	};
	
	img.onmouseout = function()
	{
		if ( self._menuItem._currentSubItem != self )
		{
			self.ImageOff();
		}
	};
	
	a.onclick = function()
	{
		if ( self._menuItem._currentSubItem && self._menuItem._currentSubItem != self )
		{
			self._menuItem._currentSubItem.ImageOff();
		}
		self.ImageOn();
		self._menuItem._currentSubItem = self;
	};
	
	a.appendChild( img );
	
	this._element.appendChild( a );
	
	this.Render = function( container )
	{
		container.appendChild( this._element );
	}
}

function MenuItem( menu, src, href )
{
	this._items = [];
	this._menu = menu;
	this._currentSubItem = null;
	
	this._element = document.createElement( "div" );
	this._element.className = "menuItem";
	var img = document.createElement( "img" );
	img.src = src;
	if ( href )
	{
		var a = document.createElement( "a" );
		a.appendChild( img );
		a.href = href;
		this._element.appendChild( a );
	}
	else
	{
		this._element.appendChild( img );
	}
	
	this._itemsElement = document.createElement( "div" );
	this._itemsElement.style.display = "none";
	
	var self = this;
	this._element.onmouseover = function()
	{
		if ( self._menu._currentItem && self._menu._currentItem != self )
		{
			self._menu._currentItem._itemsElement.style.display = "none";
			if ( self._menu._currentItem._currentSubItem )
			{
				self._menu._currentItem._currentSubItem.ImageOff();
				self._menu._currentItem._currentSubItem = null;
			}
		}
		
		self._menu._currentItem = self;
		self._itemsElement.style.display = "block";
	}
	
	this.AddItem = function( offsrc, onsrc, href )
	{
		var subItem = new SubMenuItem( this, offsrc, onsrc, href );
		this._items[this._items.length] = subItem;
		return subItem;
	};
	
	this.Render = function( menuContainer, subMenuContainer )
	{
		menuContainer.appendChild( this._element );
		
		for ( var i = 0; i < this._items.length; i++ )
		{
			this._items[i].Render( this._itemsElement );
		}
		
		subMenuContainer.appendChild( this._itemsElement );
	};
}


function Menu()
{
	this._items = [];
	this._currentItem = null;

	this.AddItem = function( src, href )
	{
		var item = new MenuItem( this, src, href );
		this._items[this._items.length] = item;
		return item;
	};
	
	this.Render = function( menuContainer, subMenuContainer )
	{
		for ( var i = 0; i < this._items.length; i++ )
		{
			this._items[i].Render( menuContainer, subMenuContainer );
		}
	};
};