$('document').ready(function() {
    var upcomingID = $(".upcoming").attr("id");
    showDetails(upcomingID);
    $(".carouselKlein").jCarouselLite({
        btnNext: ".next",
        btnPrev: ".prev",
        mouseWheel: true,
        circular: false,
        scroll: 1,
        visible: 3
    })
    $(".activiteitKlein").click(function(e) {
        var id = $(this).attr("id");
        showDetails(id);
    });
    
    function showDetails(id) {
    	var pageLocation = $("#pageLocation").val();

        $.get(pageLocation, 'activiteit_id=' + id, function(data,status){
            setBorderStyles(id);
            $("#activiteitDetail").fadeOut(500, function() {
                if(id == upcomingID) {
                    $("#activiteitDetail").addClass("upcoming");
                } else {
                    $("#activiteitDetail").removeClass("upcoming");
                }
				$("#activiteitDetail").html(data).fadeIn(1000);
            });
		});
    }
    function setBorderStyles(id) {
        $(".activiteitKlein").css("border-style","solid");
        $("#" + id).css("border-style","dashed");
    }
});