External Calendar

Xeelo Knowledge Base
, ,
1

Since Xeelo 2022-08.001 we introduced External Calendars. Regular reports were extended by possibility to use external data source.

In order to setup external calendar, you must first have external data source (HTTP Server) and also setup external report in Xeelo Admin.

External data source (HTTP endpoint) must provide JSON data in following format

Calendar type

Type: Calendar

  • GraphType - string = calendar
  • ShowDay - boolean - Whether to render day view toggle button
  • ShowWeek - boolean - Whether to render week view toggle button
  • ShowMonth - boolean - Whether to render month view toggle button
  • ShowOnlyWorkingHours - boolean - Whether to render “only working hours” checkbox
  • ShowOnlyWorkingDays - boolean - Whether to render “only working days” checkbox
  • WorkingHoursFrom time ie. “08:00”
  • WorkingHoursTo time ie. “16:00”
  • FocusDate date format “dd-mm-yyyy” - Whether to focus calendar on specific date (since 2023-01.001)
  • Events - array of Event

Type: Event

  • BackgroundColor Color - event background color
  • Start date event start date (ISO Format)
  • End date event end date (ISO Format)
  • Title string - Event title
  • Description - string Event description (can be HTML)
  • AllDay boolean wheather event is all-day or not
  • RequestId integer - related Xeelo Request ID

Type: Color

string value of color which can be

  • HEX ie . #ababab
  • RGBA ie. rgba(0-255, 0-255,0-244,0-1)
  • Color name ie blue or red

Example calendar

{
   "ShowDay":true,
   "ShowWeek":true,
   "ShowMonth":true,
   "ShowOnlyWorkingHours":true,
   "ShowOnlyWorkingDays":true,
   "WorkingHoursFrom":"08:00:00",
   "WorkingHoursTo":"16:00:00",
   "FocusDate":"09-09-2022",
   "Events":[
      {
         "backgroundColor":"blue",
         "start":"2022-09-09T13:35:15.653Z",
         "end":"2022-09-11T13:35:15.669Z",
         "title":"Event -10",
         "description":"Event description: - 10",
         "requestId":0,
         "allDay":true
      },
      {
         "backgroundColor":"red",
         "start":"2022-09-07T13:35:15.685Z",
         "end":"2022-09-09T13:35:15.685Z",
         "title":"Event -12",
         "description":"Event description: - 12",
         "requestId":0,
         "allDay":true
      }
   ],
   "GraphType":"calendar"
}
1 Like