function extMenu(mnuObj, mnuBtn, timeout){
    this.obj        = $(mnuObj);
    this.mnuBtn     = $(mnuBtn);
    this.objUl      = $(this.obj).down('ul');
    this.objWidth   = null;
    
    this.mnuBtnPos  = Position.cumulativeOffset(this.mnuBtn)
    
    this.timer      = null;
    this.timeout    = timeout;
    
    this.isRun      = false;
    this.menuTimer  = null;
    this.openTimeout= 1;
    this.openCounter= 0;
    this.iAmOpera   = null;
}

extMenu.prototype.init = function(){
    var oThis = this;
    Event.observe($(this.mnuBtn), 'click', function(){
        oThis.clearTimeout();
        switch($(oThis.obj).getStyle('display')){
            case 'block':
                oThis.closeMenu();
                break;
            default:
                oThis.objWidth==null ? oThis.objWidth = oThis.obj.getWidth()-4 : '';
            
                $(oThis.obj).setStyle({
                    display: 'block',
                    left   : oThis.mnuBtnPos[0] + $(oThis.mnuBtn).getWidth() - 29 + "px",
                    top    : oThis.mnuBtnPos[1]+"px",
                    clip   : 'rect(0px, 0px, 32px, 0px)'
                })
                oThis.openMenu();
                
                $(oThis.mnuBtn).setStyle({
                    display: 'none'
                });
                break;
        }
    });

    Event.observe($(this.obj), 'click', function(){
        oThis.closeMenu();
    });
    
    Event.observe($(this.obj), 'mouseout', function(){
        oThis.timer = setTimeout("newExtMenu.closeMenu()", oThis.timeout);
    })

    Event.observe($(this.obj), 'mousemove', function(){
        oThis.clearTimeout();
    })
    
}


extMenu.prototype.openMenu = function(){

    if(!this.isRun){
        this.openCounter = 0;
        this.isRun       = true;
        this.menuTimer   = setInterval("newExtMenu.openMenu()", this.openTimeout);
        return;
    }
    
    this.openCounter+=20;
    
    var clipRect = 'rect(0px,'+this.openCounter+'px,32px,0px)';
    $('extMenu').setStyle({
        clip: clipRect
    });
    
    if(this.openCounter>=this.objWidth){
        this.isRun = false;
        if (this.iAmOpera == null) {
            this.iAmOpera = $('extMenu').getWidth() ? false : true;
        }
        if (this.iAmOpera) {
            $('extMenu').setStyle({ width: this.objWidth+20+'px' });
        }
        
        clearInterval(this.menuTimer);
        
        this.clearTimeout();
        
        this.timer = setTimeout("newExtMenu.closeMenu()", this.timeout);
    }
}

extMenu.prototype.closeMenu = function(){
    if(!this.isRun){
        this.isRun       = true;
        this.menuTimer   = setInterval("newExtMenu.closeMenu()", this.openTimeout);
        return;
    }
    
    this.openCounter-=20;
    
    var clipRect = 'rect(0px,'+this.openCounter+'px,32px,0px)';
    $('extMenu').setStyle({
        clip: clipRect
    });
    
    if(this.openCounter<=0){
        this.isRun = false;
        clearInterval(this.menuTimer);
        
        $(this.obj).setStyle({
            display: 'none'
        })
        $(this.mnuBtn).setStyle({
            display: 'block'
        })
    }
}


extMenu.prototype.clearTimeout = function(){
    if(this.timer!=null){
        clearTimeout(this.timer);
        this.timer = null;
    }
}

var newExtMenu = null;
Event.observe(window, 'load', function(){
    newExtMenu = new extMenu($('extMenu'), $('extMenuBtn'), 2000);
    newExtMenu.init();
});