/**********************************************************************************
 * Written By: Tu Quang Le (leqtu@msn.com)
 * 
 * 26 Jan 2006
 *
 * Last Update: 18 March 2006, 9:30AM
 *			
 *
 * public methods
 *
 * MainMenu.MenuItems.Add()
 * MenuItem.MenuItems.AddRange()
 *
 * MenuItem.MenuItems.Add()
 * MenuItem.MenuItems.AddRange()
 * MainMenu.Render()
 **********************************************************************************/

var MenuItemType = {MenuItem:0x01, Separator: 0x02};
var MouseType = {Normal:0x01, Hover:0x02, Press:0x04};
var Alignment = { Horizontal: 0, Vertical: 1};
var MainMenuType = {Text:0x01, Image: 0x02 }

var isNS = navigator.userAgent.indexOf('Gecko') != -1 ? true : false;

var g_curMainMenuItem = null;
var g_curMainMenuItemCell = null;
var g_curMenuItem = null;
var g_curDivMenu = null;
var g_timerID = null;
var g_menuHiddenTime = 400;
//


var MENUITEM_IMAGE_COLUMN_VISIBLE = false;
 
/**** @: MainMenu *******************/ 
MainMenu = function()
{
	this.ID = 'MainMenu';
	this.Name = 'MainMenu';
	this.Index = 0;
	this.IsParent = false;
	this.Parent = null; //root
	this.Alignment = Alignment.Horizontal;
	this.MenuOffsetY = 0;
	this.MenuOffsetX = 0;
	this.MainMenuType = MainMenuType.Text;
	this.Separator = '';
	this.ShowShadow = false;
			
	var coll = new MenuItemCollection();
	coll.Parent = this; //!!!
	
	this.MenuItems = coll;
		
	//html
	this.Coordinates = {X:0, Y:0};
	this.DivContainer = null;
	this.zIndex = 10;

	window.MainMenu = this;	

	__InitCss();	
}

/**** @: MenuItemCollection *******************/
function MenuItemCollection()
{
	this.Count = 0;	
	this._list = new Array();
}

MenuItemCollection.prototype.Add = function( oMenuItem )
{		
	var id = '';
		
	if( !(this.Parent instanceof MenuItem) )  // MainMenu
		id = oMenuItem.ID != '' ? oMenuItem.ID : 'MainMenu' + this.Parent.Index
	else  // MenuItem
		id = this.Parent.ID + (oMenuItem.ID != '' ? oMenuItem.ID : '-menuItem' + this.Parent.Index);				
	
	this.Parent.IsParent = true; // contains child menu items
					
	oMenuItem.ID = id;	
	oMenuItem.Parent = this.Parent;	
	oMenuItem.Parent.Index++;
	oMenuItem.zIndex = this.Parent.zIndex + 2;
	
	this._list[ this._list.length ] = oMenuItem;		
	this.Count = this._list.length;

	if( oMenuItem.IsParent )
		oMenuItem.UpdateChildId();
}

MenuItemCollection.prototype.AddRange = function( /* separate list of MenuItem */ )
{
	for(var i=0; i<arguments.length; i++ ) 
	{
		var mi = arguments[i];		
		
		if( mi instanceof MenuItem )		
			this.Add( mi );
	}
}

MenuItemCollection.prototype.GetMenuItem = function( index ) { return this._list[ index ];}
MenuItemCollection.prototype.Item = function( index ) { return this._list[ index ];}

MenuItemCollection.prototype.FindById = function( id )
{
	for(var i=0; i<this._list.length; i++ )
	{
		if( this._list[i].ID == id )
			return this._list[i];
		
		var mi = this._list[i].MenuItems.FindById( id );
		
		if( mi && mi.ID == id )
			return mi;					
	}	
	return null;
}

/**** @: MenuItem *******************/
function MenuItem(text, url, width, tipText)
{
	this.Name = text;
	this.Text = text;
	this.Index = 0;	
	this.ID = ''; //'-menuItem';
	this.Url = url;
	this.TipText = tipText || '';
	//this.PtrFunction = pFunc;
	this.Width = typeof(width) != 'undefined' ? width : 150;
	this.Type = typeof(text) == 'string' ? MenuItemType.MenuItem : MenuItemType.Separator;
	
	this.Parent = null;
	this.IsParent = false;
	
	var coll = new MenuItemCollection();
	coll.Parent = this; //!!!
	
	this.MenuItems = coll;
	this.Visible = false;
	this.Coordinates = {X:0, Y:0, Width:0, Height:0};
	this.zIndex = 0;
	
	this.IdleTimerID = null;
	this.IdleCount = 0;
	
	this.KillTimer = function() 
	{ 
		window.clearInterval(this.IdleTimerID);
		this.IdleTimerID = null;
		
		this.IdleCount = 0;
	}

	return this;
}

