var TopEntry = Class.create({
    entries: new Array('entry-1', 'entry-2', 'entry-3', 'entry-4'), 
    activeEntry: null,
    outTimeout: null,
    initialize: function() {
      for (var i = 0; i < this.entries.length; i++) {
        var entry = $(this.entries[i]);
        if (entry.className.indexOf('current-entry') == -1) 
          this.observeChildNodes(entry);
      }
    },
    observeChildNodes: function(parent) {
      Event.observe(parent, 'mouseover', this.overCmd.bindAsEventListener(this));
      Event.observe(parent, 'mouseout', this.preDeactivateMenu.bindAsEventListener(this));
      if (parent.childNodes != null)
        for (var j = 0; j < parent.childNodes.length; j++)
          if (parent.childNodes[j].tagName)
            this.observeChildNodes(parent.childNodes[j]);
    },
    overCmd: function(e) {
      var el = Event.element(e);
      while (el.className.indexOf('top-entry') == -1 && el.className.indexOf('top-entry-active') == -1) el = el.parentNode;
      if (this.activeEntry != el && this.activeEntry != null)
        this.activeEntry.className = 'top-entry';
      
      this.activeEntry = el;
      this.activeEntry.className = 'top-entry-active';
      
      if (this.outTimeout != null) clearTimeout(this.outTimeout);
      Event.stop(e);
    },
    preDeactivateMenu: function(e) {
      var el = Event.element(e);
      this.outTimeout = setTimeout(this.deactivateMenu.bind(this), 100);
      Event.stop(e);
    },
    deactivateMenu: function() {
      if (this.activeEntry != null)
        this.activeEntry.className = 'top-entry';
    }
});



var Menu = Class.create({
    activeMenu: null,
    activeItem: null,
    outTimeout: null,
    initialize: function() {
      var topMenu = $('top-menu');
      for (var i = 0; i < topMenu.childNodes.length; i++) {
        var topChild = topMenu.childNodes[i];
        if (topChild.className && topChild.className == 'menu-cmd' && topChild.id != 'support') { 
          Event.observe(topChild, 'mouseover', this.overCmd.bindAsEventListener(this));
          Event.observe(topChild, 'mouseout', this.preDeactivateMenu.bindAsEventListener(this));
          var menuId = topChild.id.replace('cmd', '\links');
          var menu = $(menuId);
          if (menu != null)
            Event.observe(menu, 'mouseout', this.preDeactivateMenu.bindAsEventListener(this));
            for (var j = 0; j < menu.childNodes.length; j++) {
              var child = menu.childNodes[j];
              if (child.tagName && child.tagName.toLowerCase() == 'li') {
                Event.observe(child, 'mouseover', this.activateItem.bindAsEventListener(this));
              }
            }
        }
      }
    },
    overCmd: function(e) {
      var el = Event.element(e);
      while (el.className != 'menu-cmd') el = el.parentNode;
      
      if (this.activeMenu != null) {
        var activeAnchor = $(this.activeMenu.id.replace('links', '\anchor'));
        activeAnchor.className = '';
        this.activeMenu.style.display = 'none';
      }
      var activeAnchor = $(el.id.replace('cmd', '\anchor'));
      activeAnchor.className = 'active-menu';
      this.activeMenu = $(el.id.replace('cmd', '\links'));
      this.activeMenu.style.display = 'block';
      
      if (this.outTimeout != null) clearTimeout(this.outTimeout);
      Event.stop(e);
    },
    activateItem: function(e) {
      var el = Event.element(e);
      while (el != null && el.tagName != 'LI') el = el.parentNode;
      
      if (this.activeItem != null) this.activeItem.className = '';
      if (el != null) {
        this.activeItem = el;
        this.activeItem.className = 'active';
        if (this.outTimeout != null) clearTimeout(this.outTimeout);
        Event.stop(e);
      }
    },
    preDeactivateMenu: function(e) {
      var el = Event.element(e);
      this.outTimeout = setTimeout(this.deactivateMenu.bind(this), 100);
      Event.stop(e);
    },
    deactivateMenu: function() {
      if (this.activeItem != null) this.activeItem.className = '';
      if (this.activeMenu != null) {
        var activeAnchor = $(this.activeMenu.id.replace('links', '\anchor'));
        activeAnchor.className = '';
        this.activeMenu.style.display = 'none';
      }
    }
});

// adds listeners to elements when page is loaded
Event.observe(window, 'load', function() {
  var jsMenu = new Menu();
  var jsTopEntry = new TopEntry();
});