var Menu = Class.create();
Menu.prototype = {
	// ******************************************************************************
	// Constants
	// ******************************************************************************
	Version : '0.2',


	// ******************************************************************************
	// vars
	// ******************************************************************************

	menu : {}, // menu element
	menuRows : [],

	menuToggle : {},
	menuContent : {},
	
	activeRowIndex : null,
	

	
	

	//
	//  Initialize the menus
	//
	initialize: function(options) {
		//Object.extend(this.options, options || {});
		
	    this.options = Object.extend({
	    	
			menu : {}, // carousel element eg div
		    duration : 0.3,
			
		    // selectors
			selectors : {
		    	menu : '#navMainMetaWrap',

				toggle : 'h6',
				content : '#navExtra',
				
				dummy : '#dummy'
			},
			classNames : {
				toggleActive : 'menu_toggle_active',
				
				dummy : '#dummy'
			},

			dummy : '#dummy'
		}, options || {});
	
	    
		//document.observe('dom:loaded', this.start.bind(this));
	    this.start();
	},


	start : function(){

		this.menu = $$(this.options.selectors.menu).first();
		if(!this.menu) return;
		
		
		this.menuToggle = this.menu.select(this.options.selectors.toggle).first();
		if(!this.menuToggle) return;
		this.menuContent = this.menu.select(this.options.selectors.content).first();
		if(!this.menuContent) return;
		
		Event.observe(this.menuToggle, 'click', this.toggle.bind(this), false);
		
		Event.observe(this.menuToggle, 'mouseover', this.mouseoverHandler.bind(this), false);
		Event.observe(this.menu, 'mouseleave', this.mouseleaveHandler.bind(this), false);
			
		this.menuContent.setStyle({height : '0px'});

	},
	
	
	//
	//  Activate an menu 
	//
	toggle : function() {
		//console.info(index);
		if(this.menuToggle.hasClassName(this.options.classNames.toggleActive)){
			// close
			this.close();			

		} else {
			this.open();
		}
	},

	
	mouseoverHandler : function() {
		if(this.animating == true) return;
		
		if(!this.menuToggle.hasClassName(this.options.classNames.toggleActive)){
			this.open();
		}
	},

	
	mouseleaveHandler : function() {

		if(this.menuToggle.hasClassName(this.options.classNames.toggleActive)){
			this.close();
		}
		
	},
	
	
	open : function() {
		this.menuToggle.addClassName(this.options.classNames.toggleActive);
		startHeight = 0;
		endHeight = this.menuContent.scrollHeight;

		this.getEffect(this.menuContent, startHeight, endHeight);		
	},
	
	close : function() {
		this.menuToggle.removeClassName(this.options.classNames.toggleActive);
		startHeight = this.menuContent.scrollHeight;
		endHeight = 0;
		
		this.getEffect(this.menuContent, startHeight, endHeight);
	},
	
	
	// 
	// open an active menu
	//
	getEffect : function(content) {

		effect = new Effect.Tween(content, startHeight, endHeight, {
			duration: this.options.duration,
			transition: Effect.Transitions.sinoidal,
			queue: {
				position: 'end', 
				scope: 'menuAnimation'
			},
			beforeStart: function() {
				this.animating = true;
			}.bind(this),
			afterFinish: function() {
				this.animating = false;
			}.bind(this)
		}, function(p){
				content.setStyle({height : p + 'px'});
			}.bind(this)
		);
		return effect;
	}

}