window.addEvent('domready', function(){
	
	$('step-by-step-content-border').getElements('a').addEvent('click', function(e)
	{
		e = new Event(e).stop();
		
		var previousActive2 = $('step-by-step-content-border').getElement('a.active');
		var activeText = this.name;
		var relContainers = $('step-by-step-content-border').getElements('.relative-container');
		
		if(previousActive2 != this)
		{	
			previousActive2.removeClass('active');
			this.addClass('active');
			
			for(var i=0;i<relContainers.length;i++)
			{
				relContainers[i].addClass('hide');
				
				if(relContainers[i].id == activeText)
				{
					relContainers[i].removeClass('hide');
				}
				
			}									
			
		}	
	
	});
	
	
	$('step-by-step-top').getElements('a').addEvent('click', function(e)
	{
		e = new Event(e).stop();
		
		slideStepByStep(this);
		
	});
	
	$('step-by-step-content-border').getElements('a.nextlink').addEvent('click', function(e)
	{
		e = new Event(e).stop();

		var theLiWeWant = $('step-by-step-top').getElement('a[name='+this.name+']');
				
		slideStepByStep(theLiWeWant);
		
	});
	
	//function for sliding the step by step content
	function slideStepByStep(object)
	{
		var previousActive = $('step-by-step-top').getElement('a.active');
		
		if(previousActive != object)
		{	
			var offset = (parseInt(object.name)-1) * 510;

			var thisValue = (parseInt(object.name));
			var previousValue = (parseInt(previousActive.name))
			
			if(thisValue > previousValue)
			{
				var slideDuration = ((thisValue - previousValue) * 750);
			}
			else
			{
				var slideDuration = ((previousValue - thisValue) * 750);
			}
				
			var myFx = new Fx.Scroll('step-by-step-content-container', {
			offset: {
					'x': 0,
					'y': 0
				},
			duration: slideDuration
			}).start(offset);
			new Fx.Scroll(window, {duration:'short'}).toElement('step-by-step-top').start();
		
			object.addClass('active');
	
			if(object.name != '1')
			{
				
				previousActive.getParent().getNext().getElement('img').src= includesPath + "/images/employers/step-middle-off.jpg";
				previousActive.getParent().getPrevious().getElement('img').src= includesPath + "/images/employers/step-middle-off.jpg";
				object.getParent().getNext().getElement('img').src= includesPath + "/images/employers/step-middle-on.jpg";
				object.getParent().getPrevious().getElement('img').src= includesPath + "/images/employers/step-fishtails-on.jpg"
				$('step-by-step-top').getElement('a[name=1]').getParent().getPrevious().getElement('img').src= includesPath + "/images/employers/step-start-off.jpg";
				$('step-by-step-top').getElement('a[name=6]').getParent().getNext().getElement('img').src= includesPath + "/images/employers/step-six-off.jpg";
			}
			
			if(object.name == '1')
			{
				previousActive.getParent().getNext().getElement('img').src= includesPath + "/images/employers/step-middle-off.jpg";
				previousActive.getParent().getPrevious().getElement('img').src= includesPath + "/images/employers/step-middle-off.jpg";
				object.getParent().getNext().getElement('img').src= includesPath + "/images/employers/step-middle-on.jpg";
				object.getParent().getPrevious().getElement('img').src= includesPath + "/images/employers/step-start-on.jpg"
				$('step-by-step-top').getElement('a[name=6]').getParent().getNext().getElement('img').src= includesPath + "/images/employers/step-six-off.jpg";
			}
			
			if(object.name == '6')
			{
				previousActive.getParent().getNext().getElement('img').src= includesPath + "/images/employers/step-middle-off.jpg";
				previousActive.getParent().getPrevious().getElement('img').src= includesPath + "/images/employers/step-middle-off.jpg";
				object.getParent().getNext().getElement('img').src= includesPath + "/images/employers/step-six-on.jpg";
				object.getParent().getPrevious().getElement('img').src= includesPath + "/images/employers/step-fishtails-on.jpg"
				$('step-by-step-top').getElement('a[name=1]').getParent().getPrevious().getElement('img').src= includesPath + "/images/employers/step-start-off.jpg";
				
			}
			
			previousActive.removeClass('active');
		}
	}


});