/**
 *  smoothy.ui.menu class with menu utility functions for smoothy
 */
   
smoothy.ui.menu = 
{ 
    /**
    * Menu class
    */
  Menu: function(parentId, location, options) // location is array of indices at menu levels
  {
    this._parentId = parentId; // id of parent in page
    this._location = location; // location is array of menu-item indices at menu levels
    // rectangle properties:
    this._top = smoothy.getOptionOrDefault(options, 'top', 0);;
    this._left = smoothy.getOptionOrDefault(options, 'left', 0);
    this._width = smoothy.getOptionOrDefault(options, 'width', 150);
    this._height = smoothy.getOptionOrDefault(options, 'height', 175);
    this._opacity = smoothy.getOptionOrDefault(options, 'opacity', 0.8);
    this._zIndex = smoothy.getOptionOrDefault(options, 'zIndex', 4);
    this._backgroundColor = smoothy.getOptionOrDefault(options, 'backgroundColor', 'red');
    // menu-item properties:
    this._textColor = smoothy.getOptionOrDefault(options, 'textColor', 'white');
    this._selectedTextColor = smoothy.getOptionOrDefault(options, 'selectedTextColor', '#4b4300');
    this._textTop = smoothy.getOptionOrDefault(options, 'textTop', 10);
    this._textLeft = smoothy.getOptionOrDefault(options, 'textLeft', 22);
    this._textSpacing = smoothy.getOptionOrDefault(options, 'textSpacing', 20);
      
    this._node = null;
    this._fadeInAnim = null;
    this._fadeOutAnim = null;
  
    /**
    * getId
    */
    this.getId = function() { return 'smoothyMenu' + smoothy.ui.menu.getLocationKey(this._location); } // id of menu items container div
    /**
    * isVisible
    */
    this.isVisible = function() { return this._node != null && this._node.parentNode == dojo.byId(this._parentId); }
    
    /**
     * menu._buildSubMenuRectangle
     */
    this._buildSubMenuRectangle = function()
    {
      var div = document.createElement('div');
      div.id = this.getId();
      
      dojo.style(div, 'position', 'absolute');
      dojo.style(div, 'top', this._top + 'px');
      dojo.style(div, 'width', this._width + 'px');
      dojo.style(div, 'height', this._height + 'px');
      dojo.style(div, 'left', this._left + 'px');         
      dojo.style(div, 'opacity', 0); // will be faded in
      
      // we want 80% backgroundColor but 100% texts so need to do the backgroundColor on a child div
      var divFadedBackground = document.createElement('div');
      dojo.style(divFadedBackground, 'width', this._width + 'px');
      dojo.style(divFadedBackground, 'height', this._height + 'px');
      dojo.style(divFadedBackground, 'backgroundColor', this._backgroundColor);
      dojo.style(divFadedBackground, 'zIndex', this._zIndex);
      dojo.style(divFadedBackground, 'opacity', this._opacity);
        
      div.appendChild(divFadedBackground);
      return div;
    }
    
    /**
    * _setSubMenuLinkHighlighting
    */
    this._setSubMenuLinkHighlighting = function(subLocation, item, a, color, selectedColor)
    {
      var parentCoords = dojo.coords(a.parentNode, true);
      var left = parentCoords.l + parentCoords.w + 1;
      var colorUsed = item.selected ? selectedColor : color;
      dojo.style(a, 'color', colorUsed);            
      dojo.attr(a, 'onmouseover', function(e) { dojo.style(this, 'color', selectedColor); } );
      dojo.attr(a, 'onclick', function(e) { smoothy.ui.menu.showBorgdorffMenu(subLocation); } );
      dojo.attr(a, 'onmouseout', function(e) { dojo.style(this, 'color', colorUsed); } );
    }
    /**
     * buildSubMenuLinks(menuRectangleDiv, topMenuItemIndex, itemArray, 'white', '#4b4300', top, left, spacing, zIndex)     
     */
    this._buildSubMenuLinks = function()
    {
      var itemArray = smoothy.ui.menu.getItemArray(this._location);
      for (var i = 0; i < itemArray.length; i++)
      {
        var a = document.createElement('a');
        a.href = itemArray[i].href;
        a.innerHTML = itemArray[i].text;
        var subLocation = this._location.slice(); // copy
        subLocation.push(i);
        a.id = 'smoothyMenuItem' + smoothy.ui.menu.getLocationKey(subLocation);
        dojo.style(a, 'position', 'absolute');        
        dojo.style(a, 'top', this._textTop + i*this._textSpacing + 'px');
        dojo.style(a, 'left', this._textLeft + 'px'); 
        dojo.style(a, 'fontWeight', 'bold');    
        dojo.style(a, 'zIndex', this._zIndex + 1);
        this._node.appendChild(a);          
        this._setSubMenuLinkHighlighting(subLocation, itemArray[i], a, this._textColor, this._selectedTextColor);
      }
    }    
    /**
     * _createHtml
     */
    this._createHtml = function() 
    {        
      this._node = this._buildSubMenuRectangle();
      this.attachToParent(); // required for link creation:
      this._buildSubMenuLinks();
    }
    /**
     * _refreshHtml
     */
    this._refreshHtml = function() 
    {        
      this.attachToParent(); // required for link creation:
      var itemArray = smoothy.ui.menu.getItemArray(this._location);
      for (var i = 0; i < itemArray.length; i++)
      {
        var subLocation = this._location.slice(); // copy
        subLocation.push(i);
        var id = 'smoothyMenuItem' + smoothy.ui.menu.getLocationKey(subLocation);
        var a = dojo.byId(id);
        if (a)
          this._setSubMenuLinkHighlighting(subLocation, itemArray[i], a, this._textColor, this._selectedTextColor);
      }
    }
    /**
     * removeFromParent
     */
    this.removeFromParent = function() 
    {        
      var parent = dojo.byId(this._parentId);
      parent.removeChild(this._node);
    }
    /**
     * attachToParent
     */
    this.attachToParent = function() 
    {        
      var parent = dojo.byId(this._parentId);
      parent.appendChild(this._node);
    }
    /**
     * stopAllRunningAnimations
     */
    this.stopAllRunningAnimations = function() 
    {        
      if (this._fadeInAnim != null)
        this._fadeInAnim.stop(true);
        
      if (this._fadeOutAnim != null)
        this._fadeOutAnim.stop(true);
    }
    /**
     * show
     */
    this.show = function(duration)
    {
      this.stopAllRunningAnimations();
      if (this._node == null)
        this._createHtml();
      else
        this._refreshHtml();
      this._fadeInAnim = dojo.fadeIn({node : this.getId(), duration: duration});
      this._fadeInAnim.play();
    }
    /**
     * hide
     */
    this.hide = function(duration)
    {
      this.stopAllRunningAnimations();
      var this_parent = dojo.byId(this._parentId); // need to pass local variables
      var this_node = this._node;                  // to onEnd, cannot use 'this'
      // node needs to be removed because otherwise IE still responds to mouer events on it...      
      this._fadeOutAnim = dojo.fadeOut({node : this_node, duration: duration, onEnd: function() { this_parent.removeChild(this_node); }});
      this._fadeOutAnim.play();
    }
  },
  /**
   *  the top assoc. array of menu items 
   */
  _menuMap : {},
  _previousLocation: [],
  nestedItemsArray: [], // array of items and their subitems
  /**
    * _getItemArray
    */
  _getItemArray : function(nestedItemsArray, location, depth)
  {        
    var index = location[depth];
    var items = nestedItemsArray[index];
    if (depth > 0)
      items = items.sub_items;
    if (depth >= location.length - 1)
      return items;
    
    return this._getItemArray(items, location, depth + 1);
  },
    /**
    * smoothy.ui.menu.getItemArray
    */
  getItemArray : function(location)
  {
    return this._getItemArray(this.nestedItemsArray, location, 0);
  },
    /**
     * smoothy.ui.menu.setMenuStructure
     */
  setMenuStructure : function(nestedItemsArray)
  {
    this.nestedItemsArray = nestedItemsArray;
  },
    /**
     * smoothy.ui.menu.removeAllMenus
     */
  removeAllMenus : function()
  {
    var removeLocation = [];
    for (var i = 0; i < this._previousLocation.length; i++)
    {
      removeLocation.push(this._previousLocation[i]);     
      smoothy.ui.menu.hideMenu(removeLocation, 1000);
    }
    this._previousLocation = [];
  },
    /**
     * smoothy.ui.menu.removeNonOverlappingMenus
     */
  removeNonOverlappingMenus : function(location, previousLocation)
  {
    var same = true;
    var removeLocation = [];
    for (var i = 0; i < previousLocation.length; i++)
    {
      removeLocation.push(previousLocation[i]);
      if (i >= location.length || previousLocation[i] != location[i])
        same = false;
      if (!same)
        smoothy.ui.menu.hideMenu(removeLocation, 500 + 500/(i + 1));
    }
    return location;
  },
    /**
     * smoothy.ui.menu.getLocationKey
     */
  getLocationKey : function(location)
  {
    var key = '';
    for (var i = 0; i < location.length; i++)
      key += '_' + location[i];
    return key;
  },
  /**
   * smoothy.ui.menu.showBorgdorffMenu([0, 1])
   */
  showBorgdorffMenu : function(location)
  {
    this._previousLocation = this.removeNonOverlappingMenus(location, this._previousLocation);
    var key = smoothy.ui.menu.getLocationKey(location);
    var menu = this._menuMap[key];
    if (menu == null) // create if needed
    {
      var itemArray = this.getItemArray(location);
      if (itemArray == null || itemArray.length == 0) // no items to show
        return;
      
      var options = {};
      var pos1 = dojo.coords('top_menu_item1', true);
      var posN = dojo.coords('top_menu_item' + location[0], true);
      var deltaX = posN.x - pos1.x;
      options.left = 150;
      options.width = 160;
      if (location.length == 1) // 1st one needs offset
      {
        options.backgroundColor = 'rgb(195, 163, 0)';
        options.left += deltaX;
      }
      else if (location.length == 2)
      {
        options.backgroundColor = '#76b3de';
        options.left += deltaX + options.width + 1;
      }
      else if (location.length == 3)
      {
        options.backgroundColor = 'rgb(0, 93, 169)';
        options.left += deltaX + 2*(options.width + 1);      
      }
      else // don't show deeper
      {
        return;
      }
        
      menu = new smoothy.ui.menu.Menu('web_header_image', location, options);
      this._menuMap[key] = menu;
    }
    menu.show(1000);
  },  
  /**
   * smoothy.ui.menu.showIsw4LifeMenu([0, 1])
   */
  showIsw4LifeMenu : function(location)
  {
    this._previousLocation = this.removeNonOverlappingMenus(location, this._previousLocation);
    var key = smoothy.ui.menu.getLocationKey(location);
    var menu = this._menuMap[key];
    if (menu == null) // create if needed
    {
      var itemArray = this.getItemArray(location);
      if (itemArray.length == 0) // no items to show
        return;
        
      var options = {};
      var pos1 = dojo.coords('top_menu_item1', true);
      var posN = dojo.coords('top_menu_item' + location[0], true);
      var deltaX = 85 + posN.x - pos1.x;
      options.width = 140;
      options.height = 130;
      options.opacity = 0.85;
      options.textTop = 5;
      options.textLeft = 7;
      if (location.length == 1) // 1st one needs offset
      {
        options.backgroundColor = '#007cc0';
        options.left = deltaX;
      }
      else if (location.length == 2)
      {
        options.backgroundColor = '#d7ad19';
        options.left = deltaX + options.width + 1;
      }
      else if (location.length == 3)
      {
        options.backgroundColor = 'rgb(0, 93, 169)';
        options.left = deltaX + 2*(options.width + 1);      
      }
        
      menu = new smoothy.ui.menu.Menu('dynamic_menu', location, options);
      this._menuMap[key] = menu;
    }
    menu.show(1000);
  },
  /**
   * smoothy.ui.menu.showFreespiritMenu([0, 1])
   */
  showFreespiritMenu : function(location)
  {
    this._previousLocation = this.removeNonOverlappingMenus(location, this._previousLocation);
    var key = smoothy.ui.menu.getLocationKey(location);
    var menu = this._menuMap[key];
    if (menu == null) // create if needed
    {
      var itemArray = this.getItemArray(location);
      if (itemArray.length == 0) // no items to show
        return;
        
      var options = {};
      var pos1 = dojo.coords('top_menu_item1', true);
      var posN = dojo.coords('top_menu_item' + location[0], true);
      var deltaX = 110 + posN.x - pos1.x;
      options.width = 140;
      options.height = 90;
      options.opacity = 1.0;
      options.textTop = 5;
      options.textLeft = 7;
      if (location.length == 1) // 1st one needs offset
      {
        options.backgroundColor = 'rgb(253,118,62)';
        options.left = deltaX;
      }
      else if (location.length == 2)
      {
        options.backgroundColor = '#d7ad19';
        options.left = deltaX + options.width + 1;
      }
      else if (location.length == 3)
      {
        options.backgroundColor = 'rgb(0, 93, 169)';
        options.left = deltaX + 2*(options.width + 1);      
      }
        
      menu = new smoothy.ui.menu.Menu('dynamic_menu', location, options);
      this._menuMap[key] = menu;
    }
    menu.show(1000);
  },
  
  /**
   * smoothy.ui.menu.hideMenu(0, 1)
     [0] depth = 1 index = 0
     [0, 1] depth = 2 index = 0, 1 etc.
     [1, 2, 0]
   */
  hideMenu : function(location, duration)
  {
    if (!duration)
      duration = 500;
      
    var key = smoothy.ui.menu.getLocationKey(location);
    var menu = this._menuMap[key];
    if (menu == null)
      return;
    menu.hide(duration);
  }  
}