var sliderbox;
var tabs;
function initSliderTabs()
{
	if(document.getElementById("slides"))
	{
		var steps = 1;
		var visible = 6;
		sliderbox = $('slides');
		var current = 0;
		var number = sliderbox.getElements("li").length;
		var width = sliderbox.getElement("li").getWidth();
		sliderbox.getElement("li").addClass("active");
		var margin = 0;
		sliderbox.fx = new Fx.Morph(sliderbox, {duration: 700, transition: Fx.Transitions.Sine.easeOut});
		
		$("quantity").innerHTML = "1 - " + visible + " of " + number + " Bikes";
		
		var flag = 1;
		/* slide right */
		$$(".forward").addEvent('click', function()
		{
			sliderbox.fx.cancel();
			if(flag == 2)
				current = -steps;
				
			current += steps;
			$("quantity").innerHTML = current+1 + " - " + parseInt(current + visible) + " of " + number + " Bikes";

			if(current >= number - visible)
			{
				margin += (number - current - (visible - steps)) * width;
				current = -steps;
				flag = 0;
			}
			else
			{
				margin = current * width;
				flag = 1;
			}
			
			sliderbox.fx.start({'margin-left': -margin});
		});
		
		/* slide left */
		$$(".back").addEvent('click', function()
		{
			sliderbox.fx.cancel();
			if(flag == 0)
				current = number - visible;
			flag = 1;
			
			current -= steps;
			
			if(current+steps <= 0)
			{
				margin = (number - visible) * width;
				current = number - visible;
				flag = 2;
			}
			else if(current+steps < steps)
			{
				margin = 0;
				current = 0;
			}
			else
				margin = current * width;
			
			$("quantity").innerHTML = current+1 + " - " + parseInt(current + visible) + " of " + number + " Bikes";
			sliderbox.fx.start({'margin-left': -margin});
		});
		
		/* tabs */
		tabs = $$(".one-bike");
		tabs.setStyles({"display": "none", "opacity": 0});
		tabs[0].setStyles({"display": "block", "opacity": 1});
		
		sliderbox.getElements("li").each(function(el, i)
		{
			el.addEvent("click", function()
			{
				chander(i);
				this.addClass("active");
			});
		});
		
		var cur;
		$$(".prev").each(function(el, i)
		{
			el.addEvent("click", function()
			{
				if(i <= 0)
					cur	= number-1;
				else
					cur	= i-1;
				
				chander(cur);
				sliderbox.getElements("li")[cur].addClass("active");
			});
		});
		$$(".next").each(function(el, i)
		{
			el.addEvent("click", function()
			{
				if(i >= number-1)
					cur	= 0;
				else
					cur	= i+1;
				
				chander(cur);
				sliderbox.getElements("li")[cur].addClass("active");
			});
		});
	}
}

function chander(z)
{
	sliderbox.getElements("li").removeClass("active");
	tabs.setStyles({"display": "none", "opacity": 0});
	tabs[z].setStyles({"display": "block", "opacity": 1});
}

if (window.addEventListener)
	window.addEventListener("load", initSliderTabs, false);
else if (window.attachEvent)
	window.attachEvent("onload", initSliderTabs);