Messaging Bots are the "in thing", apparently

Back in March/April 2016 time I was working on a personal project using Bluemix.

Y'know what Bluemix is right?.... I've been banging on about it for long enough, if you do not, get yourself over there and sign-up for a free 30 day account and see what wonders YOU can achieve.  (sales pitch is now over)

There were some new Watson API services being offered that looked pretty cool.

Dialog - How it works (The official documentation link)

and some MORE documentation (telling you how it works in a little bit more detail).

You basically have to setup a nodeJS SDK app and associate the Dialog service to the app: 

 Then you can start trying it out for yourself:

There is a restriction that you should be aware of:

This is where you then start to notice when it finally gets down into the details.... here's the Tutorials talking about the XML file(s) that drive it all.

Ah, okay, so after all the fancy and sexy GUI related side of things, we get to the bare bones of what drives the Dialog service.  XML content.  (Can I have it in JSON format please?!?!).

Now that you know that, well, it's going to be simple now isn't it?.....

Before you charge-off hand crafting the XML content, make sure you take a look at the documentation that will explain all of the FEATURES that you can hand craft into your XML file.

OKAY, so this is where I stop talking about what you get "out of the box" and move onto - "so, Tony, what have you done to make life a little easier?".

Well, considering all the previous super sexy stuff about Bluemix / Watson and the Dialog service was GUI based, I 'started' making a GUI front-end to the XML.  Why not?  Hey, it's more natural and would possibly increase adoption a bit more?

I also had an idea about integrating several of the Watson services together to make a "bigger" solution:

I've still got that to one-side, but, as they say, start small.......

I started to think about / plan what would be needed for my "conversation".  I had just gotten off a conference call, where I was asked a ton of questions about the IBM MobileFirst Platform product and everything associated with it.  Seemed natural to then write down the questions I was asked and the answers I gave and then see how they could be cross-referenced and linked:

This then led into a mass XML file creation session.  630-odd lines of XML, that I had to manage in my head / on bits of paper to ensure that the XML was still valid and that it was going to follow the desired path/routes:

This is where I started to think "how can I make life a little easier?".

I did some searching around for some JavaScript libraries that represent XML in a GUI fashion, there were a few available, but the one I settled on was mxGraph by

It does require that you PURCHASE a license for it - which I am sure you will do if you move into proper development / production usage of the product.  (I'm still 50/50 as to whether to continue usage).

The positive side of using it is that it is very documented / lots of samples and it's very easy to get going with it.

So, back to my plan (oh, you DO know about don't you?  Oh my, if you do not, get yourself over there and sign up for an account - it is another really useful tool that you WILL wonder how you got by without!)

My idea was to make a very simple HTML web-page with some JavaScript and use the mxGraph to allow the user to create the Questions / Answers and link them together.  The output of this would be an XML file that the web-page could then read back in (for updating editing later on), but also allow for EXPORTING to the XML format required for the Dialog Tool.  Thereby, not needing to manually create the Dialog Tool XML file by hand.

I have nginx installed, so it was very quick to setup a folder with the required folders needed:
The key file is index.html.

As a teaser, here is what the UI looks like when it has read the dialog1.xml file, processed it and output it to the UI via the mxGraph library:  (Here I have used the +|- on the top left to zoom out, so we can see the whole set of Questions and Answers)

As you can see, using mxGraph allows you to represent quite a complex structure of Questions and Answers and linkages.

I started to write the code where you can enter a new question, press the "Add Question" button and it creates a new box node.  The question text is available and is even a tooltip too:
The plan was to then allow the user to click on another Question or Answer and "link" them together.
I have not got to that code yet.

You can see the potential / possibilities though:

If I open up debug mode / Inspect in Chrome and I press the "EXPORT XML" button, you can see where I loop through the representation data from mxGraph itself (they store this in JSON format):

and then I loop through and export this into the XML format that is required for the Dialog Tool:


Unfortunately, I got bored / lost interested / had my day job getting in the way / re-started travelling around Europe again - so I parked what I had done and basically forgot about it.

Then, today I saw this article published and thought, hey, why not put out what I've done so far and if there is enough interest, I'll continue with the development.  If not, well, at least I've got my idea documentation somewhere, so if I do come back to it, I can re-read this page and get back up to speed!

No comments:

Post a Comment