var Courses = {
    columns: 2,

    init: function() {
        if ($.browser.msie)
            this.createColumnStructure();
		this.setUpCoursesSlider();
    },


    setUpCoursesSlider: function() {
        $(".courses").hide();
        var levelCSS = $(".courses").prev().attr('class');

        var button = $(".courses").after("<button class='showCourses " + levelCSS + "dark'>Show Courses</button>");

        $("button").click(function() {
            var label = $(this).html();
            var courseList = $(this).prev();

            if (label.indexOf("Show") > -1) {
                courseList.slideDown();
                $(this).html("Hide Courses");
            }
            else {
                courseList.slideUp();
                $(this).html("Show Courses");
            }
        });
    },

    createColumnStructure: function() {
        $(".courses").each(function() {
            var listItems = $(this).children();
            var itemsPerColumn = Math.floor(listItems.length / Courses.columns) + 1;
            var column = 1
            var columnHeight = 0;
            listItems.each(function(itemCount) {
                $(this).addClass("column" + column);
                var rowPos = (itemCount % itemsPerColumn) + 1;

                if (rowPos == 1 && column != 1) {
                    $(this).css("margin-top", -columnHeight);
                    columnHeight = 0;
                }
                columnHeight = columnHeight + $(this).height();

                if ((itemCount % itemsPerColumn) == itemsPerColumn - 1) {
                    column++;
                }

            });
        });
    }
}

$(document).ready(function() {

    Courses.init();
});
