var CLOSE_INTERVAL = 1500;  // マウスアウトからMenuを閉じるまでの時間(millsec)

var MenuControl = {
    createMenu : function(){
        this.menus = new Array();
        this.menus.push(new Menu( "Navigator-Tools" ,"Menu-Tools"));
        this.menus.push(new Menu( "Navigator-Entries" ,"Menu-Entries"));
        this.menus.push(new Menu( "Navigator-Comments" ,"Menu-Comments"));
        this.menus.push(new Menu( "Navigator-TrackBacks" ,"Menu-TrackBacks"));
        this.menus.push(new Menu( "Navigator-Archives" ,"Menu-Archives"));
        this.menus.push(new Menu( "Navigator-Categories" ,"Menu-Categories"));
        this.menus.push(new Menu( "Navigator-TagCroud" ,"Menu-TagCroud"));
        this.menus.push(new Menu( "Navigator-BookMark" ,"Menu-BookMark"));
        
    },
    
    closeActiveMenu : function(  ){
        if( this.active ){
            this.active.closeMenu();
        }
    },
    
    setActiveMenu : function( menu ){
        this.active = menu
    }
    
}

var Menu = Class.create();
Menu.prototype = {
    isOpen : true,
    
    initialize : function( navigator , menu){
        this.navigator = $(navigator);
        this.menu = $(menu);
        
        Event.observe( this.navigator , "mouseout" , this.onmouseout.bind( this), true) ;
        Event.observe( this.navigator , "mouseover" , this.onmouseover.bind( this), true) ;
        Event.observe( this.menu , "mouseout" , this.onmouseout.bind( this), true) ;
        Event.observe( this.menu , "mouseover" , this.onmouseover.bind( this), true) ;
        
        this.isOpen = false;
        new Effect.SlideUp( this.menu.id, {duration : 0 } );
    },
    
    onmouseover : function( evt ) {
        if( !this.isOpen ) {
            this.openMenu();
            return;
        }
        
        clearTimeout( MenuControl.timerID );
        MenuControl.timerID = undefined;

    },

    onmouseout : function( evt ) {
        if( !this.isOpen ) return;

        MenuControl.timerID = setTimeout( this.closeMenu.bind( this ) , CLOSE_INTERVAL );

    },
    
    openMenu : function( evt ){
        if( this.isOpen ) return;
        if( !this.init ){
            this.menu.style.visibility = 'visible';
            this.init = true;
        }
        MenuControl.closeActiveMenu();

        if( MenuControl.nowEffect != undefined && MenuControl.nowEffect.state != "finished" ){
            MenuControl.timerID = setTimeout( this.openMenu.bind( this ) , 20 );
            return;
        }

        if( MenuControl.timerID != undefined ){
            clearTimeout( MenuControl.timerID );
            MenuControl.timerID = undefined;
        }
        
        this.isOpen = true;
        this.menu.style.zIndex = 1000;
        MenuControl.nowEffect = new Effect.SlideDown( this.menu.id, {duration : 0.3 } );
        MenuControl.setActiveMenu (this);
    },
    
    closeMenu : function( evt ){
        if( !this.isOpen ) return;

        if( MenuControl.nowEffect != undefined && MenuControl.nowEffect.state != "finished" ){
            MenuControl.timerID = setTimeout( this.closeMenu.bind( this ) , 20 );
            return;
        }
        if( MenuControl.timerID != undefined ){
            clearTimeout( MenuControl.timerID );
            MenuControl.timerID = undefined;
        }

        this.isOpen = false;
        MenuControl.nowEffect = new Effect.SlideUp( this.menu.id, {duration : 0.3 } );

        this.menu.style.zIndex = 0;
        MenuControl.setActiveMenu ( undefined);
    }
    
}

Event.observe( window , "load",MenuControl.createMenu.bind(MenuControl)  , false);