KB.component('calendar', function (containerElement, options) {

    this.render = function () {
        var calendar = $(containerElement);

        calendar.fullCalendar({
            locale: $("body").data("js-lang"),
            editable: true,
            eventLimit: true,
            defaultView: "month",
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            eventDrop: function(event) {
                $.ajax({
                    cache: false,
                    url: options.saveUrl,
                    contentType: "application/json",
                    type: "POST",
                    processData: false,
                    data: JSON.stringify({
                        "task_id": event.id,
                        "date_due": event.start.format()
                    })
                });
            },
            viewRender: function() {
                var url = options.checkUrl;
                var params = {
                    "start": calendar.fullCalendar('getView').start.format(),
                    "end": calendar.fullCalendar('getView').end.format()
                };

                for (var key in params) {
                    url += "&" + key + "=" + params[key];
                }

                $.getJSON(url, function(events) {
                    calendar.fullCalendar('removeEvents');
                    calendar.fullCalendar('addEventSource', events);
                    calendar.fullCalendar('rerenderEvents');
                });
            }
        });
    };
});

@@ -61,84 +61,447 @@
 ) %7B%0A
-%0A    this.render = function () %7B%0A        var calendar = $(containerElement);
+    var modeMapping = %7B // Let's have bookable pretty mode names%0A        month: 'month',%0A        week: 'agendaWeek',%0A        day: 'agendaDay'%0A    %7D;%0A%0A    this.render = function () %7B%0A        var calendar = $(containerElement);%0A        var mode = 'month';%0A        if (window.location.hash) %7B // Check if hash contains mode%0A            var hashMode = window.location.hash.substr(1);%0A            mode = modeMapping%5BhashMode%5D %7C%7C mode;%0A        %7D
 %0A%0A  
@@ -664,15 +664,12 @@
 ew: 
-%22
 mo
-nth%22
+de
 ,%0A  
@@ -1334,19 +1334,320 @@
 unction(
-) %7B
+view) %7B%0A                // Map view.name back and update location.hash%0A                for (var id in modeMapping) %7B%0A                    if (modeMapping%5Bid%5D === view.name) %7B // Found%0A                        window.location.hash = id;%0A                        break;%0A                    %7D%0A                %7D
 %0A       

Make link to calendar view bookable (#3063)