/**
 * @class MenuItemApp
 *
 * The class MenuItemApp represents an application menu item in the main menu.
 */
var MenuItemApp = function(parentItem, htmlId, id, label, thumb)
{
  // ---- Constants ---------------------------------------------------

  /** The class name of the normal A element. */
  var CLASSNAME = "mainnavigation_level_0";
  /** The class name of the selected A element. */
  var CLASSNAME_SELECTED = "mainnavigation_level_0_selected";

  // ---- Fields ------------------------------------------------------

  /** The parent menu item. */
  this.parentItem = null;
  /** The HTML Id used for this menu entry. */
  this.htmlId = null;
  /** The ID of this menu entry. */
  this.id = null;
  /** This label of this menu entry. */
  this.label = null;
  /** The thumbnail path for this menu entry. */
  this.thumb = null;
  /** Indicates whether this menu entry is selected. */
  this.selected = false;
  /** The child menu entries. */
  this.children = null;
  /** The A element that represents this menu entry. */
  var a = null;
  /** The DIV element that represents this menu entry in the content area. */
  this.contentEntryDiv = null;
  /** The DIV element that represents this menu entry in the navigation area. */
  this.menuEntryDiv = null;
  /** The DIV element where the child elements will be attached to in the content area. */
  this.contentContainerDiv = null;
  /** The DIV element where the child elements will be attached to in the navigation area. */
  this.menuContainerDiv = null;

  // ---- Constructors ------------------------------------------------

  /**
   * Creates a new application menu item using the given information and the existing HTML elements.
   *
   * @param {MenuRoot} parentItem the menu root
   * @param {String} htmlId the ID of the existing HTML element
   * @param {String} id the ID of this menu entry
   * @param {label} label the label of this menu entry
   * @param {String} thumb the thumbnail path of this menu entry
   */
  this.constructor = function(parentItem, htmlId, id, label, thumb)
  {
    this.parentItem = parentItem;
    this.htmlId = htmlId;
    this.id = id;
    this.label = label;
    this.thumb = thumb;

    this.parentItem.addChild(this);

    this.initMenu();
  };

  // ---- Public functions --------------------------------------------

  /**
   * Returns the child with the given ID or null.
   *
   * @public
   * @param {String} id an ID
   * @return {MenuItemType}
   * The child with the given ID or null.
   */
  this.getChild = function(id)
  {
    if(this.children != null)
    {
      for(var i = 0; i < this.children.length; i++)
      {
        var child = this.children[i];
        if(child.id == id)
        {
          return child;
        }
      }
    }
    return null;
  };

  /**
   * Adds a child to the menu item.
   *
   * @public
   * @param {MenuItemType} child a type menu item
   */
  this.addChild = function(child)
  {
    if(this.children == null)
    {
      this.children = new Array();
    }
    this.children.push(child);
  };

  /**
   * Unselects this menu entry.
   *
   * @public
   */
  this.close = function()
  {
    if(this.selected)
    {
      if(this.children != null)
      {
        for(var i = 0; i < this.children.length; i++)
        {
          this.children[i].close();
        }
      }

      a.removeClass(CLASSNAME_SELECTED);
      a.addClass(CLASSNAME);

      if(this.menuContainerDiv != null)
      {
        this.menuContainerDiv.animate({height:"hide", opacity:"1"}, {duration:page.speed});
      }

      this.selected = false;
    }
  };

  /**
   * Selected this menu entry and closes all sibling menu entries.
   *
   * @public
   */
  this.open = function()
  {
    if(!this.selected)
    {
      if(this.children == null)
      {
        dwrService.getTypes(page.dealerId, page.locale, page.context, this.id, DWRResultProcessor.processDWRResult);
      }
      else
      {
        this.parentItem.close();

        for(var i = 0; i < this.parentItem.children.length; i++)
        {
          var child = this.parentItem.children[i];
          if(child != this)
          {
            child.close();
          }
        }

        if(this.contentEntryDiv == null)
        {
          this.buildContent();
        }

        a.removeClass(CLASSNAME);
        a.addClass(CLASSNAME_SELECTED);

        this.menuContainerDiv.animate({height:"show", opacity:"1"}, {duration:page.locale});

        if(page.contentDiv != null)
        {
          page.contentDiv.animate({opacity:"hide"}, {duration:page.speed / 2, queue:"content"});
        }
        if(this.contentEntryDiv != null)
        {
          this.contentEntryDiv.animate({opacity:"show"}, {duration:page.speed / 2, queue:"content",
            complete:function(){page.contentDiv.pngFix();}});
        }
        page.contentDiv = this.contentEntryDiv;

        this.selected = true;
      }
    }
    else
    {
      if(page.contentDiv != this.contentEntryDiv)
      {
        page.contentDiv.animate({opacity:"hide"}, {duration:page.speed / 2, queue:"content"});
        this.contentEntryDiv.animate({opacity:"show"}, {duration:page.speed / 2, queue:"content"});
        page.contentDiv = this.contentEntryDiv;
      }
    }
  };

  /**
   * Adds the given type menu items and creates the HTML elements for it.
   *
   * @param {MenuItem[]} menuItems an array of type menu items
   */
  this.addChildren = function(menuItems)
  {
    if(menuItems.length > 0)
    {
      this.children = new Array();
      this.menuContainerDiv = $("<div class=\"mainnavigation_application_contents\"/>");
      this.menuContainerDiv.hide();
      this.menuEntryDiv.append(this.menuContainerDiv);
      for(var i = 0; i < menuItems.length; i++)
      {
        var menuItem = menuItems[i];
        new MenuItemType(this, null, menuItem.id, menuItem.label, menuItem.contentThumbs);
      }
    }
    this.open();
  };

  // ---- Not so public functions -------------------------------------

  /**
   * Inits the menu area for this menu entry.
   */
  this.initMenu = function()
  {
    // the menu entry
    this.menuEntryDiv = $("#" + this.htmlId); // always exists
    // the menu item
    a = this.menuEntryDiv.find("a:first");
    this.selected = a.hasClass(CLASSNAME_SELECTED);

    // add click
    a.attr("href", "javascript:openMenu(\"" + id + "\");");

    this.menuContainerDiv = this.menuEntryDiv.find("div.mainnavigation_application_contents");
    if(this.menuContainerDiv.length == 0)
    {
      this.menuContainerDiv = null;
    }
  };

  /**
   * Inits the content page if it exists.
   */
  this.initContent = function()
  {
    this.contentEntryDiv = $("div.content_type_container");
    if(this.contentEntryDiv.length != 0)
    {
      var applicationDivs = this.contentEntryDiv.find("div.typecontent_type_container");
      for(var i = 0; i < applicationDivs.length; i++)
      {
        var child = this.children[i];
        var applicationDiv = applicationDivs.eq(i);
        child.contentEntryDiv = applicationDiv;
        var a = applicationDiv.find("a.type_a");
        var aDiv = $("<div class=\"type_a\"/>");
        aDiv.attr("onclick", "openMenu(\"" + this.id + "\", \"" + child.id + "\");");
        aDiv.append(a.children());
        a.replaceWith(aDiv);
        if(child.selected)
        {
          child.initContent();
        }
      }
    }
    else
    {
      this.contentEntryDiv = null;
    }
  };

  /**
   * Creates the HTML representation of this menu entry in the content area.
   */
  this.buildContent = function()
  {
    if(this.children != null)
    {
      this.contentEntryDiv = $("<div class=\"content_type_container\"/>");
      var headlineDiv = $("<div class=\"application_headline\"/>");
      headlineDiv.text(this.label);
      this.contentEntryDiv.append(headlineDiv);
      var containerDiv = $("<div class=\"typecontent_application_contents\"/>");
      for(var i = 0; i < this.children.length; i++)
      {
        var child = this.children[i];
        var entryDiv = $("<div class=\"typecontent_type_container\"/>");
        child.contentEntryDiv = entryDiv;
        var typeADiv = $("<div class=\"type_a\"/>");
        typeADiv.attr("clickdata", "openMenu(\"" + this.id + "\", \"" + child.id + "\");");
        typeADiv.click(function(){eval($(this).attr("clickdata"))});
        var typeHeadlineDiv = $("<div class=\"type_headline\"/>");
        var typeLabelDiv = $("<div class=\"type_label\"/>");
        typeLabelDiv.text(child.label);
        typeHeadlineDiv.append(typeLabelDiv);
        var imagesDiv = $("<div class=\"type_images\"/>");
        for(var j = 0; j < child.contentThumbs.length; j++)
        {
          var img = $("<img src=\"" + child.contentThumbs[j] + "\" alt=\"\"/>");
          imagesDiv.append(img);
        }
        typeHeadlineDiv.append(imagesDiv);
        typeADiv.append(typeHeadlineDiv)
        entryDiv.append(typeADiv);
        containerDiv.append(entryDiv);
      }
      this.contentEntryDiv.append(containerDiv);
      this.contentEntryDiv.hide();
      $("div.content_container").append(this.contentEntryDiv);
    }
  };

  //---- Constructor call ---------------------------------------------

  this.constructor(parentItem, htmlId, id, label, thumb);
};

// register a result function to process the type updae bean
$(document).ready(function()
{
  var processTypeUpdateBean = function(typeUpdateBean)
  {
    var menuItemApp = page.menuRoot.getChild(typeUpdateBean.applicationName);
    if(menuItemApp != null)
    {
      menuItemApp.addChildren(typeUpdateBean.types);
    }
  };

  DWRResultProcessor.registerResultFunction("typeUpdateBean", processTypeUpdateBean);
});

/*
:parent.div <div class="mainnavigation_container">
              <c:forEach var="application" items="${mainnavigation.menuItems}">
:entry          <div id="${application.htmlId}" class="mainnavigation_application_container">
                  <div class="mainnavigation_entry_white">
:a                  <a class="mainnavigation_level_0<c:if test="${application.selected}">_selected</c:if>" href="${application.url}"><c:out value="${application.label}"/></a>
                  </div>
                  <c:if test="${not empty application.subMenu}">
:div                <div class="mainnavigation_application_contents">
                      <c:forEach var="type" items="${application.subMenu}">
:children               <!-- MenuItemType -->
                      </c:forEach>
                    </div>
                  </c:if>
                </div>
              </c:forEach>
            </div>
*/

