
function CssMenuCreator()
{
	this.writer	= document;
	this.create	= function ( menu )
	{
		if( ! menu.menuStyle )
			menu.menuStyle = new MenuStyle();
		var ms = menu.menuStyle;
		menu._resolveMenuStyle( ms );
		
		document.write( "<DIV id=\"" + menu.id + "_anchor\" class=" + ms.barCss + " onlosecapture=\"__menus[ '" + menu.id + "' ].collapse();\" style=\"width:" + menu.width + "\">" );
		document.write( "<TABLE border=0 cellspacing=0 cellpadding=0 onselectstart=\"return false;\">\n\n" );

		if( menu.orientation == "horizontal" )
		{
			document.write( "<TR>\n" );
		}
		for( var index = 0; index < menu.items.length; index++ )
		{
			if( menu.orientation != "horizontal" )
			{
				document.write( "<TR>" );
			}
			
			var item = menu.items[ index ];
			if( item.menuStyle == null )
				item.menuStyle = menu.menuStyle;
			item._elements = new Array();
			document.write( "<TD class=" + ms.barItemCss + " style=\"z-index: 99\" id=" + item.id + "_container onclick=\"__menus[ '" + menu.id + "' ].onclick( arguments[ 0 ] );\" onmouseover=\"__menus[ '" + menu.id + "' ].onmouseover( arguments[ 0 ] );\" onmouseout=\"__menus[ '" + menu.id + "' ].onmouseout( arguments[ 0 ] );\" onmousedown=\"__menus[ '" + menu.id + "' ].onmousedown( arguments[ 0 ] );\" onmouseup=\"__menus[ '" + menu.id + "' ].onmouseup( arguments[ 0 ] );\">" );
			document.write( item.text );
			document.write( "</TD>\n" );
		
			if( menu.orientation != "horizontal" )
			{
				document.write( "</TR>\n" );
			}			
		}
		if( menu.orientation == "horizontal" )
		{
			document.write( "</TR>\n" );
		}
		
		document.write( "</TABLE>\n" );
	
		for( var index = 0; index < menu.items.length; index++ )
		{
			menu.items[ index ]._elements[ EL_CONTAINER ] = _getElement( menu.items[ index ].id + "_container", this.writer );
			this._createChildItems( menu.items[ index ] );
		}		
		document.write( "</DIV>" );
		
		menu._element	= _getElement( menu.id + "_anchor", this.writer );
		
	}
	
	
	this._createChildItems = function( item )
	{
	
		if( item.items.length == 0 )
			return;

		var ms = null;
		for( var owner = item; owner != null && ms == null; owner = owner._parent )
		{
			ms = owner.menuStyle;
		}
		
		item.menuStyle = ms;

			
		this.writer.write( "<SPAN id=" + item.id + "_children style=\"position: absolute; z-index: 100; visibility: hidden; \" class=" + ms.popUpCss + " onselectstart=\"event.cancelBubble = true;return false;\">" );
		this.writer.write( "<TABLE border=0 cellpadding=0 cellspacing=0 >" );
		for( var index = 0; index < item.items.length; index++ )
		{
			this._createItem( item.items[ index ] );
		}
		this.writer.write( "</TABLE>\n" );
		this.writer.write( "</SPAN>" );
		item._elements[ EL_CHILD ]		= _getElement( item.id + "_children", this.writer );

		for( var child = 0; child < item.items.length; child++ )
		{
			this._createChildItems( item.items[ child ] );
		}		
	}
	
	
	this._createItem		= function( item )
	{
		if( ! item.menuStyle )
			item.menuStyle = item._parent ? item._parent.menuStyle : item._menu.menuStyle;
		var ms = item.menuStyle;
		item._elements = new Array();
		this.writer.write( "<TR id=" + item.id + "_container class=" + ms.itemCss + " >" );
		if( item._isSeparator )
		{
			if( ! ms.separatorSpansIcon )
			{
				this.writer.write( "<TD class=" + ms._iconAreaSepCss + " style=\"padding: 3px;\" id=" + item.id + "_iconArea></TD>" );
			}
			this.writer.write( "<TD class=" + ms._textSepCss + " style=\"padding: 3px;\" id=" + item.id + "_text colspan=" + ( ms.separatorSpansIcon ? 3 : 2 ) + "><DIV style=\"overflow: hidden;\" class=" + ms.separatorCss + "></DIV></TD>");
		}
		else if( item._controlHtml )
		{
			if( ! item._controlSpansIcon )
			{
				this.writer.write( "<TD class=" + ms._iconAreaSepCss + " style=\"padding: 3px;\" id=" + item.id + "_iconArea></TD>" );
			}
			this.writer.write( "<TD class=" + ms._textSepCss + " style=\"padding: 3px;\" id=" + item.id + "_text colspan=" + ( item._controlSpansIcon ? 3 : 2 ) + ">" + item._controlHtml + "</TD>");		
		}
		else
		{
			this.writer.write( "<TD class=" + ( ms.usesIcons && item.checked ? ms._iconAreaCheckedCss : ms.iconAreaCss ) + " id=" + item.id + "_iconArea width=\"0%\">" );
			if( ms.usesIcons )
			{
				if( item.icon != null && item.icon.length > 0 )
				{
					this.writer.write( "<IMG src=\"" + item.icon + "\" class=" + ms.iconCss + " id=" + item.id + "_icon>" );
					item._elements[ EL_ICON ] = _getElement( item.id + "_icon", this.writer );
				}
				else
				{
					this.writer.write( "<DIV style=\"width: " + ms.iconWidth + "; height: " + ms.iconHeight + "\">&nbsp;</DIV>" );
				}
			}
			else
			{
				this.writer.write( "<IMG src=\"" + ms.checkedIcon + "\" id=" + item.id + "_check style=\"visibility: " + ( item.checked ? "" : "hidden" ) + ";\">" );
				item._elements[ EL_CHECK ] = _getElement( item.id + "_check", this.writer );
			}
			this.writer.write( "</TD>" );
			this.writer.write( "<TD class=" + ( item.checked ? ms._textCheckedCss : ms.textCss ) + " id=" + item.id + "_text nowrap >" + item.text );
			this.writer.write( "</TD>" );
			this.writer.write( "<TD id=" + item.id + "_chevron class=" + ms.chevronAreaCss + ">" );
			if( item.items.length > 0 )
			{
				this.writer.write( "<IMG src=\"" + ms.chevronIcon + "\" align=absmiddle>" );
			}
			else
			{
				this.writer.write( "&nbsp;" );
			}
			this.writer.write( "</TD>" );		
		}
		this.writer.write( "</TR>\n" );

		item._elements[ EL_CONTAINER ] = _getElement( item.id + "_container", this.writer );
		item._elements[ EL_TEXT ] = _getElement( item.id + "_text", this.writer );
		item._elements[ EL_ICONAREA ] = _getElement( item.id + "_iconArea", this.writer );
		item._elements[ EL_CHEVRON ] = _getElement( item.id + "_chevron", this.writer );
		return item;
	}
	
}   
