added a bubble button callback and rasa integration demo. #79

shashwatrathod · 2020-10-31T06:25:39Z

Bubbles.js

Added a callback function called bubbleCallbackFn which is called whenever a user clicks on a 'bubble-pick' element. This is useful for scenarios where the action to be taken is not necessarily known or defined in the 'convo', like NLC tasks.

7-Rasa_demo.html

It demonstrates the integration of a famous NLC framework - RASA with chat-bubble. It also provides a usecase for bubbleCallbackFn.
To use this, a RASA server has to set up. The port and URL have to be edited in the html file. After the ice, the user can enter any text and the output will be delivered through RASA.

I think chat-bubble is a very powerful and easy tool to use. These changes will help demonstrate the versatility of the project. Thanks
!

dmitrizzle

Hi @shashwatrathod,

Thank you for this example! This tool was meant to be used with NLC from day one but I couldn't add an example yet. So thank you, this is very useful.

I've added a few comments to your code. It looks good, just a few changes to make for consistency and readability.

Most importantly, I'd like to learn about the tool you're using for NLC and be able to replicate your process. I think it would be helpful for all developers interested in this library to do this. Could you start a README_RASA.md with basic info and steps on how to build the server (or perhaps a link to the RASA's relevant docs?)

I understand those changes may bee too much. If you don't have time to make them, I can apply them to your branch or a copy of your branch (depending on GH permissions) - unless you object.

Cheers,
-d.

dmitrizzle · 2020-11-18T17:20:19Z

component/Bubbles.js

@@ -8,6 +8,7 @@ function Bubbles(container, self, options) {
  sidePadding = options.sidePadding || 6 // padding on both sides of chat bubbles
  recallInteractions = options.recallInteractions || 0 // number of interactions to be remembered and brought back upon restart
  inputCallbackFn = options.inputCallbackFn || false // should we display an input field?
+  bubbleCallbackFn = options.bubbleCallbackFn || false // is there a callback function for when a user clicks on a bubble button


Could we name this responseCallbackFn to match inputCallbackFn naming a little closer?

dmitrizzle · 2020-11-18T17:22:13Z

examples/7-Rasa_demo.html

+        // initialize by constructing a named function...
+        // ...and add text processing plugin:
+        function makeid() {
+            var result           = '';


Looks like the spacing in this file is a little different from the rest of the project. Can you either 1) adjust it so it matches the rest of the project a little better 2) add prettier package so it does all of that automatically?

dmitrizzle · 2020-11-18T17:23:46Z

examples/7-Rasa_demo.html

+        //A unique client id so that the data soesn't get mismatched
+        const client_id = makeid()
+
+        console.log(client_id)


Let's please keep debug logs out of production code.

dmitrizzle · 2020-11-18T17:25:03Z

examples/7-Rasa_demo.html

+        }
+
+        //the port at which RASA is running
+        port = '1001'


missing variable keyword declaration var

dmitrizzle · 2020-11-18T17:26:26Z

examples/7-Rasa_demo.html