MenuItem.prototype.UpdateChildId = function()
{
	if( this.IsParent ) // reset child menu item IDs
	{				
		for(var i=0; i<this.MenuItems.Count; i++)
		{
			var mi = this.MenuItems.GetMenuItem(i);
			
			mi.ID = this.ID + '-menuItem' + i;
			mi.zIndex = mi.Parent.zIndex + 2;
			
			if( mi.IsParent ) // contains child menu items?
				mi.UpdateChildId();				
		}			
	}
}

/**** MainMenu property/method ************************************/
MainMenu.prototype.CreateHtmlMainMenuBar = function( divId ) // not direct call
{
	var html = '';
	var sCss = CSS_MAINMENU_ITEM_NORMAL;
	
	html += '<div style="' + CSS_MAINMENU_BAR_STYLE + '">';
	html += '<table border=0 cellSpacing="0" cellPadding="2" style="cursor:default;">';
	
	if( window.MainMenu.Alignment == Alignment.Horizontal )
	    html += '<tr><td style="' + CSS_MAINMENU_ITEM_NORMAL_BORDER_ALL + ';padding-left:0px;padding-right:0px;" height="21"><img src="" width="1" height="1"></td>';
		
	for(var i=0; i<this.MenuItems.Count; i++) 
	{
		var mi = this.MenuItems.Item(i);

        if( window.MainMenu.Alignment != Alignment.Horizontal )
            html += '<tr>';
        
		html += '<td style="' + sCss + '" class="MainMenu-Item" ' + 
				' onMouseUp="OnMainMenuItem_MouseUp(event, \'' + mi.Url + '\',' + mi.IsParent + ')"' +
				' onMouseOut="OnMainMenuItem_MouseOut(event)" ' +
				' onMouseOver="OnMainMenuItem_MouseOver(event,\'' + mi.ID + '\')">' + mi.Text + '</td>';
				
		if( this.Separator != null || this.Separator != '' )
            html += '<td>' + this.Separator + '</td>';				

        if( window.MainMenu.Alignment != Alignment.Horizontal )
            html += '</tr>';

	}
	
    if( window.MainMenu.Alignment == Alignment.Horizontal )
        html += '</tr>';
	
	html += '</table></div>';

	return html;
}
  
MainMenu.prototype.Render = function( divId ) {
	this.DivContainer = document.getElementById( divId );
	this.DivContainer.innerHTML = this.CreateHtmlMainMenuBar();
	
	__applyCssToMainMenu();
}

MainMenu.prototype.AppendChild = function(el) {
	this.DivContainer.insertBefore(el, null);
}

/**** MenuItem property/method ************************************/
 
MenuItem.prototype.CreateHtmlMenu = function()
{
	if( !this.IsParent ) return; // does not contain child menu item
	
	var divMenu = document.getElementById( this.ID );
	
	if( divMenu ) 
		return divMenu;
	
	divMenu = document.createElement('DIV');
	divMenu.id = this.ID;
	divMenu.className = 'Menu';
	
	with( divMenu.style )
	{
	    cssText = CSS_DIV_MENU;	
	    position = 'absolute';
	    display = 'none';
	    cursor = isNS ? 'default' : 'hand';
	    padding = '1px';
	    width = this.Width + 'px';
    }	   
	
	var html = '';
	
	html += '<div class="Arrow-Up" style="display:none;border:1px solid dimgray;text-align:center;"><font face="webdings" size="-6">&#53;</font></div>';
	html += '<div class="Menu-Text" style="overflow:hidden;">';
	html += '<table width="100%" cellSpacing="1" cellPadding="0">';
		
	for(var i=0; i<this.MenuItems.Count; i++ ) {
		var mi = this.MenuItems.Item(i);
		
		if( mi instanceof MenuItem )
			html += '<tr><td>' + mi.CreateHtmlMenuItem() + '</td></tr>';
	}	
	
	html += '</table></div>';
	html += '<div class="Arrow-Down" style="display:none;border:1px solid dimgray;padding:1px;text-align:center;"><font face="webdings" size="-6">&#54;</font></div>';
	
	divMenu.innerHTML = html;
	divMenu.oncontextmenu = new Function('return false;');
	divMenu.onselectstart = new Function('return false;');
	
	// create shadow
	if( this.Parent.ShowShadow ) 
	{
	    var divShadow = document.createElement('DIV');
	    divShadow.id = this.ID + '-shadow';
	    divShadow.className = 'Menu-Shadow';
	    
       	document.body.appendChild( divShadow );
    }
    
	document.body.appendChild( divMenu );
	
	return divMenu;
}
 
