
$(document).ready(function() {

    var timeValue = 5000;
    
    function setVisible(index) {
        //$(".top-articles .article:eq("+index+")").fadeIn();
        $(".top-articles .article:eq("+index+")").css("display", "block");
        $(".top-articles .paging a[rel="+(Number(index)+1)+"]").addClass("selected");
    }
    
    function clearVisible() {
        //$(".top-articles .article").fadeOut();
        $(".top-articles .article").css("display", "none");
        $(".top-articles .paging a").removeClass("selected");
    }

    function onTimeout() {
        clearTimeout($(".top-articles").data("handler"));
        var current = $(".top-articles").data("current");
        current += 1;
        if (current==$(".top-articles .article").length)
            current = 0;
        
        clearVisible();
        setVisible(current);
        
        $(".top-articles").data("current", current);
        $(".top-articles").data("handler", setTimeout(onTimeout, timeValue));
    }

    function startRotation(index) {
        clearVisible();
        setVisible(index);
        $(".top-articles").data("current", index);
        $(".top-articles").data("handler", setTimeout(onTimeout, timeValue));
    }
    

    $(".top-articles .paging a").click(
        function() {
            clearTimeout($(".top-articles").data("handler"));
            startRotation(this.getAttribute("rel")-1);
            return false;
        }
    );

    $(".top-articles .article").hover(
        function() {
            clearTimeout($(".top-articles").data("handler"));
            return false;
        },
        function() {
            //var current = $(".top-articles").data("current")+1; 
            //if (current==$(".top-articles .article").length)
            //  startRotation(0);
            //else
            //  startRotation(current);
            startRotation($(".top-articles").data("current"));
            return false;
        }
    );
    
    $(".top-articles .article").css("display", "none");
    startRotation(0);
    

        
    
    

});