+
+                var miss = function(text_inp = null){
+                    let xhr = new XMLHttpRequest()
+                    let url = "http://localhost:"+port+"/webhooks/rest/webhook"


Looks like this example requires running another server. I think we should explain how to start this server so that the example can be useful to all developers.

dmitrizzle · 2020-11-18T17:27:11Z

examples/7-Rasa_demo.html

+                    let xhr = new XMLHttpRequest()
+                    let url = "http://localhost:"+port+"/webhooks/rest/webhook"
+
+                    let input = false


In this project, we can only use var for compatibility with older browsers. I haven't added any transpilers.

shashwatrathod · 2020-11-18T18:03:39Z

Hello,
I have noted the changes to be done and I will start working on them. I will also create the README_RASA.md which might act as a beginner's guide to the framework.

Thanks!

shashwatrathod · 2020-11-28T07:36:23Z

Hello!
I have made the changes you requested for! I have added a very brief guide showing how to get started with Rasa and use chat-bubble to communicate with Rasa servers. I also prettier-fied example/7-Rasa_demo.html .

dmitrizzle · 2020-12-06T20:05:36Z

Hi @shashwatrathod, thank you for the changes!

I've tried to run the example on my machine but there are XHR errors both when I run the file from the filesystem and when I try to serve it with [serve](https://www.npmjs.com/package/serve). Do you know what may be the issue?

shashwatrathod · 2020-12-07T08:23:02Z

Hello,
I created a basic RASA project and tried serving ChatBubble using serve. It works fine for me. However, by the error you're getting, it seems like one of the two following steps could solve this issue:

Make sure that you pass the "--enable-api" and "--cors *" argument while serving RASA. The command should look like this:
rasa run --enable-api --cors * -p 1001.
Find the reference for 'rasa run' here.
Navigate to path/to/rasa/project/credentials.yml and add the following lines in the file to enable REST input:
rest:

Find the reference in RASA docs here

I hope this solves your issue!

Regards

dmitrizzle · 2020-12-08T17:13:10Z

Nope, no luck. I tried adding a "callback" as per docs, used the credentials example and ran from the terminal with --enable-api --cors * -p 1001. Did you have to disable same-origin policy within your browser or have any other settings in your app which may have helped with CORS?

dmitrizzle · 2021-01-20T23:07:07Z

Hey @shashwatrathod, I merged your code in #85 with some minor tweaks. Turns out there were quotes missing from --cors '*' flag, adding the ' fixed everything. I'm usually much quicker with these things but the past few months have been insane for me both personally and at work.

Thank you again for your work, I really appreciate your contribution!

shashwatrathod · 2021-01-21T09:11:41Z

Hey! @dmitrizzle, thank you very much! I was also caught up in a couple of things this past month, so it was really generous of you to find that bug for me. chat-bubble is a nice project and it was fun to make this little contribution!

Thanks!

shashwatrathod added 3 commits October 31, 2020 11:53

added a bubble button callback and rasa integration demo.

44ce7c4

added a type check for bubbleCallbackFn

57d8309

deleted contribution.md

eafdb05

dmitrizzle requested changes Nov 18, 2020

View reviewed changes

shashwatrathod added 2 commits November 28, 2020 12:39

added README_RASA.md. Made the other requested changes.

7245002

added two gifs to the README_RASA.md

4f6c842

dmitrizzle mentioned this pull request Jan 20, 2021

RASA integration #85

Merged

dmitrizzle merged commit 4f6c842 into dmitrizzle:master Jan 20, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

added a bubble button callback and rasa integration demo. #79

added a bubble button callback and rasa integration demo. #79

shashwatrathod commented Oct 31, 2020

dmitrizzle left a comment

dmitrizzle Nov 18, 2020

dmitrizzle Nov 18, 2020

dmitrizzle Nov 18, 2020

dmitrizzle Nov 18, 2020

dmitrizzle Nov 18, 2020

dmitrizzle Nov 18, 2020

shashwatrathod commented Nov 18, 2020

shashwatrathod commented Nov 28, 2020

dmitrizzle commented Dec 6, 2020

shashwatrathod commented Dec 7, 2020 •

edited

Loading

dmitrizzle commented Dec 8, 2020

dmitrizzle commented Jan 20, 2021

shashwatrathod commented Jan 21, 2021 •

edited

Loading

added a bubble button callback and rasa integration demo. #79

added a bubble button callback and rasa integration demo. #79

Conversation

shashwatrathod commented Oct 31, 2020

Bubbles.js

7-Rasa_demo.html

dmitrizzle left a comment

Choose a reason for hiding this comment

dmitrizzle Nov 18, 2020

Choose a reason for hiding this comment

dmitrizzle Nov 18, 2020

Choose a reason for hiding this comment

dmitrizzle Nov 18, 2020

Choose a reason for hiding this comment

dmitrizzle Nov 18, 2020

Choose a reason for hiding this comment

dmitrizzle Nov 18, 2020

Choose a reason for hiding this comment

dmitrizzle Nov 18, 2020

Choose a reason for hiding this comment

shashwatrathod commented Nov 18, 2020

shashwatrathod commented Nov 28, 2020

dmitrizzle commented Dec 6, 2020

shashwatrathod commented Dec 7, 2020 • edited Loading

dmitrizzle commented Dec 8, 2020

dmitrizzle commented Jan 20, 2021

shashwatrathod commented Jan 21, 2021 • edited Loading

shashwatrathod commented Dec 7, 2020 •

edited

Loading

shashwatrathod commented Jan 21, 2021 •

edited

Loading