var mooNav = new Class({
	Implements: [Events,Options],
	
	options: {
		autoPosition: true,				// true, false -- setting to automatically set attributes such as position and margin
		fade: false,							// true, false -- use fade effect on show / hide
		fadeDuration: 500,				// int -- fade effect duration
		mode: 'vertical',				// horizontal, vertical -- what type of nav
		onShow: $empty,					// function(parent, subnav) -- function to fire upon showing subnav
		onHide: $empty,					// function(parent, subnav) -- function to fire upon hiding subnav
		parentClass: 'has-sub',			// string -- class that gets added to any parent li element
		slide: false,						// true, false -- use slide effect on show / hide
		slideDuration: 100				// int -- slide effect duration
	},
	
	initialize: function(nav, options) {
		this.setOptions(options);
		if(typeof nav == 'string') { nav = $(nav); }
		
		//set instance to variable to easily access options
		var that = this;
		
		nav.getElements('li').each(function(li) {
			//subnav var
			var child = li.getElement('ul');
			
			//check each li for a subnav
			if(child) {
				//determine subnav level (for positioning and slide direction)
				var level = child.getParents('ul').length;
				
				//add class to any parent element
				li.addClass(that.options.parentClass);
				
				if(that.options.slide) {
					//if slide is enabled, inject a wrapper div and set styles (if enabled)					    
					var container = new Element('div').inject(li).adopt(child);
					if(that.options.autoPosition) { that.setCss(container, level, that.options.fade, that.options.slide); }
					var slide = new Fx.Slide(child, { mode: level > 1 || that.options.mode == 'vertical' ? 'horizontal' : 'vertical', link: 'cancel', duration: that.options.slideDuration }).hide();
					child = container;
				} else {
					//else set styles to ul element (if enabled)	    
					var container = new Element('div').inject(li).adopt(child);
					if(that.options.autoPosition) { that.setCss(container, level, that.options.fade, that.options.slide); }
					child = container;
				}
				
				//set the fade duration
				child.set('tween', { duration: that.options.fadeDuration });
				
				li.addEvents({
					mouseenter: function() {
						if(that.options.slide) {
							slide.slideIn();
							if(that.options.fade) { child.fade('in'); }
							that.fireEvent('show', [li, child.getElement('ul')]);
						} else {
							child.fade(that.options.fade ? 'in' : 'show');
							that.fireEvent('show', [li, child]);
						}
					},
					mouseleave: function() {
						if(that.options.slide) {
							slide.slideOut();
							if(that.options.fade) { child.fade('out'); }
							that.fireEvent('hide', [li, child.getElement('ul')]);
						} else {
							child.fade(that.options.fade ? 'out' : 'hide');
							that.fireEvent('hide', [li, child]);
						}
					}
				});
			}
		});
	},
	
	setCss: function(container, level, fade, slide) {
		var parent = container.getParent('li');
		
		container.setStyle('position', 'absolute');
		container.setStyle('z-index', 999999);
		if(fade || !slide) { container.setStyle('opacity', 0); }
		if(level > 1) {
		    var container_left = parent.getStyle('width').toInt() + parent.getStyle('border-left-width').toInt() + parent.getStyle('border-right-width').toInt();
			container.setStyles({
				'left': container_left,
				'margin-top': (parent.getStyle('height').toInt() + parent.getStyle('border-top-width').toInt()) * -1
			});
		}
		
		if(level > 1) {
		    container_left -= 20;
            container.setStyles({
                'padding-left': 9,
                'left': container_left,
                'background': 'transparent url(/images/pfeil-box.gif) no-repeat left top'
	        });
		}
	}
});