Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 9 Next »

Prerequisites

  1. To render the scheduler directive, you should switch to chatbot version - v2 in the Bot view template node.

  2. API to get the scheduled times.

  3. URLs of the images from Orbita backend. see How do I upload an image? for more information.

Scheduler

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.

Sample 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 available slots dynamically, if not then will take default. query param will have param1, param2, param3 as doctor, hospital, date 
        "availableTimes": []
    },
    "subList": {
        "title": "Sublist title",
        "items": [{
            "fullName": "item name 1",
            "imageUrl": "https://s3.amazonaws.com/orbitahealth/clients/sandbox5/assets/dynamic/images/smallimage192c03a10-384d-11ea-9e3c-4750e1188599.jpg",
            "description": "Item description 1"
        },
        {
            "fullName": "item name 2",
            "imageUrl": "https://orbita.ai/wp-content/uploads/2017/08/vxhero_bg_v2.jpg",
            "description": "Item description 2"
        },
        {
            "fullName": "item name 3",
            "imageUrl": "https://s3.amazonaws.com/orbitahealth/clients/aurora/assets/dynamic/images/Bigimage3073a45d0-3393-11ea-9bc7-5d28415c60bb.jpg",
            "description": "Item description 3"
        }],
    },
    "buttons": [{
        "text": "Select Appointment",
        "type": "javascript",
        "value": "orbitaAction.schedulerDir.submitAction()",
        "icon": "<i class=\"fa fa-map-marker\" aria-hidden=\"true\"></i>"
    }]
}]

Parameters used for Scheduler

Parameter

Description

"type": "scheduler"

The type property should be set as “scheduler”.

"title": "<h3>Title of the Window</h3>",

The Title of the Scheduler window.

"headercard": {
"fullName": "Header Text",
"imageUrl": "URL",
"address": "Header address",
"name": "Header Name",
"description": "Header Descr"
},

headercard

  • fullName - The full name of the Header.

  • imageUrl - The URL of the header image.

  • address - The address of the header.

  • name - Short name of the header to render it in the card.

  • description - The text from the description property is rendered in the scheduler window.

"calendar": {
"startDate": "",
"endDate": "",
"title": <strong>slot:</strong>,
"description": "Select a time",
"getTimeUrl":timeSlotsServerURL,
"availableTimes": []
}

calendar

  • startDate - The date from which the calendar should start. If left empty, the calendar starts from the current date.

  • endDate - The date until which the calendar gets rendered. If left empty, the calendar ends after 30 days from the startDate.

  • title - The title for the timeslots section in the scheduler window.

  • description - The description for the timeslots section in the scheduler window.

  • getTimeUrl - API for fetching the available time slots. As an example, random time slots are generated and rendered using a function node in the sample flow json (attached).

"subList": {
"title": "Sublist title",
"items": [{
"fullName": "item name 1",
"imageUrl": "URL",
"description": "Item descr"
}],
}

sublist

  • title - The title of the sub-list section in the scheduler window.

  • items - Items can be a doctor, or a hospital, or a drive location, and so on.

    • fullName - Full name of the items.

    • imageUrl - Url of the item’s Image.

    • description - Description of the item.

"buttons": [{
"text": "Select Appointment",
"type": "javascript",
"value":"orbitaAction.schedulerDir.submitAction()",
"icon": "<i class="fa fa-map-marker" aria-hidden="true"></i>"
}]

button

  • text - The button text

  • value - The button action to be performed on click.

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)

  File Modified

Related Articles

  • No labels