Directives are instructions sent from the server to the client, instructing the client to perform a specific action such as playing audio, displaying an image.
Directives can be created by a function node, injected after a SAY node in the Experience Designer.
You can Validate the directives using postman too.
control how a client application renders an experience to an endpoint, such as an Echo Show, Google Home Hub, chatbot, Facebook messenger, and an IVR/phone experience, to name just a few.
It is used to control the experience, for example, log a user out, add a control to record audio, or add a carousel control for rending a list of objects, or buttons, or dynamic ajax adaptive cards, or any HTM5 card.
Directives are instructions sent from the server to the client, instructing the client to perform a specific action such as playing audio, displaying an image.
Directives can be created by a function node, injected after a SAY node in the Experience Designer.
You can Validate the directives using postman.
Orbita makes use of two kinds of directives:
...
When the client invokes a flow that contains this kind of directivesdirective, the server will send the relevant information to the client and no further communication will happen.
...
Output Payload: This code includes both html and url
| Code Block |
|---|
msg.payload.orbita.directive =.payload.orbita.directive = [{ type : "html5", options : { template : "500x500", html : "<!DOCTYPE > <html> <head> [{ type : "html5", options : <style> { template : "500x500", html : "<!DOCTYPE > div { width <html> : 900px; <head> <style>height : 100px; div { width : 900px; background-color : red; height -webkit-animation-name : 100pxexample; background-color -webkit-animation-duration : 4s; : red; animation-name -webkit-animation-name : example; -webkit-animation-duration : 4s; : 4s; animation-name } : example; @-webkit-keyframes example { animation-duration : 4s; from {background-color: red;} } @-webkit-keyframes example { to {background-color: yellow;} } @keyframes example from {background-color: red;} tofrom {background-color: yellowred;} } @keyframes example { to {background-color: yellow;} } </style> from {background-color: red;} </head> to {background-color: yellow;} } <body> <p><b>Note:</style>b> This example does not work in Internet Explorer 9 and earlier versions.</p> </head> <body><div></div> <p><b>Note:</b> ThisWhen examplean doesanimation notis workfinished, init Internetchanges Explorerback 9to andits earlieroriginal versionsstyle.</p> <div><</div>body> <p><b>Note:</b>html>", When an animation is} finished, it changes back}, to its original style.</p> { type : "html5", options : { template </body> : "500x500", url : "https://orbita.ai" } }]; </html>", } }, { return msg; |
The Output of “Options – html”.
...
The Output of “Options – url”.
...
Logout
When the client invokes the logout directive, the server responds with a popup window with a custom message.
...
Clicking OK redirects you to the home screen of the app.
...
Output Payload:
| Code Block |
|---|
msg.payload.orbita.directive = [{ type : "html5logout", options : {title template : "500x500Session logOut", url options : {message: "https://orbita.ai" You are logged out"} }]; return msg; |
The Output of “Options – html”.
...
The Output of “Options – url”.
...
Logout
When the client invokes the logout directive, the server responds with a popup window with a custom message.
...
Clicking OK redirects you to the home screen of the app.
...
Output Payload:
Text Break
The Text Break can be used on the chatbot where we need to provide breaks between conversations, like while transferring to a Live Agent.
Code snippet
| Code Block |
|---|
msg.payload.orbita.directive == [{ type: 'textbreak', options: { [{ primaryMessage: type"Transferring you to a :live "logoutagent.", //mandatory title secondaryMessage: "Session logOut12:45pm", //optional options : {messagetertiaryMessage: "YouSharron has areentered loggedthe out"}chat." //optional } }]; return msg; |
...
Directives that request information from the client and then render information
...