var Quicknavi = new Class({
	initialize: function(element, options) {
		if(Browser.loaded){
			this.setup(element, options);
		} else{
			window.addEvent('domready', this.setup.pass([element, options]));
		}
	},
	setup: function(element, options) {   
	       
    var hidetimer;
    var hidden = true;
    var delay = 0;
    var navi_height = $(options.naviID).getSize().y;
    if (options.maxHeight && navi_height>options.maxHeight) {
      navi_height = options.maxHeight;
      $(options.naviID).setStyle('overflow-x', 'hidden');
      $(options.naviID).setStyle('overflow-y', 'auto');
    }
    var quicknavi = new Fx.Morph(options.naviID);
    quicknavi.addEvent('complete', function() {
         if (hidden) $(options.naviID).setStyle('display', 'none');
    });  
    
    $(options.naviID).setStyle('display', 'none');
  
  	$(options.buttonID).addEvents({
      click: function(event){
       $clear(hidetimer);
			 showfunction();
			 event.stop();
      },
      mouseleave: function(){
        hidetimer = hidefunction.delay(delay, this);
      }
    });
    $(options.naviID).addEvents({
      mouseenter: function(){
       $clear(hidetimer);
      },
      mouseleave: function(){
        hidetimer = hidefunction.delay(delay, this);
      }
    });
    var showfunction = function(){ 
      var qnpos = qnStartEnd(1);
      $(options.naviID).setStyle('display', 'block');
      $(options.naviID).setStyle('top', qnpos['startY']);
      $(options.naviID).setStyle('left', qnpos['startX']); 
      $(options.naviID).setStyle('height', '0px');
      
      delay = options.delay;
      hidden = false;
      quicknavi.start({
    		height: navi_height+'px',
    		top: qnpos['endY']
    	});
  		
    }; 
    var hidefunction = function(){ 
      var qnpos = qnStartEnd(0);
      
      delay = 0;
      hidden = true;
      quicknavi.start({
    			height: '0px',
    			top: qnpos['endY']
    	});
    }; 
  
    var qnStartEnd = function(direction){
      var buttonelem = $(options.buttonID);
      var buttonpos = buttonelem.getCoordinates();
      var pos = new Array();
      if (direction == 1) {
        pos['startY'] = buttonpos['top'];
        pos['endY'] = buttonpos['top']-navi_height;
        pos['startX'] = buttonpos['left'];
        pos['endX'] = pos['startX'];
      } else {
        pos['startY'] = buttonpos['top']-navi_height;
        pos['endY'] = buttonpos['top'];
        pos['startX'] = buttonpos['left'];
        pos['endX'] = pos['startX'];
      }
      
      return pos;
    };
  

	}
});

