tools/pharos-dashboard/src/static/js/fullcalendar-options.js

   1 /*****************************************************************************
   2 * Copyright (c) 2016 Max Breitenfeldt and others.
   3 *
   4 * All rights reserved. This program and the accompanying materials
   5 * are made available under the terms of the Apache License, Version 2.0
   6 * which accompanies this distribution, and is available at
   7 * http://www.apache.org/licenses/LICENSE-2.0
   8 *****************************************************************************/
   9
  10
  11 var tmpevent;
  12
  13 function sendEventToForm(event) {
  14     $('#starttimepicker').data("DateTimePicker").date(event.start);
  15     $('#endtimepicker').data("DateTimePicker").date(event.end);
  16 }
  17
  18 var calendarOptions = {
  19     height: 600,
  20     header: {
  21         left: 'prev,next today',
  22         center: 'title',
  23         right: 'agendaWeek,month'
  24     },
  25     timezone: user_timezone, // set in booking_calendar.html
  26     defaultView: 'month',
  27     slotDuration: '00:60:00',
  28     slotLabelFormat: "HH:mm",
  29     firstDay: 1,
  30     allDaySlot: false,
  31     selectOverlap: false,
  32     eventOverlap: false,
  33     selectable: true,
  34     editable: false,
  35     eventLimit: true, // allow "more" link when too many events
  36     timeFormat: 'H(:mm)', // uppercase H for 24-hour clock
  37     unselectAuto: true,
  38     nowIndicator: true,
  39
  40     // selectHelper is only working in the agendaWeek view, this is a workaround:
  41     // if an event is selected, the existing selection is removed and a temporary event is added
  42     // to the calendar
  43     select: function (start, end) {
  44         if (tmpevent != undefined) {
  45             $('#calendar').fullCalendar('removeEvents', tmpevent.id);
  46             $('#calendar').fullCalendar('rerenderEvents');
  47             tmpevent = undefined;
  48         }
  49         // the times need to be converted here to make them show up in the agendaWeek view if they
  50         // are created in the month view. If they are not converted, the tmpevent will only show
  51         // up in the (deactivated) allDaySlot
  52         start = moment(start);
  53         end = moment(end);
  54
  55         tmpevent = {
  56             id: '537818f62bc63518ece15338fb86c8be',
  57             title: 'New Booking',
  58             start: start,
  59             end: end,
  60             editable: true
  61         };
  62
  63         $('#calendar').fullCalendar('renderEvent', tmpevent, true);
  64         sendEventToForm(tmpevent);
  65     },
  66
  67     eventClick: function (event) {
  68         if (tmpevent != undefined) {
  69             if (event.id != tmpevent.id) {
  70                 $('#calendar').fullCalendar('removeEvents', tmpevent.id);
  71                 $('#calendar').fullCalendar('rerenderEvents');
  72                 tmpevent = undefined;
  73             }
  74         }
  75
  76         // tmpevent is deleted if a real event is clicked, load event details
  77         if (tmpevent == undefined) {
  78             var booking_detail_url = booking_detail_prefix + event.id;
  79
  80             $.ajax({
  81                 url: booking_detail_url,
  82                 type: 'get',
  83                 success: function (data) {
  84                     $('#booking_detail_content').html(data);
  85                 },
  86                 failure: function (data) {
  87                     alert('Error loading booking details');
  88                 }
  89             });
  90             $('#booking_detail_modal').modal('show');
  91         }
  92     },
  93
  94     eventDrop: function (event) {
  95         sendEventToForm(event);
  96     },
  97
  98     eventResize: function (event) {
  99         sendEventToForm(event);
 100     }
 101 };