var MenuManager = {
  items : new Array(),
  active_item: null,
  createItem : function( htmlElement ) {
    var index = this.items.length;
    var rv = new MenuPanel( index, htmlElement );
    rv.registerListener( 'mouseOver', this );
    rv.registerListener( 'shown', this );
    this.items.push( rv );
    if ( rv.active )
      this.active_item = rv;
  },
  handleEvent : function( eventType, eventSource ) {
    var others = new Array();
    for( var i=0; i<this.items.length; i++ )
      if ( this.items[ i ] != eventSource )
        others.push( this.items[ i ] );

    if ( 'mouseOver' == eventType ) {
      eventSource.show_menu();
      this.active_item = eventSource;
    } else if ( 'shown' == eventType ) {
      for( var i=0; i<others.length; i++ )
        others[ i ].hide_menu();
    }
  },
  getActiveItem: function() {
    return this.active_item;
  }
}

function MenuPanel( menuIndex, htmlElement ) {
  this.onTriggerMouseOver = function( e ) {
    DOMEvent.preventDefault( e );
    this.clearTimeout();
    this.notify( 'mouseOver' );
  }
  this.onTriggerMouseOut = function( e ) {
    DOMEvent.preventDefault( e );
    this.startTimeout();
  }
  this.onSubMenuMouseOver = function( e ) {
    DOMEvent.preventDefault( e );
    this.clearTimeout();
  }
  this.onSubMenuMouseOut = function( e ) {
    DOMEvent.preventDefault( e );
    this.startTimeout();
  }
  this.startTimeout = function() {
    this.tmo = setTimeout( Delegate.create( this, 'hide_menu' ), 500 );
  }
  this.clearTimeout = function() {
    if ( !isNull( this.tmo ) ) {
      clearTimeout( this.tmo );
      this.tmo = null;
    }
    return true;
  }

  this.hide_menu = function() {
	removeClassName( this.trigger, 'selected' );
//    this.trigger.firstChild.src = this.trigger.firstChild.src.replace( /_on\.gif$/, '_off.gif' );
    if ( !isNull( this.sub_menu ) )
      this.sub_menu.style.display = 'none';
    this.shown = false;
    this.clearTimeout();
  }
  this.show_menu = function() {
//    this.trigger.firstChild.src = this.trigger.firstChild.src.replace( /_off\.gif$/, '_on.gif' );
	addClassName( this.trigger, 'selected' );
    if ( !isNull( this.sub_menu ) )
      this.sub_menu.style.display = 'block';
    this.shown = true;
    this.notify( 'shown' );
  }

  this.index = menuIndex;
  this.element = htmlElement;
  this.trigger = htmlElement.firstChild;
  this.sub_menu = htmlElement.getElementsByTagName( 'ul' );
  this.sub_menu = ( this.sub_menu.length == 1 )
    ? this.sub_menu[ 0 ] : null;

  this.active = false;

  this.shown = this.active;
  this.tmo = null;

  extend( this, new Listenable );

  if ( !isNull( this.sub_menu ) ) {
    if ( !this.active )
      this.hide_menu();
    addListener( this.sub_menu, 'mouseover', Delegate.create( this, 'onSubMenuMouseOver' ) );
    addListener( this.sub_menu, 'mouseout', Delegate.create( this, 'onSubMenuMouseOut' ) );
  }

  addListener( this.trigger, 'mouseover', Delegate.create( this, 'onTriggerMouseOver' ) );
  addListener( this.trigger, 'mouseout', Delegate.create( this, 'onTriggerMouseOut' ) );
}

function loadMenu() {
	var _menu = document.getElementById( 'page_menu' );
	if ( isSet( _menu ) ) {
		var triggers = _menu.childNodes;
		for( var i=0; i<triggers.length; i++ ) {
			if ( isSet( triggers[ i ].tagName ) && triggers[ i ].tagName.toLowerCase() == 'li' ) {
				MenuManager.createItem( triggers[ i ] );
			}
		}
	}
}

function resizeMenu() {
	var active = MenuManager.getActiveItem();
	if ( !isNull( active ) && active.shown ) {
		active.hide_menu();
		active.show_menu();
		active.startTimeout();
	}
}

addListener( window, 'load', loadMenu);
addListener( window, 'resize',resizeMenu);