﻿// Implemented by Costin Popescu
/// <reference path="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" />

var divs = new Array('item1', 'item2', 'item3', 'item4', 'item5', 'item6', 'item7', 'item8', 'item9', 'item10', 'item11');
var currentIndex = 0;
var maxIndex = divs.length - 1;
var itemsHeight = 299;
var interval;

$(document).ready(function () {
    //return;
    $('#current').html($('#' + divs[0]).html());
    $('#next').html($('#' + divs[1]).html());
    $('#prev').html($('#' + divs[maxIndex]).html());

    $("#downScroller, #upScroller").css("outline", "none");

    $("#downScroller").click(function () {
        clearInterval(interval);
        scrollDown(1500);
        return false;
    });

    $("#upScroller").click(function () {
        clearInterval(interval);
        scrollUp(1500);
        return false;
    });

    initPager();

    interval = setInterval('scrollDown(1500)', 10000);
});

function scrollDown(interval) {
    $("#itemsContainer").queue(function () {
        var currentPageNr = Number($(".scroller_btn.active_btn").removeClass("active_btn").attr("order"));
        if (currentPageNr < divs.length - 1) currentPageNr++;
        else currentPageNr = 0;
        $(".scroller_btn[order='" + currentPageNr + "']").addClass("active_btn");

        if (!interval) interval = 1500;
        $("#items").animate({
            top: '-=' + itemsHeight
        }, interval, 'swing', function () {
            countOrder();
            $("#itemsContainer").dequeue();
        });
    });
}

function scrollUp(interval) {
    $("#itemsContainer").queue(function () {
        var currentPageNr = Number($(".scroller_btn.active_btn").removeClass("active_btn").attr("order"));
        if (currentPageNr > 0) currentPageNr--;
        else currentPageNr = divs.length - 1;
        $(".scroller_btn[order='" + currentPageNr + "']").addClass("active_btn");

        if (!interval) interval = 1500;
        $("#items").animate({
            top: '+=' + itemsHeight
        }, interval, 'swing', function () {
            countOrder();
            $("#itemsContainer").dequeue();
        });
    });
}

function countOrder() {
    var i;

    i = parseInt($('#items').css('top').replace('px', '')) / itemsHeight;
    //	alert(i+' '+Math.ceil(i));
    if (i == Math.ceil(i)) {
        if (i == 0) {
            $('#next').html($('#current').html());
            $('#current').html($('#prev').html());
            $('#items').css('top', '-' + itemsHeight + 'px');
            currentIndex -= 2;
            if (currentIndex < 0) currentIndex = maxIndex + currentIndex + 1;
            $('#prev').html($('#' + divs[currentIndex]).html());
            currentIndex++;
            if (currentIndex > maxIndex) currentIndex = 0;
        }
        else if (i == -1) {
            currentIndex++;
            if (currentIndex > maxIndex) currentIndex = 0;
        }
        else if (i == -2) {
            $('#prev').html($('#current').html());
            $('#current').html($('#next').html());
            $('#items').css('top', '-' + itemsHeight + 'px');
            currentIndex += 2;
            if (currentIndex > maxIndex) currentIndex = currentIndex - maxIndex - 1;
            $('#next').html($('#' + divs[currentIndex]).html());
            currentIndex--;
            if (currentIndex < 0) currentIndex = maxIndex;
        }
    }

    return false;
}

function initPager() {
    $("#items").after('<div id="roundedPagerContainer"><center><div id="roundedPager"></div></center></div>');
    $("#roundedPager").width(divs.length * 26);
    for (var i = 0; i < divs.length; i++) {
        var link = document.createElement("a");
        $("#roundedPager").append(link);
        $(link).addClass("scroller_btn");
        $(link).attr("order", i);
        if (i == 0) $(link).addClass("active_btn");
    }
    $(".scroller_btn").click(function () {
        clearInterval(interval);
        var targetPageNr = Number($(this).attr("order"));
        var currentPageNr = Number($(".scroller_btn.active_btn").attr("order"));
        if (targetPageNr - currentPageNr == 1) scrollDown();
        else if (currentPageNr - targetPageNr == 1) scrollUp();
        else if (targetPageNr > currentPageNr) {
            fastForward(targetPageNr);
        }
        else if (targetPageNr < currentPageNr) {
            fastBackwards(targetPageNr);
        }
    });
}

function fastForward(targetPageNr) {
    $("#itemsContainer").queue(function () {
        var currentPageNr = Number($(".scroller_btn.active_btn").attr("order"));
        var k = targetPageNr - currentPageNr;
        for (var i = currentPageNr + 1; i <= targetPageNr; i++) {
            var newDiv = document.createElement("div");
            $(newDiv).html($("#" + divs[i]).html());
            $(newDiv).addClass("tempSlide");
            $("#next").before(newDiv);
        }

        $(".scroller_btn.active_btn").removeClass("active_btn");
        $(".scroller_btn[order='" + targetPageNr + "']").addClass("active_btn");

        $("#items").animate({
            top: '-=' + itemsHeight * k
        }, 300 * k, function () {
            $("#current").html($("#items").find(".tempSlide").last().html());
            $("#items").find(".tempSlide").remove();
            $('#items').css('top', '-' + itemsHeight + 'px');

            currentIndex = targetPageNr;
            $("#prev").html($("#" + divs[currentIndex - 1]).html());
            if (currentIndex < divs.length - 1)
                $("#next").html($("#" + divs[currentIndex + 1]).html());
            else
                $("#next").html($("#" + divs[0]).html());

            $("#itemsContainer").dequeue();
        });
    });
}

function fastBackwards(targetPageNr) {
    $("#itemsContainer").queue(function () {
        var currentPageNr = Number($(".scroller_btn.active_btn").attr("order"));
        var k = currentPageNr - targetPageNr;
        for (var i = currentPageNr - 1; i >= targetPageNr; i--) {
            var newDiv = document.createElement("div");
            $(newDiv).html($("#" + divs[i]).html());
            $(newDiv).addClass("tempSlide");
            $("#prev").after(newDiv);
            var top = parseInt($('#items').css('top').replace('px', ''));
            top -= itemsHeight;
            $("#items").css("top", top);
        }

        var top = -itemsHeight * (k + 1);
        $("#items").css("top", top);

        $(".scroller_btn.active_btn").removeClass("active_btn");
        $(".scroller_btn[order='" + targetPageNr + "']").addClass("active_btn");

        $("#items").animate({
            top: '+=' + itemsHeight * k
        }, 300 * k, function () {
            $("#current").html($("#items").find(".tempSlide").first().html());
            $("#items").find(".tempSlide").remove();
            $('#items').css('top', '-' + itemsHeight + 'px');

            currentIndex = targetPageNr;
            $("#next").html($("#" + divs[currentIndex + 1]).html());
            if (currentIndex > 0)
                $("#next").html($("#" + divs[currentIndex - 1]).html());
            else
                $("#next").html($("#" + divs[divs.length - 1]).html());

            $("#itemsContainer").dequeue();
        });
    });
}

