Table of Contents | ||
---|---|---|
|
Prerequisites
To render the scheduler directive, you should switch to chatbot version - v2 in the Bot view template node.
API to get the scheduled times.
URLs of the images from Orbita backend. see How do I upload an image? for more information.
...
The Scheduler directive lets you render the time and date in a window from which the user can choose the time and date of his/her appointment.
...
Please note that if there is a custom value provided by the User for OE_HTTP_NODE root in the environment level, please use /{{customName}}
. By default, the value defined for OE_HTTP_NODE_ROOT
will be /oeapi
.
For example, var timeSlotsServerURL = '/{{customName}}/gettimeslots-support';
Sample scheduler directive:
Code Block |
---|
if(!msg.payload.orbita) { msg.payload.orbita = {} } // Set the Url for getting time slots var timeSlotsServerURL = '/oeapi/gettimeslots-support'; // Create the scheduler Directive msg.payload.orbita.directive= [{ "type": "scheduler", "title": "<h3>Title of the Window</h3>", "headercard": { "fullName": "Header Text", "imageUrl": "https://s3.amazonaws.com/orbitahealth/clients/aurora/assets/dynamic/images/orbitascheduler13d408b0-32af-11ea-9bc7-5d28415c60bb.png", "address": "Header address", "name": "Header Name", "description": "Header Description" }, "calendar": { "startDate": "", // if empty start from current date "endDate": "", //if empty end with next 30 day's, "title": `<strong>Available Times:</strong>`, "description": "Please select a time that is convenient for you.", "getTimeUrl":timeSlotsServerURL, // http url to load the available slots dynamically. }, "subList": { "title": "Sublist title", "items": [{ "fullName": "Item fullname 1", "imageUrl": "https://s3.amazonaws.com/orbitahealth/clients/sandbox5/assets/dynamic/images/smallimage192c03a10-384d-11ea-9e3c-4750e1188599.jpg", "description": "Item description 1", "name": 'Item Name 1', "address": '', "phone": '', "paramValue":'Param1', "paramName": `facility`, }, { "fullName": "Item fullname 2", "imageUrl": "https://orbita.ai/wp-content/uploads/2017/08/vxhero_bg_v2.jpg", "description": "Item description 2", "name": 'Item Name 2', "address": '', "phone": '', "paramValue":'Param2', "paramName": `facility`, }, { "fullName": "Item fullname 3", "imageUrl": "https://s3.amazonaws.com/orbitahealth/clients/aurora/assets/dynamic/images/Bigimage3073a45d0-3393-11ea-9bc7-5d28415c60bb.jpg", "description": "Item description 3", "name": 'Item Name 3', "address": '', "phone": '', "paramValue":'Param3', "paramName": `facility`, }], }, "buttons": [{ "text": "Select Appointment", "type": "javascript", "value": "orbitaAction.schedulerDir.submitAction()", "icon": "<i class=\"fa fa-map-marker\" aria-hidden=\"true\"></i>" }] }] return msg; |
Parameters used for Scheduler
Parameter | Description |
---|---|
| The type property should be set as “scheduler”. |
| The Title of the Scheduler window. |
| headercard
|
| calendar
|
| sublist
|
| button
Clicking on the button generates a chat bubble with the appointment details. You can change the contents of the chat bubble from the chat.js. (scheduler - index.js file) |
Info |
---|
You will get the The time and date that the user selected in the Scheduler directive will be at |
...
Connect the Scheduler directive to an Intent as shown in the below screenshot.
Set a state for the Scheduler directive.
Code Block msg.payload.orbita.state = "Scheduler"
Create a Free Text Intent.
Use the free text intent with the the same state set in the scheduler directive node.
...