/*
SushiMenu for Mootools 1.2.3
(c) 2009 Enrique Erne
MIT License
*/

var SushiMenu = new Class({
	Implements: Options,
	options: {
		item: 'li',
		submenu: 'ul',
		animate: 'height',
		property: 'getHeight',
		modify: 'sum',
		over: {duration: 350},
		out: {duration: 560},
		fixIE: true
	},
	original: [],
	initialize: function(menu, options){
		this.setOptions(options);
		var items = ($type(this.options.item) === 'element') ? [this.options.item] : menu.getChildren(this.options.item);
		// fix IE quirks
		if(Browser.Engine.trident && this.options.fixIE){
			menu.getElements(this.options.submenu).each(function(el){
				var kids = el.getChildren(($type(this.options.item) === 'element') ? 'li' : this.options.item);
				kids.getElement('a').setStyle('width', kids.getWidth().max() - (kids[0].getElement('a').getStyle('padding-left').toInt() + kids[0].getElement('a').getStyle('padding-right').toInt()));
			}.bind(this));
		}
		items.each(function(el, i){
			var submenu = el.getElement(this.options.submenu), animate = this.options.animate;
			if ($chk(submenu)){
				this.original[i] = submenu.getChildren('li a')[this.options.property]()[this.options.modify]();
				// TAB navigation for IE using the TAB key  ->|
				if(Browser.Engine.trident) el.getElements('a:first-child, li:last-child a').addEvent('focus', function(){
					menu.getElements('li.hover').each(function(elh){
						elh.fireEvent('mouseleave');
					});
					el.fireEvent('mouseenter');
				});
				submenu.setStyle(animate, 0); // sets the property to zero. works for height and opacity, but should  proabaly be configurable
				var over = this.options.over, out = this.options.out
				// events should be configurable
				el.addEvents({
					'mouseenter': function(){
						this.over(el, i);
			//			submenu.set('tween', over).tween(animate, original);
			//			el.addClass('hover');
					}.bind(this),
					'mouseleave': function(){
						submenu.set('tween', out).tween(animate, 0).get('tween').chain(function(){
							el.removeClass('hover');
						});
					}
				});
			}
		}.bind(this));
	},
	over: function(element, i){
		element.getElement(this.options.submenu).set('tween', this.options.over).tween(this.options.animate, this.original[i]);
		element.addClass('hover');
	},
	out: function(){
		//console.log(this.options.animate);
	}
});


window.addEvent('load', function(){

	// initiate submenu
	$$('#MultiDropDown li ul li ul').getParent('li').each(function(el){
	  new SushiMenu(el, {
	    item: el,
	    animate: 'opacity',
	    property: 'getOpacity',
	    modify: 'max',
	    fixIE: false
	  });
	});
	// initiate mainmenu
	new SushiMenu($('MultiDropDown').removeClass('noscript'), {
	  animate: 'opacity',
	  property: 'getOpacity',
	  modify: 'max'
	});

});