/* define value */

var AUTOMENU_LEFT       = "0";         /* specify horizontal offset of menu on page (in pixels) */
var AUTOMENU_TOP        = "0";         /* specify vertical offset of menu on page (in pixels) */
var AUTOMENU_HEIGHT     = "200";       /* specify menu high on page (in pixels) */
var AUTOMENU_WIDTH      = "800";       /* specify menu width on page (in pixels) */
var AUTOMENU_HLBGCOLOR  = "#0A246A";   /* item backgroup highlight color */
var AUTOMENU_HLFTCOLOR  = "#FFFFFF";   /* item text highlight color */
var AUTOMENU_MAX_INST   = 100;


/* AutoMeun object constructor */
function AutoMenu(id)
{
   var i = 0;
   
   /* generate the value of 1st member 'menuId' of this object */
   if(null == id)
   {
      while(document.getElementById("AutoMenu_" + i))
      {
         /* if there is too many auto-menu instance in this page */
         if(i >= AUTOMENU_MAX_INST)
            return null;
         i++   
      }
      this.menuId = "AutoMenu_" + i;
   }
   else
      this.menuId = id;
   
   /* the 2nd member 'itemValue' of this object (the value array of all items in the menu) */
   this.itemValue = new Array();	
   
   /* 1st method of this object */
   this.Show = AutoMenuShow;

   /* 2nd method of this object */
   this.Hide = AutoMenuHide;

   /* 3th method of this object */
   this.Add = AutoMenuAdd;

   /* 4th method of this object */
   this.Select = AutoMenuSelect;

   /* 5th method of this object */
   this.Reset = AutoMenuReset; 

   /* 6th method of this object */
   this.Value = AutoMenuValue; 

   /* 7th method of this object */
   this.Move = AutoMenuMove; 

   /* 8th method of this object */
   this.Length = AutoMenuLen; 

   /* 9th method of this object */
   this.SelectedIdx = AutoMenuSelectedIdx; 

   /* create html element for the auto-menu */
   AutoMenuInit(this.menuId);
}


/* create a html element in the web page for auto-menu object */
function AutoMenuInit(menuId)
{
   var menuObj = document.createElement("DIV");
   
   menuObj.id = menuId;
   menuObj.noWrap = true;
   with(menuObj.style)
   {
      position = "absolute";
      display = "none";
      overflow = "hidden";
      left = AUTOMENU_LEFT + "px";
      top = AUTOMENU_TOP + "px";
      border = "1px solid black";
   }
   document.getElementsByTagName("BODY")[0].appendChild(menuObj);
   return;
}

/* dispaly the auto-menu object */
function AutoMenuShow()
{
   var i;
   var menuWidth = 0;
   var menu = document.getElementById(this.menuId);
   
   if(menu.childNodes.length <= 0 || this.itemValue[0] == null)
   {
      menu.style.display = "none";
      return;
   }
   menu.style.display = "inline";
}

/* hide the auto-menu object */
function AutoMenuHide()
{
   document.getElementById(this.menuId).style.display = "none";
}

/* select item in auto-menu object by index no */
function AutoMenuSelect(itemNo)
{
   var i;
   var menu;
   var itemObj;

   if(arguments.length < 2)
      menu = document.getElementById(this.menuId);
   else
   {
      /* IE only */
      if(document.all)
      {
         menu = event.srcElement.parentNode;
      }
      /* FireFox only */
      else
      {
         menu = arguments[1].target.parentNode;
      }
   }
   if(menu.tagName == "LI")
      menu = menu.parentNode;
   
   /* cancel the old selection's highlight*/
   for(i = 0; i < menu.childNodes.length ; i++)
   {
      itemObj = menu.childNodes[i];
      if(itemObj.className != "auto_complete")
      {
         if(itemNo == i)
            continue;
         else
         {
              itemObj.className = "auto_complete";
         }
      }
      else if(itemNo == i)
      {

           itemObj.className = "auto_complete_select";
         continue;
      }
   }
}

/* add a name-value pair item in anut-menu */
function AutoMenuAdd(name, value)
{
   var menu = document.getElementById(this.menuId);
   var nItem = menu.childNodes.length;
   var IsVisible = (menu.style.display != "none");   
   var htmlStr;

  /* hide the menu before add item */
   if(IsVisible)
      this.Hide();

   htmlStr = 
   '<div value=' + nItem + ' onMouseOver="AutoMenuSelect(' + nItem + 
   ', event)" class="auto_complete" onMouseOver="AutoMenuSelect(' + nItem +
   ' , event)">'+ name + '</div>';
   
   /* save value */
   this.itemValue[nItem] = value;
   
   /* add item in list */
   menu.innerHTML += htmlStr;

   if(IsVisible)
      this.Show();
}

/* reset auto-menu for re-using */
function AutoMenuReset()
{
   this.Hide();
   this.itemValue = null;
   this.itemValue = new Array();
   document.getElementById(this.menuId).innerHTML = "";
}

/* get the value of selected item in auto-menu */
function AutoMenuValue()
{
   var i;
   var menu = document.getElementById(this.menuId);

   for(i = 0; i < menu.childNodes.length; i++)
   {
      if(menu.childNodes[i].className == "auto_complete_select")
         return this.itemValue[i];
   }
   return null;   
}

/* get the selected item index */
function AutoMenuSelectedIdx()
{
   var i;
   var menu = document.getElementById(this.menuId);

   for(i = 0; i < menu.childNodes.length; i++)
   {
      if(menu.childNodes[i].className == "auto_complete_select")
         return i;
   }
   return -1;   
}

/* move the auto-menu object to the specific postion by (x, y) coordinate */
function AutoMenuMove(xLeft, yTop)
{
   var menuPos = document.getElementById(this.menuId).style;
   
   menuPos.left = xLeft + "px";
   menuPos.top = yTop + "px";   
   return;
}

/* move the auto-menu object to the specific postion by (x, y) coordinate */
function AutoMenuLen()
{
   return (document.getElementById(this.menuId).childNodes.length);
}