var setTabIndex = function(){
		$(".ColorSelected").removeClass("ColorSelected");
		$(".TWICS").eq(parseInt($(".TWITab").tabSwitch('index'))).addClass("ColorSelected");
}

$(function(){
	$(".TWITab").tabSwitch('create',{type:"toggle", height: 183, width: 678});
	
	$(".TWICS").hover(function(){
		$(".TWITab").tabSwitch('toggle');
		startAutoSwitch();				   
		$(".TWITab").tabSwitch('moveTo',{index: $(".TWICS").index(this)},setTabIndex);
	});
	//When user click on the toggle type
	$(".toggleType").click(function(){
		var Obj=$(this);
		//Like before, grey out the example
		$("#tabSlider").animate({"opacity":"0.3"},500, function(){
			//reset it
			$(".TWITab").tabSwitch('destroy');
			$("#tabSwitchAutoToggle").attr("src","assets/images/autobaron.jpg");
			//Start with the toggle effect
			$(".TWITab").tabSwitch('create', {type: "toggle", toggle:  Obj.attr("rel"), height: 300, width: 440});
			startAutoSwitch();
			//reset the number and return the opacity
			setTabIndex();
			$("#tabSlider").animate({"opacity":"1"},500);
		});
	});
	
	$(".TWICS").click(function(){ 
		var sezione = $(this).attr('id');
		var tipo = sezione.split("TWICS");
        var id_categoria = $(this).attr('rel').split("|"); 
		var scritta = "";
		if (id_categoria[1] == 'eng')
			scritta="products";
		else
			scritta="prodotti";
		window.location.href = '/'+scritta+'/'+id_categoria[2]+'/'+id_categoria[0];
	});
	
	var startAutoSwitch = function(){
	//Let the tab auto toggle
	$(".TWITab").tabSwitch('toggleAuto',{interval: 3000},function(){
		//Change the index number everytime it step
		setTabIndex();
	});
	}
	
	
	//When user click on the auto
	$(document).ready(function(){
		startAutoSwitch();
	});	
});