
var GradientMenu = new Class({
		
		initialize: function(options)
		{
			this.setOptions(options);
			this.setStyles();
		},
		
		setStyles: function()
		{
			this.options.element.getElements('li').each(function(elm,index)
			{
				var elmAnchor = elm.getElement("a");
				
				// Calculate some stuff
				var intSibCount = elm.getParent().getChildren().length-1;
				var intPercent = (this.options.gradientPercent/intSibCount)*index;
				
				// Set color
			//	elmAnchor.setStyle('background-color', new Color(this.options.color).setBrightness(40+intPercent));
			//	elmAnchor.setStyle('background-color', new Color(elmAnchor.getStyle('background-color')).setSaturation(65));
				
				// If selected
				if(elmAnchor.getParent().hasClass('selected') == true) {
					//elmAnchor.setStyle('background-color', '#cfd41d');
					//elmAnchor.setStyle('color', '#000664');
				}
				
				if(elmAnchor.getParent().hasClass('competition') == true) {
					//elmAnchor.setStyle('background-color', '#fec266');
					//elmAnchor.setStyle('color', '#000664');
				}
				
				// Set behaviour
				elmAnchor.addEvent('mouseenter', this.mouseOverEvent.bind(this));
				elmAnchor.addEvent('mouseleave', this.mouseOutEvent.bind(this));
				elmAnchor.set('morph', {duration: 250, transition: 'quad:out'});
			}.bind(this));
		},
		
		/* Events */
		mouseOverEvent: function(event)
		{
			var event = new Event(event);
			//event.target.mouseOverEffect.stop();
			if(!event.target.oldcolor)
			{
				event.target.oldcolor = event.target.getStyle('background-color');
			}
			var newColor = new Color(event.target.getStyle('background-color')).mix('#FFF').mix(event.target.getStyle('background-color')).setSaturation(50);
			event.target.morph({
				//'background-color': newColor.toString(),
				'margin-left': 5,
				'margin-right': 5
			});
			//event.target.setStyle('background-color', new Color(event.target.getStyle('background-color')).setBrightness(70));
		},
		
		mouseOutEvent: function(event)
		{
			var event = new Event(event);
			//event.target.mouseOverEffect.stop();
			event.target.morph({
				//'background-color': event.target.oldcolor,
				'margin-left': 0,
				'margin-right': 0
			})
		}

});

// Extend with options utility
GradientMenu.implement(new Options);
