/**
 * PopupMenu JavaScript Class
 *
 * Copyright Peter M. Laurina 2008
 * The use or modification of this property
 * is strictly prohibited unless with written
 * permission from myself, the author.  For
 * questions, please contact me via email at
 * pete at zionvier dot com 
 */

function PopupMenu() {}

PopupMenu = function(parentDivId, popupId, iconPath)
{
    
    this.menuShadowDivClass = "zv_menuShadowDiv";
    this.menuOutterDivClass = "zv_menuOutterDiv";
    this.menuInnerDivClass = "zv_menuInnerDiv";
    this.menuItemClass = "zv_menuItem";
    this.menuAlinkClass = "zv_menuAlink";
    this.menuAlinkCommonClass = "zv_menuAlinkCommon";
    this.menuSelectedAlinkClass = "zv_menuSelectedAlink";
    this.menuImgClass = "zv_menuImg";
    this.menuCapSpanClass = "zv_menuCaption";
    this.menuRightArrow = "zv_menuRightArrow";

    if (iconPath != null)
      this.iconPath = iconPath;
    else
      this.iconPath = Utils.iconPath;
    
    this.popupId = popupId;
    this.selectedItem = null;
    this.clickHandler = null;
    this.menuItems = new Array();
    this.parentDiv = document.getElementById(parentDivId);
    
    this.outterDiv = document.createElement('div');
    this.outterDiv.className = this.menuOutterDivClass;
    this.innerDiv = document.createElement('div');
    this.innerDiv.className = this.menuInnerDivClass;
    this.shadowDiv = document.createElement('div');
    this.shadowDiv.className = this.menuShadowDivClass;
    this.outterDiv.appendChild(this.shadowDiv);
    this.outterDiv.appendChild(this.innerDiv);
    
    this.parentDiv.appendChild(this.outterDiv);
    
    this.clickHandler = null; //This holds the function to execute when an object is clicked.
    
    //Send the right click command to my function instead of the browsers
    if ( isIE ) //Not sure if this needs to get done for IE7 or if IE7 is normal now.
      this.outterDiv.attachEvent("oncontextmenu", PopupMenu.onContextClick );   
    else
      this.outterDiv.addEventListener("contextmenu", PopupMenu.onContextClick, false);
    
    MenuControl.addPopup(this);
}

/*
 * on right click... stop it!
 */
PopupMenu.onContextClick = function( event )
{
    Utils.stopEvent(event); 
}

PopupMenu.prototype.addItem = function(cmd, caption, icon, submenu)
{
    var item = new MenuItem(this, cmd, caption, icon, submenu);
    this.menuItems[cmd] = item;
    
    this.innerDiv.appendChild(item.alink); //put that item into the control for real
    return item;
}

PopupMenu.prototype.select = function(menuCmd)
{
    if (this.menuItems[ menuCmd ] != null)
      this.menuItems[menuCmd].select();  //call the select method of that tab
}

PopupMenu.prototype.getSelected = function()
{        
    return  this.selectedItem;
}

PopupMenu.prototype.unSelect = function()
{        
    if ( this.selectedItem != null )
      this.selectedItem.unSelect(); 
}
PopupMenu.prototype.hide = function()
{
    if (this.selectedItem != null)
      this.selectedItem.unSelect();
    this.outterDiv.style.display = "none";
}
PopupMenu.prototype.show = function()
{
    this.outterDiv.style.display = "block";
}
/**
 * Allows you to define your own event handler function for the onClick
 * event.
 * 
 * @param clickHandler  a pointer to a function to get called
 */
PopupMenu.prototype.onClick = function( clickHandler )
{
    this.clickHandler = clickHandler;
}