MenuItem.prototype.CreateHtmlMenuItem = function()
{
	var url = typeof(this.Url) != 'undefined' ? this.Url : '';
 	var html = '';
 	
 	if( this.Type == MenuItemType.MenuItem )
 	{
 		html += '<table MenuItemId="' + this.ID + '" class="Menu-Item" border="0" cellSpacing="0" cellPadding="0" width="100%" title="' + this.TipText + '" ';
 		html += ' onMouseUp="OnMenuItem_MouseUp(event, \'' + this.Parent.ID + '\',\'' + this.ID + '\', \'' + url + '\')" ';
 		html += ' onMouseDown="OnMenuItem_MouseDown(event, \'' + this.Parent.ID + '\',\'' + this.ID + '\')" ';
 		html += ' onMouseOut="OnMenuItem_MouseOut(event, \'' + this.Parent.ID + '\',\'' + this.ID + '\')" ';
 		html += ' onMouseOver="OnMenuItem_MouseOver(event, \'' + this.Parent.ID + '\',\'' + this.ID + '\')"><tr>';
		
		html += '<td align="left" style="' + CSS_NORMAL_TEXT_COLUMN + '" class="MenuItem-Text-Column">' + this.Text + '</td>';
		html += '<td width="10" align="right" style="' + CSS_NORMAL_SUBMENU_COLUMN + '" class="MenuItem-SubMenu-Column"><font face="webdings" size="1">' + (this.IsParent ? '&#52;' : '&nbsp;') + '</font></td>';
		html += '</tr></table>';
	}
	else if( this.Type == MenuItemType.Separator )
	{
		html += '<table style="cursor:default;" border=0 cellSpacing=0 cellPadding=0 width="100%"><tr>';
		html += '<td style="padding-left:5px;padding-top:2px;padding-bottom:2px;"><table border=0 cellspacing=0 cellpadding=0 width="100%"><tr>';
		
		if( typeof(this.Url) != 'undefined')
			html += '<td><font face="verdana" size="-1"><b>' + this.Url + '</b></font></td>';
		else
			html += '<td style="background-color:' + Css.Menu.BorderColor + '"><img src="" width=1 height=1></td>';
		
		html += '</tr></table></td>';
		
		html += '<td width="10"><img src="" width="1" height="1"></td></td>';
		html += '</tr></table>';
	}
	
	return html;
}
 
MenuItem.prototype.ShowMenuPos = function( x, y )
{ 	
	if( !this.IsParent ) // contains child menu items ?
		return; 
 
	var divMenu = this.CreateHtmlMenu();
		
	if( !divMenu ) return;
	
	divMenu.id = this.ID;
	
	with( divMenu.style )
	{
	    left = x + 'px';
	    top = y + 'px';
	    zIndex = this.zIndex;
	    position = 'absolute';
	    display = 'block';	
    }	  

	//this.AddScroller( divMenu );
	
	this.Visible = true;
	this.Coordinates = {X: x, Y: y, Width: divMenu.offsetWidth, Height: divMenu.offsetHeight};
	
	var divShadow = document.getElementById( this.ID + '-shadow' );
	
	if( divShadow )
	{
		with( divShadow.style ) 
		{
		    position = 'absolute';
		    left = (this.Coordinates.X + CSS_MENU_SHADOW_OFFSET_X) + 'px';
		    top  = (this.Coordinates.Y + CSS_MENU_SHADOW_OFFSET_Y) + 'px';
		    zIndex = this.zIndex - 1;
		    width = this.Coordinates.Width + 'px';
		    height = this.Coordinates.Height + 'px';
		    backgroundColor = CSS_MENU_SHADOW_BACKCOLOR;
		    display = 'block';		
		    MozOpacity = 0.8;
		    filter= 'alpha(opacity=80)';
        }		 
	}	

	divMenu.MenuItem = this;
	divMenu.onmouseout = OnDivMenu_MouseOut;
	divMenu.onmouseover = function() {ClearTimer();}
	
	g_curDivMenu = divMenu;	
} 

