/**
 * Drop Down Menu
 * @creator   Thijs Wiersema
 * @date      sept 2008
 */
var NavDropDown = new Class( {

  Implements: [Options],

  /**
   * Options
   */
  options: {
    mOverDelay: 200,
    mOutDelay: 500
  },

  /**
   * Constructor
   *
   * @param {mainElement} The main Element that holds the nav elements
   * @param {currentAID} the current a item that is active
   * @param {Object} Options
   */
  initialize: function(mainElement, options)
  {
    this.mainElement  = $(mainElement);
    this.mainLevels   = new Array();
    this.setOptions(options);
    this.navIsActive  = false;
    this.currentLevelID = null;
    this.currRoad     = null;
    this.callLevelID  = null;
    this.moTimeout    = null;
    this.menuTimeout  = null;
    this.menuBgTimeout = null;

    // build the menu
    this.build(this.mainElement);

    this.mainElement.addEvent('mouseleave', function(){
      this.menuTimeout = (function(){ 
        if(this.currRoad != null) {
          var tempID = 'navLevel_';
          for(i=0; i<this.currRoad.length; i++) {
            tempID += (i==0 ? '' : '-' ) + this.currRoad[i];
            if($(tempID)) {
              $(tempID).setStyle('display', 'none');
            }
          }
        }

        if(this.mainLevels != null){
          this.mainLevels.each(function(el) { el.setStyle('display', 'none') } );
        }

        $('mainMenuBgDiv').setStyle('display', 'none');
      } ).delay(this.options.mOutDelay, this);
    }.bind(this) );

    this.mainElement.addEvent('mouseenter', function(){
      $clear(this.menuBgTimeout);
      $clear(this.menuTimeout);
    }.bind(this) );
  },

  build: function(parentEl)
  {
    parentEl.getChildren('a').each( function(el){

      var subID = el.get('id').split('_').pop();

      var subElID = 'navLevel_'+subID;
      var subEl = $(subElID);

      // left positioning first dropdown level
      if(subID.indexOf('-') == -1 && $chk(subEl)) {
        this.mainLevels.push(subEl);
        var posX = $('nav_'+subID).getPosition(this.mainElement).x;
        posX = posX - 5;
        subEl.setStyle('left', posX);
      }

      if($chk( subEl )) {

        // add mouseout to sub ul
        subEl.addEvent('mouseenter', function(){
          this.mouseOver(subElID);
        }.bind(this) );

        subEl.addEvent('mouseleave', function(){
          $clear(this.moTimeout);
          this.callLevelID = null;
          this.moTimeout = this.hideCurrentLevel.delay(this.options.mOutDelay, this, true);
        }.bind(this) );

        // add mouseover to the a
        el.addEvent('mouseenter', function(){
          this.mouseOver(subElID);
        }.bind(this) );

        el.addEvent('mouseleave', function(){
          $clear(this.moTimeout);
          this.callLevelID = null;
          this.moTimeout = this.hideCurrentLevel.delay(this.options.mOutDelay, this);
        }.bind(this) );

        this.build(subEl);

      } else {

        el.addEvent('mouseenter', function(){
          $clear(this.moTimeout);
          var tempID = subID.split('-');
          if(tempID.length > 1) {
            tempID.pop();
            this.mouseOver('navLevel_'+tempID.join('-'));
          } else {
            this.mouseOver(null);
          }
        }.bind(this) );

      }

    }.bind(this) );
  },

  mouseOver: function(levelID)
  {
    $clear(this.moTimeout);
    if(this.currentLevelID != levelID) {
      this.callLevelID = levelID;
      this.moTimeout = this.showLevel.delay(this.options.mOverDelay, this);
    }
  },

  showLevel: function()
  {
    if(this.callLevelID !== null)
    {

      var tempCall = this.callLevelID.split('_').pop().split('-');

      if( this.currentLevelID != null ) {

        var tempCurrRoad = this.currRoad;
        var tempCurrID = 'navLevel_'+tempCurrRoad.join('-');
        var i = tempCurrRoad.length-1;
        while(tempCurrRoad.length > 0) {
          if(!$chk(tempCall[i]) || this.currRoad[i] != tempCall[i]) {
            $('navLevel_'+tempCurrRoad.join('-')).setStyle('display', 'none');
          }
          i--;
          if(tempCurrRoad.pop() == null) {
            break;
          }
        }

      }

      this.currentLevelID = this.callLevelID;
      this.currRoad = tempCall;

      $(this.callLevelID).setStyle('display', 'inline');

      var height = $(this.currentLevelID).retrieve('heightLevel');
      if(height == null) {
        height = 0;
        var tmpID = 'navLevel_';
        for(i=0; i<tempCall.length; i++) {
          tmpID += (i==0 ? tempCall[i] : '-'+tempCall[i]);
          tmpY = $(tmpID).getSize().y;
          height = (height < tmpY ? tmpY : height);
        }

        $(this.currentLevelID).setStyle('height', height);
        $(this.currentLevelID).store('heightLevel', height);
      }

      this.showMenuBg(height+40);
    } else {
      this.hideCurrentLevel(true);
    }
  },

  hideCurrentLevel: function(hideParents)
  {
    if(this.currentLevelID != null) {
      $(this.currentLevelID).setStyle('display', 'none');

      // hide all parents
      if($chk(hideParents) && hideParents === true) {
        if((ids = this.currentLevelID.split('_').pop().split('-')).length > 1) {
          while(ids.length > 1 && ids.pop() != null) {
             $('navLevel_'+ids.join('-')).setStyle('display', 'none');
          }
        }
      }
    }

    this.currentLevelID = null;
    this.currRoad = null;
  },

  showMenuBg: function(height)
  {
    $('mainMenuBgDiv').setStyle('height', height);
    $('mainMenuBgDiv').setStyle('display', 'block');
  }

} );
