var Buttons = Class.create ({
	
	initialize: function(container)
	{
		this.container = container;
		this.effectQueue = new Array();
		
		this.addActions();
	},
	
	addActions: function()
	{	
		var counter = 1;
		
		this.container.select('a').each(function(element)
		{
			element.store('id', counter);
			counter++;
			element.observe('mouseenter', this.rollover.bind(this));
		}.bind(this));
		
		this.container.select('a').each(function(element)
		{
			element.observe('mouseleave', this.rollout.bind(this));
		}.bind(this));
	},
	
	rollover: function(event)
	{	
		if (!event.element().retrieve('id'))
		{
			var elementId = 0;
			var temp = 0;
			while(!elementId)
			{
				elementId = event.element().up(temp).retrieve('id');
				temp++;
			}
		}
		else
		{
			var elementId = event.element().retrieve('id');
		}
		
		var loopCounter = 1;
		this.clearEffectQueue();
		
		this.container.select('a').each(function(element)
		{	
			var currentOpacity = element.getOpacity();
			
			if(loopCounter != elementId)
			{
				this.effectQueue[this.effectQueue.length] = new Effect.Opacity(element, { from: currentOpacity, to: 0.6, duration: 0.3 });
			}
			else
			{
				this.effectQueue[this.effectQueue.length] = new Effect.Opacity(element, { from: currentOpacity, to: 1.0, duration: 0.3 });
			}
			loopCounter++;
		}.bind(this));
	},
	
	rollout: function(event)
	{		
		if (!event.element().retrieve('id'))
		{
			var elementId = 0;
			var temp = 0;
			while(!elementId)
			{
				elementId = event.element().up(temp).retrieve('id');
				temp++;
			}
		}
		else
		{
			var elementId = event.element().retrieve('id');
		}
		
		var loopCounter = 1;
		this.clearEffectQueue();
		
		this.container.select('a').each(function(element)
		{	
			var currentOpacity = element.getOpacity();
			
			if(loopCounter != elementId)
			{
				this.effectQueue[this.effectQueue.length] = new Effect.Opacity(element, { from: currentOpacity, to: 1.0, duration: 0.3 });
			}
			loopCounter++;
		}.bind(this));
	},
	
	clearEffectQueue: function()
	{
		this.effectQueue.each(function(effect) {
			effect.cancel();
		});
		
		this.effectQueue.clear();
	}
});


document.observe('dom:loaded', function()
{	
	if ($("expertiseButtons"))
	{
		new Buttons($('expertiseButtons'));
	}
});