var MenuFader = {
	animations: {},
	menuItems: undefined,
	init: function () {
		MenuFader.menuItems = $$('#navigation li a');
		MenuFader.calculateSizes();

		var linkStyles = {
			'z-index': '2',
			'position': 'absolute',
			'right': '25px',
			'top': '3px'}

		MenuFader.menuItems.each(function (el) {
			el.addEvents({
				'mouseover': function () {
					MenuFader.doFade(el.getParent(), 'in');
				},
				'mouseout': function () {
					MenuFader.doFade(el.getParent(), 'out');
				}
			});

			var tweenSpan = new Element('span');
			var parentSizes = el.getParent().getSize();
			tweenSpan.setStyles({'opacity': 0, 'width': parentSizes.x, 'height': parentSizes.y});
			el.getParent().adopt(tweenSpan);
			el.setStyles(linkStyles);
		});
	},

	calculateSizes: function () {
		var sizes;

		MenuFader.menuItems.each(function (el) {
			el.setStyles({'position': 'static', 'width': 'auto', 'height': 'auto'});
			sizes = el.getSize();

			el.setStyles({'width': sizes.x, 'height': sizes.y, 'position': 'absolute'});
			el.getParent().setStyles({'width': sizes.x, 'height': sizes.y});
		});
	},

	doFade: function (item, inOrOut) {
		var span = item.getElement('span');
		if (inOrOut == 'in') {
			new Fx.Tween(span, {'link': 'cancel', 'duration': 1}).start('opacity', 1);
		} else if (inOrOut == 'out') {
			new Fx.Tween(span, {'link': 'cancel'}).start('opacity', 0);
		} else {
			if (console) console.error('Invalid value for parameter inOrOut');
		}
	}
}

//window.addEvent('domready', MenuFader.init);