Adding custom delay depending on length of previous response in Rasa Webchat

Rasa Open Source
1

Hi there,
I use this Rasa Webchat widget for integrating the my prototype onto my website. Right now I am delaying the messages by using:

customMessageDelay: (message) => {
                      let delay = message.length * 30;
                      if (delay > 6000) delay = 6000;
                      if (delay < 100) delay = 1000;
                      return delay;},

That is creating quite a nice delay, but I would prefer having a delay of the messages depending on the length of the previously posted message:
So, let’s say the first message (m1) that gets posted by the bot is always delayed by a constant value t1 and the second message posted message (m2) gets delayed by m1.length*t2. How can I achieve this?

The number of posted responses varies depending on the questions and there are also carousels.

Ciao, Vio

2

That’s a pure JavaScript question, unrelated to Rasa.

Nonetheless:

let m1 = null

customMessageDelay: (message) => {
    let delay = (m1 ? m1 : message.length) * 30

    if (delay > 6000) delay = 6000
    if (delay < 100) delay = 1000

    m1 = message.length

    return delay
}

Not sure this is what you want since I did not fully understand your question, but now the delay will always be according to the previous message.

3

@vio_lovis

replace this code with yours and you will get the fast reply (idle response scenario for chatbot):

customMessageDelay: (message) => {
          let delay = message.length * 30;
          if (delay > 3 * 200) delay = 3 * 200;
          if (delay < 100) delay = 100;
          return delay;

Good Luck!

4

@vio_lovis did it for use?

5

Hi @nik202,
thanks for asking! I was busy implementing some new features. So I didn’t have so muc time to try it out. So far I couldn’t make it work. I added the solution suggested by Chris Rahme

					let m1 = null,
					customMessageDelay: (message) => {
					let delay = (m1 ? m1 : message.length) * 30;
                    if (delay > 6000) delay = 6000;
                    if (delay < 100) delay = 1000;
					m1 ? m1 : message.length;
                    return delay;},

to my code. However, then it brakes completly. I do not know JavaScript, therefore I am stuck right now.

My idea was to delay the messages from the bot according to the length of the message posted before. Because, if the bot answers in three bubbles and the first is very short, then the user won’t need so much time to read it. The second bubble could then be posted with only a short delay. If the second bubble, e.g. is very long, then the third bubble should be delayed more, in order for the user to have enough time to read the second bubble…
Does it make sense to you? You have seen our prototype, we provide a lot of information inside the bot already before guiding the user to the website…
Ciao, Vio

6

You made a mistake while copying my code, look at the line before the return.

I really suggest you learn JavaScript, this is something really simple, but no one but you will know exactly what you want better than you :slight_smile:.

I will make my code more beginner-friendly and explain it.

// Initializing a variable; this will be the length of the previous message
let m1 = null

customMessageDelay: (message) => {
    // Set the value of delay to the last message's delay (null on first message)
    let delay = m1

    // If the delay is null, aka if m1 is null, aka if this is the first message ever, set the delay according to the current message instead (you can instead set m1 to 0 if it is null and then set the delay to m1+message.length)
    if (delay == null) delay = message.length

    // Multiply the delay by 30
    delay = delay * 30

    // Make sure the delay is between 1000 and 6000 milliseconds
    if (delay > 6000) delay = 6000
    if (delay < 1000) delay = 1000

    // Save the current message's length in m1 to be used next time (you can save the delay instead, or anything you  want)
    m1 = message.length

    return delay
}
1 Like
7

Thank you very much, @ChrisRahme!
I copied your code into the Rasa Webchat Widget Code - for other complete newbies, it has to look like that:

For the sake of not totally misguiding other, that might be interested in the solution & don’t know JavaScript, I changed this post. The solution Chris Rahme provided has to look like this in the Rasa Webchat Widget Code:

				var last_message_length=null;
                window.WebChat.default(
                  {
                    initPayload: '/start',
                    customData: {language: "de"},
                    socketUrl: "https:/xxx-xxx-xxx.ngrok.io",
                    socketPath: "/socket.io/",
                    hideWhenNotConnected: false,
                    title: 'Lovis - Beta-Version',
					customMessageDelay: (message) => {
                        let delay = last_message_length
                            if (delay == null) delay = message.length
                            delay = delay * 30
                            if (delay > 6000) delay = 6000
                            if (delay < 1000) delay = 1000
                            last_message_length = message.length
                        return delay;},
1 Like
8

Happy to help :slight_smile: But m1 should be outside of the function! Otherwise it will get reset to null every time.

You can write var m1 = null on the very top of the code or just above the function. Just make sure you’re not using it anywhere else or it will override its value (unless that’s what you want of course).

9

@ChrisRahme - argh…you are rigth fo course :see_no_evil:
If I put it outside the function, than I get an error 

SyntaxError: missing : after property id

Do I ned to use a loop? Something like that?

customMessageDelay: (message) => {
					customMessageDelay: (message) => {
				    	for (var i=0;i<i+1; i++){
                        if (i ==0)  var m1= null
						else m1 = m1
						let delay = m1
    					if (delay == null) delay = message.length*30
    					delay = delay * 30
    					if (delay > 6000) delay = 6000
    					if (delay < 1000) delay = 1000
					    m1 = message.length
    					return delay};},
10

If you are delaying the response, it can backfire why because users want instant replies and don’t want to wait for every response i.e response 1 response 2 response 3, and so on… if you put delay it’s fine but I’d recommend giving every response fast and letting users decide how they want to read or skim the text . It’s your bot you can do anything :slight_smile: Good Luck!

11

Can you show me how you did it? Can you send your whole file here?

I can’t see how that error is related :sweat_smile:

As for your solution, it has many mistakes:

  • Putting a function inside of itself will not solve anything
  • The function inside of itself will not run because you’re not calling the inner function, just the outer one
  • The outer function will not return anything, even if you called the inner function inside of it
  • The for loop does not even do anything as you’re not changing anything inside of it
  • The for loop will never end, because your stop condition is that i should be smaller than i+1, which will never happen, so it will create an inifite loop which will block your whole code
12

Hi @nik202,
I will definetly keep that in mind - thanks!
However, it’s the feedback we got from our test users, therefore I will try to improve it according to their wishes…

13

Hi @ChrisRahme,
here is a screen shot:

grafik
grafik989Ă—859 93.8 KB

14

Next time please send the code instead of a screenshot so that I can rectify it :slight_smile:

You added the line at the wrong place, you’re doing it inside of an object instead of inside the code.

You can place it right before the window.WebChat.default line, or right before the let e = line.

And I know I was the one to suggest writing let m1, but in your case it might be better to write var m1.

And maybe give it a more proper name like last_message_length in case m1 is used somewhere else in the code.

1 Like
15

Hi @ChrisRahme,
thanks for your pacience with me. I wrote learning JavaScript on my ToDo-list… :sweat_smile:
Now it is working like I imagined it :slightly_smiling_face:

1 Like
16

Great! Happy to help, and good luck learning :slight_smile:

17

Thanks Chris and Vio. I borrowed this code for a project.

One question - this also seems to delay the first bot message based on the length of the bot message prior to the previous user message. It feels like the ideal functionality for each user message would be for the first bot message to appear without much delay, and then subsequent bot messages to be delayed based on length of the last bot message so the user has time to read them. Did you find the same Vio? Sounds like it would need changes on webchat side to achieve that though.

1 Like
18

Hi @botmatic, :wave:
That’s what I wanted to achieve. I am building a bot for the sex ed of teenagers in Germany. We don’t want them to feel overwhelmed by the amout of text they get as a response from the bot (teenager don’t like to read much). Therefore, we split our answers in multiple bubbles. Normally three. So the ideal case is:

(1) Teenager types it’s questions
(2) Bot answers with the first bubble delayed by a shot time (our bot should feel like a safe & calm space, not like anything is rushed)
(3) The second bubble then is delayed by a time t depending on the length of the first bubble, such that the teenager has time to read the first bubble before the second bubble appears
(4) The third bubble the is delayed by a time t depeding on the length of the second bubble …
and so on

You need to thank Chris, I couldn’t have done it on my own - still need to learn JavaScript :blush:

2 Likes
19

Thanks Vio. I was seeing the first bot message take a bit longer than expected, as if it was delayed in relation to a longer bot message prior to the last user message. But maybe I have some other issue going on here. Think I better learn JS too!

Your project sounds interesting… and sounds like a great use case of chatbot tech. Hope it all goes well!

Cheers, Theo

1 Like