text: // import 'fullcalendar';
  
  $(document).ready(() => {
  
      var date = new Date();
      var today = date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate();
  
      var calendar = new FullCalendar.Calendar($("#calendar"), {
              header: {
              left: 'prev,next today',
              center: 'title',
              right: 'listDay,listWeek,month'
          },
          themeSystem: 'bootstrap4',
          bootstrapFontAwesome: true,
          // customize the button names,
          // otherwise they'd all just say "list"
          views: {
              listDay: { buttonText: 'list day' },
              listWeek: { buttonText: 'list week' }
          },
  
          defaultView: 'listWeek',
          defaultDate: today,
          navLinks: true, // can click day/week names to navigate views
          editable: true,
          eventLimit: true, // allow "more" link when too many events
          events: [
              {
                  title: 'All Day Event',
                  start: '2018-03-01'
              },
              {
                  title: 'Long Event',
                  start: '2018-03-07',
                  end: '2018-03-10'
              },
              {
                  id: 999,
                  title: 'Repeating Event',
                  start: '2018-03-09T16:00:00'
              },
              {
                  id: 999,
                  title: 'Repeating Event',
                  start: '2018-03-16T16:00:00'
              },
              {
                  title: 'Conference',
                  start: '2018-03-11',
                  end: '2018-03-13'
              },
              {
                  title: 'Meeting',
                  start: '2018-03-12T10:30:00',
                  end: '2018-03-12T12:30:00'
              },
              {
                  title: 'Lunch',
                  start: '2018-03-12T12:00:00'
              },
              {
                  title: 'Meeting',
                  start: '2018-03-12T14:30:00'
              },
              {
                  title: 'Happy Hour',
                  start: '2018-03-12T17:30:00'
              },
              {
                  title: 'Dinner',
                  start: '2018-03-12T20:00:00'
              },
              {
                  title: 'Birthday Party',
                  start: '2018-03-13T07:00:00'
              },
              {
                  title: 'Click for Google',
                  url: 'http://google.com/',
                  start: '2018-03-28'
              }
          ]
      });
  
      $('#calendar').fullCalendar({
          header: {
              left: 'prev,next today',
              center: 'title',
              right: 'month,basicWeek,basicDay'
          },
          themeSystem: 'bootstrap4',
          bootstrapFontAwesome: true,
          defaultDate: today,
          navLinks: true, // can click day/week names to navigate views
          editable: true,
          eventLimit: true, // allow "more" link when too many events
          events: [
              {
                  title: 'All Day Event',
                  start: '2018-03-01'
              },
              { // TODO THIS IS WHAT I NEED FOR DISPLAYING ABSENCES
                  title: 'Long Event',
                  start: '2018-03-07',
                  end: '2018-03-10'
              },
              {
                  id: 999,
                  title: 'Repeating Event',
                  start: '2018-03-09T16:00:00'
              },
              {
                  id: 999,
                  title: 'Repeating Event',
                  start: '2018-03-16T16:00:00'
              },
              {
                  title: 'Conference',
                  start: '2018-03-11',
                  end: '2018-03-13'
              },
              {
                  title: 'Meeting',
                  start: '2018-03-12T10:30:00',
                  end: '2018-03-12T12:30:00'
              },
              {
                  title: 'Lunch',
                  start: '2018-03-12T12:00:00'
              },
              {
                  title: 'Meeting',
                  start: '2018-03-12T14:30:00'
              },
              {
                  title: 'Happy Hour',
                  start: '2018-03-12T17:30:00'
              },
              {
                  title: 'Dinner',
                  start: '2018-03-12T20:00:00'
              },
              {
                  title: 'Birthday Party',
                  start: '2018-03-13T07:00:00'
              },
              {
                  title: 'Click for Google',
                  url: 'http://google.com/',
                  start: '2018-03-28'
              }
          ]
      });
  
      $('#calendar-bg-events').fullCalendar({
          header: {
              left: 'prev,next today',
              center: 'title',
              right: 'month,agendaWeek,agendaDay,listMonth'
          },
          themeSystem: 'bootstrap4',
          bootstrapFontAwesome: true,
          defaultDate: '2018-03-12',
          navLinks: true, // can click day/week names to navigate views
          businessHours: true, // display business hours
          editable: true,
          events: [
              {
                  title: 'Business Lunch',
                  start: '2018-03-03T13:00:00',
                  constraint: 'businessHours'
              },
              {
                  title: 'Meeting',
                  start: '2018-03-13T11:00:00',
                  constraint: 'availableForMeeting', // defined below
                  color: '#257e4a'
              },
              {
                  title: 'Conference',
                  start: '2018-03-18',
                  end: '2018-03-20'
              },
              {
                  title: 'Party',
                  start: '2018-03-29T20:00:00'
              },
  
              // areas where "Meeting" must be dropped
              {
                  id: 'availableForMeeting',
                  start: '2018-03-11T10:00:00',
                  end: '2018-03-11T16:00:00',
                  rendering: 'background'
              },
              {
                  id: 'availableForMeeting',
                  start: '2018-03-13T10:00:00',
                  end: '2018-03-13T16:00:00',
                  rendering: 'background'
              },
  
              // red areas where no events can be dropped
              {
                  start: '2018-03-24',
                  end: '2018-03-28',
                  overlap: false,
                  rendering: 'background',
                  color: 'var(--danger)'
              },
              {
                  start: '2018-03-06',
                  end: '2018-03-08',
                  overlap: false,
                  rendering: 'background',
                  color: 'var(--success)'
              }
          ]
      });
  
  });