Show Survey

Introduction

This adapter shows a previously-created survey from the same project as the domain/secret key Chatbot SDK. When a user clicks on the "Close" button of the conversation window, the confirmation message appears. If they confirm that you want to leave the conversation, the survey then appears in the conversation window.

Adapter code and public Github repository

This adapter can be found in the Inbenta Github adapters repository.

Click here to see the adapter code

How does it work?

  1. First, set up closeButton:{visible:true} in the configuration in order to show the "Close" button. Next, use the custom-html to remove the close customConversationWindow, because you want users to complete the survey before they leave the conversation.

  2. Use the onResetSession subscription to detect when a user confirms they want to leave the conversation and interrupt the action. Next, use the API client's getSurvey method to retrieve the URL of the selected Survey.

  3. Once the getSurvey request is completed, display the survey as an iframe inside the conversationWindow. To do this, call ShowCustomConversationWindow with

      <iframe name="inbenta-survey" src=' + data.url + '></iframe>
  4. If the user completes the survey, you can detect it by adding an eventListener that the survey triggers upon completion:

    window.addEventListener("message", receiveMessage, false);
    
    function receiveMessage(event) {
      if (event.data.message == "inbenta.survey.successful_answer") {
        surveyProcess='Finished';
        chatbot.actions.resetSession();
      }
    }

    Once detected, you finally call the resetSession action to close the Chatbot SDK.

  5. If the user clicks on the "Close" button again before they complete the Survey, force a resetSession and close the Chatbot SDK with a ondisplaysystemmessage subscription.

Actions and Subscriptions required

This adapter makes use of the following actions:

In addition to the actions, it also uses the following subscriptions:

  • onResetSession to detect if the user chose to leave the conversation, to display the survey.

  • ondisplaysystemmessage to detect when the user clicked on the "Close" button before they finish the survey, to close the Chatbot SDK.

Configuration parameters

  • surveyID: Survey ID to be displayed inside the iframe. Make sure that a Survey already exists in the project instance, and use its given id.
  adapters: [
      showSurvey(surveyID),
  ]

HTML demo with the configurations

In the following configuration, see the use of closeButton and custom-html to hide the close CustomConversationWindow. For more information, see the configurations section.

<script src="survey.js"></script>
<script>
  var surveyID = 1;
  const domainKey = <domainKey>;
  const key = <key>;
   var authorization = {
    domainKey:"<example_domain_key>",
    inbentaKey:"<example_inbenta_key>"
  }
InbentaChatbotSDK.buildWithDomainCredentials(authorization, {
  closeButton:{
    visible:true
  },
  html : {
    'custom-window-header':
        '<div></div>'
      },
  adapters: [
    showSurvey(surveyID)
  ]
});
</script>