MenuItem.prototype.AddScroller = function( divMenu )
{
	// to be implemented
}
  
function OnTimeOut() { 
	CleanUp();
	ClearTimer();
}

function ClearTimer() {
	clearTimeout( g_timerID ); 
	g_timerID = null;
}
 
function OnDivMenu_MouseOut(evt) ///--------------------------------------[ OnDivMenu
{
	var toEl = (isNS ? evt.relatedTarget : window.event.toElement);
				
	if( g_curDivMenu && !contains(g_curDivMenu,toEl ) )
	{
		if( this.MenuItem ) {
			this.MenuItem.UnHilite();
			this.MenuItem.HideChildren();
		}
	
		g_timerID = setTimeout('OnTimeOut()', g_menuHiddenTime); 		
	}
}
 
MenuItem.prototype.Hide = function()
{
	if( !this.Visible )
		return;
		
	var divMenu = document.getElementById( this.ID );
	var divMenuShadow = document.getElementById( this.ID + '-shadow');
		
	if( divMenuShadow )
		divMenuShadow.style.display = 'none';

	if( divMenu ) 
		divMenu.style.display = 'none';
	
	this.Visible = false;	
	
	this.UnHilite();
	this.HideChildren();
}
 
MenuItem.prototype.HideExcluding = function( miID )
{
	for(var i=0; i<this.MenuItems.Count; i++)
	{
		var mi = this.MenuItems.Item(i);
		
		if( mi.ID != miID && mi.Visible) {
			mi.Hide();
									
			if( mi.IsParent )
				mi.HideChildren();
		}
	}
}
 
MenuItem.prototype.HideChildren = function()
{
	for(var i=0; i<this.MenuItems.Count; i++)
	{
		var  mi = this.MenuItems.Item(i);
		
		if( mi.Visible ) {
			mi.Hide();
		
			if( mi.IsParent )
				mi.HideChildren();
		}
	}
}
 
MenuItem.prototype.HideAll = function()
{		
	this.Hide();
	
	for(var i=0; i<this.MenuItems.Count; i++)
	{
		var mi = this.MenuItems.Item(i);
	
		mi.Hide();
		
		if( mi.IsParent )
			mi.HideChildren();		
	}
}
  
MenuItem.prototype.GetDivMenu = function() {
	return document.getElementById( this.ID );
} 
 
MenuItem.prototype.Hilite = function( miID )
{
	var divMenu = this.GetDivMenu();
	
	if( !divMenu )
		return;

	var tables = divMenu.getElementsByTagName('TABLE');
	
	var cells = null;

	for(var i=1; i<tables.length; i++)
	{
		cells = tables[i].rows[0].cells;
		
		if( tables[i].getAttribute('MenuItemId') == miID ) {
			SetMenuItemTableStyle( tables[i], MouseType.Hover );
			break;
		}
		//else if( tables[i].className != 'Separator' )
		//	SetMenuItemTableStyle( tables[i], MouseType.Normal );
	}
}

MenuItem.prototype.UnHilite = function()
{
	var divMenu = document.getElementById( this.ID );
	
	if( !divMenu ) return;

	var tables = divMenu.getElementsByTagName('TABLE');
	var cells = null;

	for(var i=1; i<tables.length; i++) {
		SetMenuItemTableStyle(tables[i], MouseType.Normal);
	} 
}

function SetMenuItemTableStyle(table, mouseType)
{
	if( !table ) return;

	if( table.getAttribute('MenuItemId') != null )
	{
		var cells = table.rows[0].cells;
	    
		switch( mouseType )
		{
			case MouseType.Normal:
				cells[0].style.cssText = CSS_NORMAL_TEXT_COLUMN;
				cells[1].style.cssText = CSS_NORMAL_SUBMENU_COLUMN;				
				break;
				
			case MouseType.Hover:				
				cells[0].style.cssText = CSS_HOVER_TEXT_COLUMN;
				cells[1].style.cssText = CSS_HOVER_SUBMENU_COLUMN;
				break;

			case MouseType.Press:
				cells[0].style.cssText = CSS_PRESS_TEXT_COLUMN;
				cells[1].style.cssText = CSS_PRESS_SUBMENU_COLUMN;
				break;
		}
	}			
}
 
