Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

In the below example, invoking login Login intent will enable trigger the login directive Login Directive in the chatbot.

...

Create Intents

...

Login Intent

In this example, the Login intent is used to invoke the Login Directive.

...

Loginsuccess Intent

In this example, the Loginsuccess intent is triggered after the user logs in successfully.

...

This The Loginsuccess intent should contain success as one of its utterances.

...

Code Block
if(!msg.payload.orbita) {
    msg.payload.orbita = {};
}

if(!msg.payload.orbita.directive) {
    msg.payload.orbita.directive = [];
}

msg.payload.orbita.directive.push({
    type: 'login', 
    successUtterance: 'success', 
    html: `<button class="smrtBtn chattheme chatthemeborderbuttonsloginButton">Login</button>`
})
//
msg.payload.orbita.logoutUrls = [{
//     'type': 'window', 
//     url:'http://localhost:3030/oauth/logout?'
// }]; 
msg.payload.orbita.state = "Login"

return msg;

...

state = "Login"

return msg;

Customizing the login button

You can customize the login button by using CSS to style it.

...

Go to the Bot Manager flow > Bot View template Node > Custom CSS tab, and place the below code.

Code Block
.loginButton {
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  background-color: #4CAF50;
}

...

Ensure the class name loginButton matches the one used in the Login Directive code for the login button.

How to get Inline login

You can make use of the HTML directive to get inline Inline login in the Chatbot. See, HTML Directive

...

You should know For the inline login, you should note the login page URL of your instance.

Use To get the login directive page URL of your instance, use the Login Directive and click the login Login button. Copy the URL of the login tab (opens in a new tab) and place it in the URL property in the code below.

...

Code Block
if(!msg.payload.orbita) {
msg.payload.orbita = {};
}
if(!msg.payload.orbita.directive) {
msg.payload.orbita.directive = [];
}

msg.payload.orbita.directive = [{
    type: "html5",
    options: {
        template: '450x500',
        url :"<Login page URL of your Instance>"
    },
    loginSuccessUtterance: 'success'
}]

msg.payload.orbita.state = "Login"

return msg;
Info

You

...

should use the loginSuccessUtterance: 'success', to invoke the Loginsuccess Intent after the HTML content (Login page) is rendered.

The line msg.payload.orbita.state = "Login" is optional.

If you choose not to use state, you should remove the state in the Loginsuccess Intent. See, How do I use state?

...

The Login Directive and the Inline Login are combined in a single flow in the below attachment.

...