scrolly = function (wrapperID, pagesize, scrollyHeight) {
    this.wrapper = $("#" + wrapperID);
    this.leftArrow;
    this.rightArrow;

    this.currentList;
    this.prevList;
    this.nextList;

    this.offset;

    this.init = function () {
        if (this.createLists()) {
            this.setValues();
            this.setHeight();
            this.toggleArrows();
            this.bindLeftRight();
            this.setupRollovers();
        }
    }

    this.setValues = function () {
        this.leftArrow = this.wrapper.find(".arrow.left");
        this.rightArrow = this.wrapper.find(".arrow.right");

        this.currentList = this.wrapper.children(".visible");
        this.prevList = this.currentList.prev("ul");
        this.nextList = this.currentList.next("ul");

        this.offset = this.currentList.parent().width();
    }

    this.createLists = function () {
        //This function will split the <li>'s from the repeater into ul groups
        var items = this.wrapper.find("li");
        var hasActiveLI = false;

        //Because the js is called for every scrolly on the page, ensure we only set things up the first time
        var alreadyExists = this.wrapper.find(".visible").length;
        if (alreadyExists) {
            return false;
        }

        $.each(items, function (index) {
            
            if (index % pagesize == 0) {
                $(this).wrap("<ul/>"); //Default: first list is visible list
            }
            else {
                $(this).prev("ul").append($(this)); //Else, move element into existing list
            }

            //To determine which list should be visible, look for an li with the class 'on'.
            if ($(this).hasClass("on")) {
                hasActiveLI = true;
            }
        });
        this.wrapper.children("ul").each(function (i) {
            if (i == 0) {
                $(this).addClass("visible");
            } else {
                $(this).addClass("right");
            }
        });

        //IE7 wraps div tags that are supposed to be outside the li inside the last li. Separate them out.
        if (this.wrapper.find(".arrow").parent("li").length > 0) {
            this.wrapper.find(".arrow").appendTo(this.wrapper);
            this.wrapper.find(".corner").appendTo(this.wrapper);
            this.wrapper.find(".clear").appendTo(this.wrapper);
        }

        this.setValues();

        //If the lists have an active LI:
        if (hasActiveLI) {
            var lists = this.wrapper.find("ul");
            lists.each(function (index) {
                if ($(this).find("li.on").length > 0) {
                    $(this).removeClass("right").addClass("visible");
                    return false; //breaks out of foreach loop
                }
                else {
                    $(this).removeClass("right").removeClass("visible").addClass("left");
                }
            });
        }

        return true;
    }

    this.bindLeftRight = function () {
        var ele = this;

        this.rightArrow.click(function () {
            ele.shiftLeft();
        });

        this.leftArrow.click(function () {
            ele.shiftRight();
        });
    }

    this.shiftLeft = function () {
        var ele = this;
        ele.setValues();

        //Prevent user from progressing to next list until current animation is finished
        if (!ele.currentList.is(':animated')) {
            //Shift visible list to the left
            ele.currentList.animate({ left: "-" + ele.offset + "px" }, 1000, function () {
                $(this).removeClass("visible").addClass("left");
                $(this).attr("style", ""); //Clear style that animate adds
            });
            //Bring in the new visible list from the right
            ele.nextList.animate({ left: "15px" }, 1000, function () {
                $(this).removeClass("right").addClass("visible");
                ele.toggleArrows();
                $(this).attr("style", ""); //Clear style that animate adds
            });
        }
    }

    this.shiftRight = function () {
        var ele = this;
        ele.setValues();

        //Prevent user from progressing to next list until current animation is finished
        if (!ele.currentList.is(':animated')) {
            //Shift visible list to the right
            ele.currentList.animate({ left: ele.offset + "px" }, 1000, function () {
                $(this).removeClass("visible").addClass("right");
                $(this).attr("style", ""); //Clear style that animate adds
            });
            //Bring in the new visible list from the left
            ele.prevList.animate({ left: "15px" }, 1000, function () {
                $(this).removeClass("left").addClass("visible");
                ele.toggleArrows();
                $(this).attr("style", ""); //Clear style that animate adds
            });
        }
    }

    this.setHeight = function () {
        //Because all our divs are absolute positioned, set the appropriate height for the wrapper or they won't show
        this.currentList.parent().css("height", scrollyHeight);
    }

    this.toggleArrows = function () {
        var ele = this;
        ele.setValues();

        //Turn off left arrow if current is the first UL in the group; else make sure it is visible
        if (!ele.prevList.exists()) {
            ele.leftArrow.addClass("off");
        }
        else {
            ele.leftArrow.removeClass("off");
        }

        //Turn off right arrow if this is the last UL in the group; else make sure it is visible
        if (!ele.nextList.exists()) {
            ele.rightArrow.addClass("off");
        }
        else {
            ele.rightArrow.removeClass("off");
        }
    }

    //Checks to see if element exists or not
    jQuery.fn.exists = function () {
        return jQuery(this).length > 0;
    }

    this.setupRollovers = function () {
        var items = this.wrapper.find("li");

        $.each(items, function (index) {
            $(this).hover(
				function () {
				    $(this).children(".callout").show();
				},
				function () {
				    $(this).children(".callout").hide();
				});
        });
    }

    this.init();
}