function OnMenuItem_MouseOver(evt, pmID, miID) //-------------------------------------[MenuItem::Over
{
	var mi = window.MainMenu.MenuItems.FindById( miID );
	
	if( mi == null ) return;
	
	mi.Parent.UnHilite();
	mi.Parent.HideExcluding( miID );
			
	var table = GetMenuItemTable(isNS ? evt.target : window.event.srcElement);
	if( table == null ) return;
	
	SetMenuItemTableStyle( table, MouseType.Hover );
	
	var x = GetLeftPos(table) + table.offsetWidth - 2; 
	var y = GetTopPos( table ) - 1;
	
	var docBody = document.body;
	var docWidth  = docBody.clientWidth + docBody.scrollLeft - 10;
	var docHeight = docBody.clientHeight + docBody.scrollTop;		
	
	var menuWidth = parseInt(Css.Menu.Width);
	
	if( x + menuWidth > docWidth )
	{
		x -= ( x + menuWidth - docWidth );
		
		if( x == mi.Parent.Coordinates.X )
			x -= 15;
	}

	mi.ShowMenuPos( x, y );	
}

function OnMenuItem_MouseOut(evt, pmID, miID) {
	return;
}

function OnMenuItem_MouseDown( evt, pId, miId )
{
	if( evt.button == 2 )
		return;
		
	var table = GetMenuItemTable(isNS ? evt.target : window.event.srcElement);

	SetMenuItemTableStyle(table, MouseType.Press );
	
	//CleanUp();
}

function OnMenuItem_MouseUp( evt, pId, miId, url )
{
	var table = GetMenuItemTable(isNS ? evt.target : window.event.srcElement);

	SetMenuItemTableStyle(table, MouseType.Hover );

	if( url != '' && evt.button != 2)
		RedirectUrl( url );		
}

function OnMainMenuItem_MouseOver( evt, miId )
{
	CleanUp();
	
	if( g_curMainMenuItem )
		g_curMainMenuItem.HideAll();		
	
	var mi = window.MainMenu.MenuItems.FindById( miId );
	
	if( !mi ) {
		alert( 'Cannot find Menu ID: ' + miId );
		return;
	}

	var cell = GetCell( isNS ? evt.target : window.event.srcElement );

	if( !mi.IsParent ) // contains child menu items?
	{
		if( window.MainMenu.MainMenuType == MainMenuType.Text)
		    cell.style.cssText = CSS_MAINMENU_ITEM_HOVER_BORDER_ALL;		

	    g_curMainMenuItemCell = cell;

		return false;
	}
	
	if( window.MainMenu.MainMenuType == MainMenuType.Text)
	    cell.style.cssText = CSS_MAINMENU_ITEM_HOVER;
	
	var x = GetLeftPos(cell) + window.MainMenu.MenuOffsetX  + (window.MainMenu.Alignment == Alignment.Vertical ? cell.offsetWidth : 0);
	var y = GetTopPos (cell) + window.MainMenu.MenuOffsetY + (window.MainMenu.Alignment == Alignment.Vertical ? 0 : cell.offsetHeight);	
	
	var docBody = document.body
	var docWidth  = docBody.clientWidth + docBody.scrollLeft;
	var docHeight = docBody.clientHeight + docBody.scrollTop;		
	var menuWidth = parseInt(Css.Menu.Width);
	
	if( x + menuWidth > docWidth )
		x -= ( x + menuWidth + 2 - docWidth );
	
	mi.ShowMenuPos( x, y );
	
	// for tracking purpose
	g_curMainMenuItem = mi;
	g_curMainMenuItemCell = cell;
	
	__showHtmlSelectOptions(false);
}

function OnMainMenuItem_MouseOut(evt)
{
	var toEl = (isNS ? evt.relatedTarget : window.event.toElement);
	
	if( !g_curDivMenu )
		CleanUp();
	
	if( g_curDivMenu && !contains(g_curDivMenu, toEl ) ) {
		g_timerID = setTimeout('CleanUp()', g_menuHiddenTime);
		//g_curDivMenu = null; // must not be null
	}	
}

function OnMainMenuItem_MouseUp(evt, url, isParent)
{
	if( isParent ) return;
	
	RedirectUrl( url );
}

