$(function() {

    var userAgent = navigator.userAgent.toLowerCase();
    var browserVersion = (userAgent.match(/.+(?:rv|webkit|khtml|opera|msie)[\/: ]([\d.]+)/) || [0, '0'])[1];

    if (/msie/.test(userAgent) && !/opera/.test(userAgent)) {
        $.browser.msie = true;
        $.browser.opera = false;

        $.browser.version = parseInt(browserVersion);

        if ($.browser.version < 7 && !window.XMLHttpRequest) {
            $.browser.version = 6;
            $.browser.msie6 = true;
        }
    }

    //$("#i-1").show().find("span").css("bottom", "0");

    var started = false;
    var index = 2;

    var jumpTo = function(i) {

        var a = $("#i-wrapper>ul>li.active");
        var b = $("#i-" + i);

        if (a.size() > 0) {
            var ci = parseInt(a.attr("id").replace("i-", ""));
        }

        $("#i-jumper>a").removeClass("active").filter("#i-j-" + i).addClass("active").end();

        if ($.browser.msie6) {
            a.removeClass("active").hide();
            b.addClass("active").show();
        }
        else {
            a.removeClass("active").fadeOut(1000);
            b.addClass("active").fadeIn(1500);
        }

        if (i === 5) {
            $("span", a).animate({ "bottom": "-96px" }, 300, function() {
                $("#i-5-l", b).animate({ "left": "0" }, 500);
                $("#i-5-r", b).animate({ "right": "0" }, 500);
            });
        }
        else if (ci === 5) {
            $("#i-5-l", a).animate({ "left": "-334px" }, 500);
            $("#i-5-r", a).animate({ "right": "-335px" }, 500, function() {
                $("span", b).animate({ "bottom": "0" }, 500);
            });
        }
        else if (i === 1) {
            $("span", b).animate({ "bottom": "0" }, 500);
        }
        else {
            $("span", a).animate({ "bottom": "-96px" }, 300, function() {
                $("span", b).animate({ "bottom": "0" }, 500);
            });
        }

        i++;
        if (i > 5) {
            i = 1;
        }
        index = i;

        started = true;
    };

    jumpTo(1);

    var interval = setInterval(function() {
        jumpTo(index);
    }, 5000);

    $("#i-jumper>a, #i-wrapper>ul>li").hover(function() {
        clearInterval(interval);
        if ($(this).is("a")) {
            jumpTo(parseInt(this.id.replace("i-j-", "")));
        }
    }, function() {
        interval = setInterval(function() {
            jumpTo(index);
        }, 5000);
    });
});