var slideType = "screen"; //If set to "item" scrolls by item otherwise scolls one screen
var visibleCount = 3;  //Set to 1 to turn off autosizing otherwise determines the number of items to show
var slideTime = 800;
var currentPlaylistItem;
var currentIndex = 0;
var totalIndices = 0;
var baseHeight = 0;
var visibleHeight = 0;


$(document).ready(initialize);

function initialize() {
    reset();
}

function reset() {
    $("#contentContainer").css("overflow","hidden");
    baseHeight = $("#contentContainer").offset().top;
    visibleHeight = $("#contentContainer").height();
    totalIndices = $(".contentItem").length;
    slideUp(null);
    if(visibleCount >= totalIndices) {
        $(".scrollButton").addClass("disabled");
    } else {
        $("#scrollDown").click(slideDown);
        $("#scrollUp").click(slideUp);
    }
}

function slideUp(event) {
    var slide = managePosition(-1);
    $("#content").animate({top: slide + "px"}, slideTime, setHeight);
    try {
        event.preventDefault();
    } catch(err) { }
}

function slideDown(event) {
    var slide = managePosition(1);
    $("#content").animate({top: slide + "px"}, slideTime, setHeight);
    try {
        event.preventDefault();
    } catch(err) { }
}

function managePosition(direction) {
    var scrollValue;
    if(slideType == "item") {
        scrollValue = getItemHeight(direction);
    } else {
        scrollValue = scroll(direction * visibleHeight);
    }
    var currentTop = $("#content").offset().top;
    return currentTop + scrollValue - baseHeight;
}

function scroll(value) {
    var startValue = value;
    var currentLocation = parseInt($("#content").css("top"));
    var difference = $("#content").height() - $("#contentContainer").height();
    $("#scrollDown").removeClass("disabled");
    $("#scrollUp").removeClass("disabled");
    if(difference > 0) {
        if(value > 0) {
            if(currentLocation + value > -difference) {
                value = (value - (currentLocation + difference)) - value;
                $("#scrollDown").addClass("disabled");
            }
            if(Math.abs(value) > Math.abs(startValue)) {
                value = -startValue;
                $("#scrollDown").removeClass("disabled");
            }
        } else {
            if(currentLocation + value < 0) {
                value = -currentLocation;
                $("#scrollUp").addClass("disabled");
            }   
            if(Math.abs(value) > Math.abs(startValue)) {
                value = -startValue;
                $("#scrollUp").removeClass("disabled");
            }
        }     
    } else {
        value = 0;
        $(".scrollButton").addClass("disabled");
    }
    return value;
}

function getItemHeight(direction) {
    var itemHeight; 
    var difference = $("#content").height() - $("contentContainer").height();
    $("#scrollDown").removeClass("disabled");
    $("#scrollUp").removeClass("disabled");
    if(difference > 0) {
        if(direction > 0) {
            itemHeight = $("#contentItem_" + currentIndex).outerHeight(true);
            currentIndex++;
        } else if(direction < 0) {
            currentIndex--;
            itemHeight = $("#contentItem_" + currentIndex).outerHeight(true);
        }
        if(currentIndex == 0) {
            $("#scrollUp").addClass("disabled");
        } else if(currentIndex < 0) {
            currentIndex = 0;
            itemHeight = 0;
            $("#scrollUp").addClass("disabled");
        } else if(currentIndex == totalIndices - visibleCount) {
            $("#scrollDown").addClass("disabled");
        } else if(currentIndex > totalIndices - visibleCount) {
            currentIndex = totalIndices - visibleCount;
            itemHeight = 0;
            $("#scrollDown").addClass("disabled");
        }
        if(itemHeight == null) { 
            itemHeight = 0;
            $("#scrollUp").addClass("disabled");
        }
    } else {
        itemHeight = 0;
        $(".scrollButton").addClass("disabled");
    }
    return -direction * itemHeight;
}

function setHeight(event) {
    if(visibleCount > 1 && slideType == "item") {
        var newHeight = 0;
        for(var i = 0; i < visibleCount; i++) {
            newHeight += $("#contentItem_" + (currentIndex + i)).outerHeight(true);
        }
        $("contentContainer").animate({height: newHeight - 10 + "px"}, slideTime);
    }
}