function CleanUp()
{
	ClearTimer();
	
	__showHtmlSelectOptions( true );
	
	if( g_curMainMenuItem )	{
		g_curMainMenuItem.HideAll();
		g_curMainMenuItem.UnHilite();
		g_curMainMenuItem = null;
	}
	
	if( g_curMainMenuItemCell && (window.MainMenu.MainMenuType == MainMenuType.Text) ) {
		g_curMainMenuItemCell.style.cssText = CSS_MAINMENU_ITEM_NORMAL;
		g_curMainMenuItemCell = null;
	}
}


function GetCell( el ) {
	while( el && el.className !='MainMenu-Item' )
		el = el.parentNode;
		
	return el;
}

function GetLeftPos( el ) {
	var pos = 0;
	
	while( el && el.tagName != 'BODY') {
		pos += el.offsetLeft;		
		el = el.offsetParent;
	}	
	return pos;
}		

function GetTopPos( el ) {
	var pos = 0;
	
	while( el && el.tagName != 'BODY' )	{
		pos += el.offsetTop;		
		el = el.offsetParent;
	}	
	return pos;
}

function GetMenuItemTable(el) {
	while( el && el.tagName != 'TABLE' )
		el = el.parentNode;
	
	return el;
}

function RedirectUrl( url ) {
    if( url != 'null' )
	    window.location.href = url;
}
	
// workaround Netscape 6 - insertAdjacentElement, make it compatible with IE
if( typeof(HTMLElement) == 'object' )
{
	HTMLElement.prototype.insertAdjacentElement = function(sWhere, oElement)
	{
		switch( sWhere )
		{
			case 'afterBegin':  
				this.insertBefore( oElement, this.firstChild);
				break;
			
			case 'beforeEnd':
				this.appendChild( oElement );
				break;
		}
					
		// beforeBegin, afterEnd - don't need this at the moment
	}

	HTMLElement.prototype.contains = function (childNode)
	{
		while( childNode ) {
			if( this == childNode )
				return true;
				
			childNode = childNode.parentNode;
		}	
		return false;
	}
} // end of MainMenu

function contains(parent, childNode)
{
	while( childNode ) {
		if( parent == childNode )
			return true;
			
		childNode = childNode.parentNode;
	}	
	return false;
}

