2. Combining Calendar into Request Embedding a Deployment Times Calendar into a Request

3. 3 Agenda  Combining Calendar & Request  Creating Calendar Data  Creating the Calendars  Embedding Calendar in Request  Questions

4. 4 Who Am I?  Anne Ramey  Anne.Ramey@kineticdata.com Anne.Ramey@kineticdata.com  919-533-9770  Consultant  Community.kineticdata.com

5. 5 Combining Calendar and Request?

6. Creating Calendar Data

7. 7 Creating the Calendar Data  Two Data Sets, One Data Source  Available Time Slots  Reserved Time Slots  Supporting/Managing this Data  Creating this Data

8. 8 Available Time Slots

9. 9 Reserved Time Slot

10. 10 Automated Time Slot Creation

11. Creating the Calendars

12. 12 Creating the Calendars  Example Booked Time Calendar { "name": "Desktop Reserved Times", "id": "ScheduleDesktop", "description": "Reserved Times for Desktop Appointments", "status": "Active", "defaultView": "Week", "displayPage": "/themes/default/calendar.jsp", "visibleInListing": true, "clickHandler": {}, "eventTypeOrder": [] }

13. 13 Creating the Calendars  Example Booked Time Event { "name": "Completed", "status": "Active", "defaultFilter": "", "detailsPage": "/themes/default/event.jsp", "color": null, "source": { "connectionName": "ITSM ARS", "configuration": { "Form": "CUSTOM:KS_TimeSlots", "Qualification": "'Status' = \"Reserved\" AND 'CalendarName' = \"My Deployment Calendar\"" }, "coreMappings": { "Id": "{{1}}", "Name": "{{700006001}}", "Description": "{{700006001}}", "Start": "{{700006053}}", "End": "{{700006054}}" }, "detailMappings": { "SlotName": "{{700006001}}", "SlotStartTime": "{{700006053}}", "SlotEndTime": "{{700006054}}", "Service Item Details": "{{700006005}}" }, "filterMappings": [ { "name": "Duration", "value": "{{700006052}}", "values": {} } ] }

14. 14 Creating the Calendars  Example Available Time Calendar { "name": "Desktop Available Times", "id": " ScheduleDesktopAvailable", "description": "Available Times for Desktop Appointments", "status": "Active", "defaultView": "Day", "displayPage": "/themes/default/calendar.jsp", "visibleInListing": false, "clickHandler": {}, "eventTypeOrder": [] }

15. 15 Creating the Calendars  Example Available Time Event { "name": "Available", "status": "Active", "defaultFilter": "", "detailsPage": "/themes/default/event.jsp", "color": null, "source": { "connectionName": "ITSM ARS", "configuration": { "Form": "CUSTOM:KS_TimeSlots", "Qualification": "'Status' = \"Available\" AND 'CalendarName' = \"My Deployment Calendar\"" }, "coreMappings": { "Id": "{{1}}", "Name": "{{700006001}}", "Description": "{{700006001}}", "Start": "{{700006053}}", "End": "{{700006054}}" }, "detailMappings": { "SlotName": "{{700006001}}", "SlotStartTime": "{{700006053}}", "SlotEndTime": "{{700006054}}" }, "filterMappings": [ { "name": "Available", "value": "{{700006001}}", "values": {} } ] }, "clickHandler": { "type":"js", "callback":"window.parent.setEventDetails", "parameters": {} }

16. Embedding Calendar in Request

17. 17 Service Item – User View

18. 18 Service Item – Developer View  Calendar Frame <iframe id="calFrame" height="700px" width="97%" data-src="/kineticCalendar/calendar?id=ScheduleDesktopAvailable&embedded=true"> Your browser does not support iframes.

19. 19 Showing the Calendar  Clicking the button to select a time calls the showCalendar() function that sets a default time and a change on the Select a Date field, which actually displays the calendar.

20. 20 Calendar Click Event  A function must exist in the service item to handle the click in the embedded calendar (as configured in the calendar)

21. 21 timeSlots.js  Part of a package to manage the time slots as described in this example  Provides:  setCalendarURL(isoDate, calFrameElementId)  setCalendarEventDetails(calendarEvent, dateQuestionName, eventIdQuestionName)  reserveSlot(slotID, status, name, details, itemID, itemNo, workOrderID)  & more

22. 22 Tree Set-Up  The Timeslot needs to be released on Denial, Expiration, or Cancellation. This can be done by using the KS Timeslot Record Update handler.

23. 23 What did we just cover?  Combining Calendar & Request  Creating Calendar Data  Creating the Calendars  Embedding Calendar in Request

24. 24 Questions?