PopupMenu.onPopupMenuClick = function ( event )
{  
    var obj = Utils.getObjFromEvent(event);

    //object that has tab
    while ( obj != null && obj.menuItem == null )
    obj = obj.parentNode;

    if ( obj == null )
    return;
    
    //stop the bubble effect
    obj.blur();
    Utils.stopEvent( event ); 

    //if there's a submenu, you don't want to actually do anything beside open the submenu
    if (obj.menuItem.submenu != null)
      return;
    
    //grab the menu and controller
    var menuItem = obj.menuItem;
    var popupMenu = menuItem.popupMenu;

    //if the tab that was clicked is already the selected tab, there's nothing to do
    if ( popupMenu.selectedMenu == menuItem )
    return;

    //call the function the user set to handle click events
    if ( popupMenu.clickHandler != null )
    popupMenu.clickHandler( popupMenu, menuItem, event );

    //be sure to select the tab that was selected.
    menuItem.unSelect();
    MenuControl.hideAll();
    
}
PopupMenu.onPopupMouseOver = function( event )
{
    var obj = Utils.getObjFromEvent(event);
      //object that has tab
    while ( obj != null && obj.menuItem == null )
    obj = obj.parentNode;

    if ( obj == null )
    return;

    obj.menuItem.select();
}


function MenuItem(popupMenu, cmd, icon, caption, submenu)
{
    this.popupMenu = popupMenu;
    this.cmd = cmd;
    this.icon = icon;
    this.capion = caption;
    this.submenu = submenu;
    this.alink = null; //contains the entire link
    
    this.iconImg = document.createElement('img');
    this.iconImg.src = Strings.makeUrlPath( this.popupMenu.iconPath, (icon==null)?"ico-none.gif" : icon );
    Utils.addClassName(this.iconImg, this.popupMenu.menuImgClass );
    if (icon==null)
       this.iconImg.style.width = "16px";
   
    this.capSpan = document.createElement('span');
    this.capSpan.innerHTML = caption;
    Utils.addClassName(this.capSpan, this.popupMenu.menuCapSpanClass);
    if (icon==null)
       this.capSpan.style.marginLeft = "16px";
       
    if (this.submenu != null)
    {
        this.arrow = document.createElement('img');
        this.arrow.src = Strings.makeUrlPath( this.popupMenu.iconPath, "arrow_right.gif");
        Utils.addClassName(this.arrow, this.popupMenu.menuRightArrow);
    }
    
    this.alink = document.createElement("A");
    this.alink.href = "#";  
    this.alink.className = this.popupMenu.menuAlinkCommonClass;
    Utils.addClassName(this.alink, this.popupMenu.menuAlinkClass)
    this.alink.appendChild(this.iconImg);
    this.alink.appendChild(this.capSpan);
    if (this.arrow != null)
      this.alink.appendChild(this.arrow);
    
    this.alink.menuItem = this; //look at myself so I can find me later

    if ( isIE )                                  
      this.alink.attachEvent("onclick", PopupMenu.onPopupMenuClick );            
    else
      this.alink.addEventListener("click", PopupMenu.onPopupMenuClick, false);
  
    if ( isIE )                                  
      this.alink.attachEvent("onmouseover", PopupMenu.onPopupMouseOver );            
    else
      this.alink.addEventListener("mouseover", PopupMenu.onPopupMouseOver, false);
  
    MenuControl.addItem(this);
}

MenuItem.prototype.select = function()
{        
    if ( this.popupMenu.selectedItem == this)
        return;

    if ( this.popupMenu.selectedItem != null )
    {
         this.popupMenu.selectedItem.unSelect();   
    }

    Utils.removeClassName(this.alink, this.popupMenu.menuAlinkClass);
    Utils.addClassName( this.alink, this.popupMenu.menuSelectedAlinkClass );

   // if ( !Strings.isEmpty( this.divPanelId ) )
   //     Utils.showDiv( this.divPanelId );

    this.popupMenu.selectedItem = this;
    if (this.submenu != null)
      MenuControl.show(this.submenu);
   // Utils.showDiv(this.popupMenu.selectedItem.divID);
}

MenuItem.prototype.unSelect = function()
{
    if ( this.popupMenu.selectedItem == this )
    {
       // Utils.hideDiv(this.tabControl.selectedTab.divID);
        this.popupMenu.selectedItem = null;
    } 
    
    if (this.submenu != null)
    {
      MenuControl.hide(this.submenu);
    }
    Utils.addClassName(this.alink, this.popupMenu.menuAlinkClass);
    Utils.removeClassName( this.alink, this.popupMenu.menuSelectedAlinkClass );
    
    
   // if ( !Strings.isEmpty( this.divID ) )
   //     Utils.hideDiv( this.divID );
}