var _tab = 0;
var _tabLinks;
var _interval;

function RegisterLastProductsRoll(event) {
	_tab = event ? event.target.id.charAt(4) : _tab;
	clearInterval(_interval);
	_interval = setInterval('_tab=(++_tab)%5;_tabLinks.eq(_tab).click();', 6000);
}

$(document).ready(function () {
    //Initialize 
    //Set the selector in the first tab
    
    _tabLinks = $(".TabMenu .alink a[id^=Tab_]");
	_tabLinks.mouseup(RegisterLastProductsRoll);
	RegisterLastProductsRoll();
	
    $(".TabMenu a:first").addClass("selector");

    //Basic hover action
    $(".TabMenu a").mouseover(function () { $(this).addClass("hovering"); });
    $(".TabMenu a").mouseout(function () { $(this).removeClass("hovering"); });

    //Add click action to tab menu
    $(".TabMenu a").click(function () {
        //Remove the exist selector
        $(".selector").removeClass("selector");
        //Add the selector class to the sender
        $(this).addClass("selector");
        //Find the width of a tab
        var TabWidth = $(".TabContent:first").width();
        if (parseInt($(".TabContent:first").css("margin-left")) > 0) TabWidth += parseInt($(".TabContent:first").css("margin-left"));
        if (parseInt($(".TabContent:first").css("margin-right")) > 0) TabWidth += parseInt($(".TabContent:first").css("margin-right"));
        //But wait, how far we slide to? Let find out
        var newLeft = -1 * $(".TabMenu a").index(this) * TabWidth;
        //Ok, now slide
        $(".AllTabs").animate({ left: +newLeft + "px" }, 1300);
    });
});