var CosMooBounceMenu = new Class({
	Implements: [Options],
	

	version: '0.4',
 
	options: {
		submenu: '.submenu',
		opacity: 0.7,
		background: '#000000',
		start: null,
		morphOps: {
			'duration':300, 
			'transition': Fx.Transitions.Sine.easeIn
		}
	},
 
	
	initialize: function(bouncer, elements, options)
	{
		var obj = this;
		this.setOptions(options);
		var first = elements[0];
		this.morph = new Fx.Morph(bouncer, this.options.morphOps);
		
		if (this.options.start) (function(){obj.bounce(bouncer, obj.options.start, true, false);}).delay(200);
		
		elements.addEvent('mouseenter', function(ev){
			obj.bounce(bouncer, this, false, true);
		});
		
		elements.getParent().addEvent('mouseleave', function(ev){
			if (obj.options.start) obj.bounce(bouncer, obj.options.start, false, false);
			else
			{
				obj.bounce(bouncer, first, false, false, 0);
			}
			obj.close();
		});
		
		//Menu che si espande
		elements[0].getParent().getElements(this.options.submenu).each(function(el){
			obj.setupMenu(el);
		});
	},
	
	setupMenu: function(el)
	{
		el.setStyle('display','block');
		var h = el.getSize().y;
		el.setStyle('display','none');
		el.store('h', h);
		el.setStyle('display', 'none');
		el.setStyle('height', 0);
		el.setStyle('width', '100%');
		el.setStyle('position','absolute');
		el.getParent().setStyle('position','relative');
		el.setStyle('top',47);
		el.setStyle('left',0);
		
		//Se devo fare l'opacity al contenuto sotto:
		if (this.options.opacity<1)
		{
			var div1 = new Element('div', {'html':el.get('html')});
			var div2 = new Element('div');
			
			div2.setStyle('background-color',this.options.background);
			
			div1.setStyles({
				'position':'absolute',
				'top':0,
				'left':0,
				'z-index':100,
				'padding':el.getStyle('padding')
			});
			
			div2.setStyles({
				'position':'absolute',
				'top':0,
				'left':0,
				'width':'100%',
				'height': h,
				'z-index':50,
				'opacity':this.options.opacity
			});
			
			el.setStyle('padding',0);
			
			el.empty();
			el.adopt(div1, div2);
		}
	},
	
	bounce: function (bouncer, element, set, open, width)
	{
		var obj = this;
		this.close();
		this.morph.cancel();
		var menu = element.getChildren(this.options.submenu)[0];
		var coords = element.getPosition(bouncer.getParent());
		var dims = element.getSize();
		
		
		if (isNaN(width)) width = dims.x;
		if (set)
		{
			this.morph.set({
				'left':coords.x,
				'width':width
			});
		}
		else
		{
			this.morph.start({
				'left':coords.x,
				'width':width
			}).chain(function(){if (open) obj.open(menu);});
		}
		
	},
	
	open: function(menu)
	{
		if (!menu) return;
		menu.setStyle('display', 'block');
		menu.tween('height', menu.retrieve('h'));
		this.menuOpen = menu;
	},
	
	close: function()
	{
		if (!this.menuOpen) return;
		
		this.menuOpen.setStyles({
			'display':'none',
			'height':0
		});
		
		
	}
});