var _scrollApi;
var _scrollInterval;
var _scrollWaitInterval;

$(document).ready(function(){
            /*$("#mainmenu > li").hover(
                function(){ $("ul", this).fadeIn("slow"); },
                function(){ $("ul", this).fadeOut("slow"); }
            );*/
            $("#mainmenu li").hoverClass("sfHover");
            _scrollApi = $("#scrollblock").scrollable({api:true,circular:true});

            StartAutoScroll();

            $("#scrollBrowseLeft").click(ManualMoveLeft);
            $("#scrollBrowseRight").click(ManualMoveRight);
            
            $(".thumbscontainer a[rel]").overlay();
        });

        $.fn.hoverClass = function(c) {
            return this.each(function(){
                $(this).hover(
                    function() {$(this).addClass(c);},
                    function() {$(this).removeClass(c);}
                );
            });
        };

function ManualMoveLeft()
{
    if(_scrollInterval)
        clearInterval(_scrollInterval);
    if(_scrollWaitInterval)
        clearInterval(_scrollWaitInterval);

    _scrollWaitInterval = setInterval(StartAutoScroll, 10000);

    _scrollApi.prev();
}

function ManualMoveRight()
{
    if(_scrollInterval)
        clearInterval(_scrollInterval);
    if(_scrollWaitInterval)
        clearInterval(_scrollWaitInterval);

    _scrollWaitInterval = setInterval(StartAutoScroll, 10000);

    _scrollApi.next();
}

function StartAutoScroll()
{
    if(_scrollWaitInterval)
        clearInterval(_scrollWaitInterval);

    _scrollInterval = setInterval(AutoScroll, 4200);
}

function AutoScroll()
{
    var size = _scrollApi.getSize();
    var index = _scrollApi.getIndex();

    if(index == (size-1))
    {
        _scrollApi.begin(0);
    }
    else
    {
        _scrollApi.next();
    }
}