Add event listener

#1

Hi,

I am trying to implement an event listener to the conversation, so that a certain message is sent at the end of the conversation on web chat (see below code). However the below code is not working. Could anyone help me out with this?

Thanks,
Aline

    <script>
        window.addEventListener('message', event => {
        if (event.state.context.currentNode === 'node-e931') {
          setTimeout(function(){ window.botpressWebChat.sendEvent({ 
            type: 'proactive-trigger',
            channel: 'web',
            payload: {
                text: `xy`}
          })}
                    )}
    </script>
#2

Hey @alinewaeber!

In order to make your bot answer a predefined message at the end of a conversation, you don’t need to use the proactive feature of Botpress.

Instead, what you can do is add an extra node at the end of your flow in the Botpress Studio. This last node will be reached when your flow ends, and the final message will be sent to the user.

Let me know if this does not fit your needs.

#3

Thank you @spgin!

I wanted to do it with the proactive feature because i need to access a variable. Maybe there is another way to access and reproduce a variable that has been stored in the database using JavaScript? Would you possibly have an example of how this could be done?

Thanks,
Aline

#4

To retrieve a variable from the database and display it to the user, you can use an Action.

When called, your Action will retrieve the value from the database, and store the value in a temp variable in the Event. You can find an example of an Action that retrieves a value from the Key-Value Store here: https://github.com/botpress/botpress/blob/master/modules/builtin/src/actions/getGlobalVariable.js

Your bot can then access the returned variable using the double-curly notation (e.g. {{event.state.temp.myVar}}, see example here https://botpress.io/docs/main/memory#memory-action-example).

#5

Thanks, @spgin!

Would this be the right way to extract my slot skills “outcome” variable?

<script>
     window.addEventListener('message', function(event) {
      if (event.session.slots.outcome.value === '5') {
        document.getElementById('myButton').style.display= 'block';
        }
     });
</script>
#6

Hey @alinewaeber ,

Just a quick clarification. The event variable that is a passed as an argument to the function(event) is not a Botpress event. Rather, it is a MessageEvent instance that is sent from the Webchat iframe to the parent page.

For that reason, the event variable does not have a session field. In other words, event.session will be undefined.

In order to pass memory variables to the Webchat’s parent page, you can use the channel-web/sendDataToChat action. This action can take any variable from the session’s memory and push it upwards to the Webchat’s parent page.

Here is how to find this action from the Botpress Studio:
58%20AM

Then, you can configure which memory variable to send to the Webchat’s parent page. Here, I send the event.state.session.myVar variable:
58%20AM-2

For reference, here is the code of Webchat parent page:

59%20AM
59%20AM741×418 28.9 KB

An here, you can see that the value of myVar (someValue) is printed in the browser’s console:

09%20AM
09%20AM808×397 49.5 KB

If you need more help with this, send me a direct message and I can show you how to this in more details.