/***@ CSS ************************/
var Css = 
{
	MainMenu:
	{
		BorderColor:	'#7c7c94',
		BorderStyle:	'solid',
		BorderWidth:	'1px',
		BackColor:		'#7c7c94',
		
		Normal:
		{
			BorderStyle:	'solid',
			BorderWidth:	'1px',
			BorderColor:	'#7c7c94',
			BackColor:		'#7c7c94',
			FontName:		'verdana',
			FontSize:		'9pt',
			ForeColor:		'#ffffff',
			
			GetStyle : function(bBrdBottom) {
				return 'border: ' + this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
				       'padding-left:3px;padding-right:3px;padding-bottom:3px;' +
					   'background-color: ' + this.BackColor + ';' +
					   'font-family:' + this.FontName + ';' +
					   'font-size: ' + this.FontSize + ';' +
					   'color: ' + this.ForeColor + ';' +
					   (!bBrdBottom ? 'border-bottom: none;' : '');				
			}
		},
		
		Hover:
		{
			BorderColor: '#4b4b6f',
			BorderWidth: '1px',
			BorderStyle: 'solid',
			BackColor:   '#ffeec2',
			FontName:	'verdana',
			FontSize:	'9pt',
			
			GetStyle : function( bBrdBottom ) {
				return 'border: ' + this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
				       'padding-left:3px;padding-right:3px;padding-bottom:3px;' +
					   'background-color: ' + this.BackColor + ';' +
					   'font-family:' + this.FontName + ';' +
					   'font-size: ' + this.FontSize + ';' +
   				       (!bBrdBottom ? 'border-bottom: none;' : '');
			}
		},
		
		GetMenuBarStyle : function() {
			return	'background-color:' + this.BackColor + ';' +
					'border: ' + this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'padding-left:2px;padding-top:2px;padding-bottom:2px;';
		}
	},
	

	Menu:
	{
		Width:			'170px',
		BorderColor:	'#7c7c94',
		BorderWidth:	'1px',
		BorderStyle:	'solid',
		BackColor:		'#fdfaff',
		
		Shadow:
		{
			OffsetX: 2,
			OffsetY: 2,
			BackColor: '#dbdbdb'
		},
		
		Alpha:
		{
			Opacity: 100
		},
		
		GetMenuStyle: function() {
			return	'border: ' + this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'background-color: ' + this.BackColor + ';' +
					'width: ' + this.Width + ';' +
					'';
		}				
	},
	
	MenuItem:
	{	
	    ImageColumnVisible: false,
	    
		Normal:
		{
			BorderWidth: '1px',
			BorderStyle: 'solid',
			BorderColor: '#fdfaff',
			BackColor:	 '#fdfaff',
			
			ImageColumn:
			{
				BackColor: '#a5a3bd',
				ForeColor: 'Black'				
			},
			
			TextColumn:
			{
				FontName: 'verdana',
				FontSize: '9pt',
				Padding: '3px',
				ForeColor: 'Black'
			},

			GetImageColumn : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.ImageColumn.BackColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.ImageColumn.BackColor + ';' +	
					'border-left: '		+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.ImageColumn.BackColor + ';' +
					'background-color:' + this.ImageColumn.BackColor;
			},
			
			GetTextColumn : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-left: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'font-family: ' + this.TextColumn.FontName + ';' +
					'font-size: ' + this.TextColumn.FontSize + ';' +
					'padding:' + this.TextColumn.Padding + ';' +
					'padding-left:5px;' +
					'color: ' + this.TextColumn.ForeColor;
			},
			
			GetSubMenuColumn : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +	
					'border-right: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'color: ' + this.TextColumn.ForeColor;
			},

			GetLeftBorder : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +	
					'border-left: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'color: ' + this.TextColumn.ForeColor;
			}
			
		},

		Hover:
		{
			BorderColor: '#4b4b6f',
			BorderWidth: '1px',
			BorderStyle: 'solid',
			BackColor:	 '#ffeec2',
			
			ImageColumn:
			{
				BackColor: '#a5a3bd'
			},
			
			TextColumn:
			{
				FontName: 'verdana',
				FontSize: '9pt',
				Padding: '3px'
			},

			GetImageColumn : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +	
					'border-left: '		+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'background-color:' + this.BackColor;
			},
			
			GetTextColumn : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-left: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'background-color: ' + this.BackColor + ';' +
					'font-family: ' + this.TextColumn.FontName + ';' +
					'font-size: ' + this.TextColumn.FontSize + ';' +
					'padding:' + this.TextColumn.Padding + ';' +
					'padding-left:5px;' +
					'';
			},
			
			GetSubMenuColumn : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +	
					'border-right: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'background-color:' + this.BackColor;
			},
			
			GetLeftBorder : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +	
					'border-left: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'background-color:' + this.BackColor;
			}
		},
		
		Press:
		{
			BorderColor: 'LightGrey',
			BorderWidth: '1px',
			BorderStyle: 'solid',
			BackColor:	 'White',
			
			ImageColumn:
			{
				BackColor: 'blue'
			},
			
			TextColumn:
			{
				FontName: 'verdana',
				FontSize: '9pt',
				BackColor: 'yellow',
				Padding: '3px'
			},

			GetImageColumn : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +	
					'border-left: '		+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'background-color:' + this.BackColor;
			},
			
			GetTextColumn : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-left: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'background-color: ' + this.BackColor + ';' +
					'font-family: ' + this.TextColumn.FontName + ';' +
					'font-size: ' + this.TextColumn.FontSize + ';' +
					'padding:' + this.TextColumn.Padding + ';' +
					'padding-left:5px;' +
					'';
			},
			
			GetSubMenuColumn : function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +	
					'border-right: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'background-color:' + this.BackColor;
			},
			
			GetLeftBorder: function() {
				return 'border-top: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'border-bottom: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +	
					'border-left: '	+ this.BorderWidth + ' ' + this.BorderStyle + ' ' + this.BorderColor + ';' +
					'background-color:' + this.BackColor;
			}
			
		}
	}	
};	

function BuildCssProperty( cssNode )
{
	var sCss = '';
	
	for(var key in cssNode) {
		if( typeof(cssNode[key]) == 'string' ) {
			switch(key)
			{
				case 'Width':		sCss += 'WIDTH:'			+ cssNode[key];	break;
				case 'BackColor':	sCss += 'BACKGROUND-COLOR:'	+ cssNode[key];	break;
				
				case 'BorderColor':	sCss += 'BORDER-COLOR:'		+ cssNode[key];	break;
				case 'BorderWidth':	sCss += 'BORDER-WIDTH:'		+ cssNode[key];	break;
				case 'BorderStyle':	sCss += 'BORDER-STYLE:'		+ cssNode[key];	break;
				
				case 'FontName':	sCss += 'FONT-FAMILY:'		+ cssNode[key];	break;
				case 'FontSize':	sCss += 'FONT-SIZE:'		+ cssNode[key];	break;
				
			}		
			sCss += ';';
		}
	}	
	return sCss;
}

function __InitCss()
{
    MENUITEM_IMAGE_COLUMN_VISIBLE = Css.MenuItem.ImageColumnVisible;
    
	var cssNormal = Css.MenuItem.Normal;
	CSS_NORMAL_IMAGE_COLUMN = cssNormal.GetImageColumn();
	CSS_NORMAL_TEXT_COLUMN = cssNormal.GetTextColumn();
	CSS_NORMAL_SUBMENU_COLUMN = cssNormal.GetSubMenuColumn();
	CSS_NORMAL_IMAGE_COLUMN_BORDER = cssNormal.GetLeftBorder();

	var cssHover = Css.MenuItem.Hover;
	CSS_HOVER_IMAGE_COLUMN = cssHover.GetImageColumn();
	CSS_HOVER_TEXT_COLUMN = cssHover.GetTextColumn();
	CSS_HOVER_SUBMENU_COLUMN = cssHover.GetSubMenuColumn();
	CSS_HOVER_IMAGE_COLUMN_BORDER = cssHover.GetLeftBorder();
	
	var cssPress = Css.MenuItem.Press;
	CSS_PRESS_IMAGE_COLUMN = cssPress.GetImageColumn();
	CSS_PRESS_TEXT_COLUMN = cssPress.GetTextColumn();
	CSS_PRESS_SUBMENU_COLUMN = cssPress.GetSubMenuColumn();	
	CSS_PRESS_IMAGE_COLUMN_BORDER = cssPress.GetLeftBorder();
		
	CSS_MAINMENU_ITEM_HOVER = Css.MainMenu.Hover.GetStyle(false);
	CSS_MAINMENU_ITEM_NORMAL = Css.MainMenu.Normal.GetStyle(false) + ';cursor:default;';

	CSS_MAINMENU_ITEM_HOVER_BORDER_ALL = Css.MainMenu.Hover.GetStyle(true);
	CSS_MAINMENU_ITEM_NORMAL_BORDER_ALL = Css.MainMenu.Normal.GetStyle(true) + ';cursor:default;';
	CSS_MAINMENU_BAR_STYLE = Css.MainMenu.GetMenuBarStyle();
	
	CSS_DIV_MENU = Css.Menu.GetMenuStyle();
	
	CSS_MENU_SHADOW_OFFSET_X = Css.Menu.Shadow.OffsetX;
	CSS_MENU_SHADOW_OFFSET_Y = Css.Menu.Shadow.OffsetY;
	CSS_MENU_SHADOW_BACKCOLOR = Css.Menu.Shadow.BackColor;   
    
}

function __applyCssToMainMenu()
{
	var table = document.getElementById('MainMenu');
	
	if( table )
	{
	    table.border = 0;
	    table.cellSpacing = 0;
	    table.cellPadding = 2;
	    
		for(var j=0; j<table.rows[0].cells.length; j++)
		{
			table.rows[0].cells[j].onmouseout = OnMainMenuItem_MouseOut;	
			table.rows[0].cells[j].style.cssText = CSS_MAINMENU_ITEM_NORMAL_BORDER_ALL;
		}
	    
	    var div = table.parentNode; // outer
	    
	    if( div && div.tagName == 'DIV')   
	        div.style.cssText = CSS_MAINMENU_BAR_STYLE;
    }
}

function __showHtmlSelectOptions( bShow )
{
	if( !document.all ) return;

	var coll = document.getElementsByTagName('SELECT');
	
	for(var i=0; i<coll.length; i++)
	{
		if( !bShow ) // hide
		{
			if( coll[i].style.visibility != 'hidden')
			{
				coll[i].style.visibility = 'hidden';
				coll[i].setAttribute('_hide', '1');
			}
		}
		else // visible
		{
			if( coll[i].getAttribute('_hide') == '1' )
			{
				coll[i].style.visibility = 'visible';
				coll[i].setAttribute('_hide', '0');
			}
		}
	}
}