1. Home
  2. Docs
  3. Tutorials
  4. Build a contextual conversational application

Build a contextual conversational application

A conversation is the “exchange of ideas” between 2 or more people. In other words, it’s a series of questions and answers. In the conversational app you’re building your interaction, too, has two sides: the end-user can ask “what happened today in the past?” and your bot will respond with an interesting fact from the fact, and might also add: “Do you want me to send you a link to article?” The end-user can then approve the offer, or respond with something like, “No, please deliver it to my office.” As we can see, a true contextual conversation isn’t a simple Q&A. Each end user can use a different order, or flow of information and your app needs to handle all the different flows.

In the previous guide, you built a “what happened today” conversational application that use Zapier to integrate with more than 750 web apps. In this tutorial, we will add contextual conversation to your application; Alexa skill, Google Home action or your chatbot.

Some of the information in this guide is more developer-centric, but don’t be discouraged. If you follow the steps as they’re outlined, you will have a deployed, working “what happened today” app.

Store and retrieve context

To store and retrieve a session context, you should use ConversationRequest’s session object.

You can store a simple string using the set method

req.getSession().set("lastIndex", "1");

And retrieve it later using get

req.getSession().get("lastIndex");

You can store JSON objects using JSON.stringify

req.getSession().set("myContextObject", JSON.stringify({lastIndex:1}));

And retrieve it later using JSON.parse 

var myContextObject = JSON.parse(req.getSession().get("myContextObject"));

Use session data in your app

In the previous version of the code, we choose random event out of the list returned from the API. We will start by returning the events in a serial order instead.

  1. Edit the code response of the “whatHappenedToday” intent to the code:
    var backendcontext = sdk.conversationHelper.getBackendContext(context, req, res);
    if (!backendcontext) return;
    var today = new Date();
    var day = today.getDate();
    var month = today.getMonth()+1;
    return fetch("http://history.muffinlabs.com/date/"+month+"/"+day)
     .then(function(res) {
        return res.json();
     }).then(function(json) {
        var suffix = "";
        var events = json.data.Events;
        if (req.slot("eventType") == "who was born") {
            var events = json.data.Births;
            suffix = ", was born";
        }
        var eventIndex = 0;
        if (typeof req.getSession().get("lastIndex") !== 'undefined' && req.getSession().get("lastIndex") !== null){
            eventIndex = parseInt(req.getSession().get("lastIndex"))+1;
            if (eventIndex >= events.length){
                eventIndex = 0;
            }
            req.getSession().set("lastIndex", eventIndex);
        }
        else{
            req.getSession().set("lastIndex", 0);
        }
        var selectedEvent = events[eventIndex];
        res.say("Hi "+ backendcontext.firstname+".");
        res.say('On this day,'+selectedEvent.year+' - '+selectedEvent.text.replace(/(\(.*\))/g,'')+suffix);
     });

    In the lines 17 – 26 we fetch the stored index and save a new one

Try it out

Now that your app can “remember” session data, try out what you have so far.

In the chat console on the right, type in a request “What happened today?”. After you type the request, hit “Send”.

The chatbot will answer with an interesting event from the past.

Next, In the chat console on the right, type again the request “What happened today?”. After you type the request, hit “Send”.

The chatbot will answer with another event from the past, pay attention that the events are ordered by year, so each request will return a later event.

Add Context to your app

Once your application can remember it an become contextual. For example, to respond to a user “Yes” or “No” intent, we must be able to remember what we asked the user to confirm. In this tutorial, we will ask the user if he or she wants to listen to the next event in history if the user confirms we will return the next event.

Conversation.one has builtin handlers for Yes and No intents, and normally there is no need to change the default settings. We will show here how to utilize the default Yes and No handlers, to create a contextual conversational flow.

var cbData = {
  callback: 'whatHappenedTodayFunction',
  data: {
    lastIndex: lastIndex,
    eventType: req.slot("eventType")
  }
};
req.getSession().set('onYes', JSON.stringify(cbData));

The code above instructs Conversation.one to call the function ‘whatHappenedTodayFunction’ when the user invokes the Yes intent, with the data {lastIndex: lastIndex,eventType: req.slot(“eventType”)}.

A similar code can be applied for No intents by replacing ‘onYes’ with ‘onNo’.

Now let’s modify our code to include a contextual flow.

  1. Add callback functions
    In the Business Logic tab add the following code

    function whatHappenedTodayOnYes(context, req, res, onYesData) {
        var eventIndex = onYesData.lastIndex + 1;
        var events = onYesData.events;
    
        var selectedEvent = events[eventIndex];
        if (eventIndex + 1 < events.length) {
            res.say('On this day,' + selectedEvent.year + ' - ' + selectedEvent.text.replace(/(\(.*\))/g, '') + onYesData.suffix);
            req.getSession().set('onYes', JSON.stringify({
                callback: 'whatHappenedTodayOnYes',
                data: {
                    lastIndex: eventIndex,
                    suffix: suffix,
                    events: events
                }
            }));
            req.getSession().set('onNo', JSON.stringify({
                callback: 'whatHappenedTodayOnNo',
                data: {}
            }));
            res.say(" Would you like to hear more?");
        } else {
            sdk.conversationHelper.addAnythingElseMessage(res);
        }
    }
    
    function whatHappenedTodayOnNo(context, req, res, onNoData) {
        sdk.conversationHelper.addAnythingElseMessage(res);
    }
  2. We will modify the whatHappenedToday intent response with the new contextual flow
    var backendcontext = sdk.conversationHelper.getBackendContext(context, req, res);
    if (!backendcontext) return;
    var today = new Date();
    var day = today.getDate();
    var month = today.getMonth()+1;
    return fetch("http://history.muffinlabs.com/date/"+month+"/"+day)
     .then(function(res) {
        return res.json();
     }).then(function(json) {
        var suffix = "";
        var events = json.data.Events;
        if (req.slot("eventType") == "who was born") {
            var events = json.data.Births;
            suffix = ", was born";
        }
        var selectedEvent = events[0];
        res.say("Hi "+ backendcontext.firstname+".");
        res.say('On this day,'+selectedEvent.year+' - '+selectedEvent.text.replace(/(\(.*\))/g,'')+suffix);
        if (events.length > 1) {
            req.getSession().set('onYes', JSON.stringify({
                callback: 'whatHappenedTodayOnYes',
                data: {
                    lastIndex: 0,
                    suffix:suffix,
                    events: events
                }
            }));
            req.getSession().set('onNo', JSON.stringify({
                callback: 'whatHappenedTodayOnNo',
                data: {}
            }));
            res.say(" Would you like to hear more?");
        } else {
            sdk.conversationHelper.addAnythingElseMessage(res);
        }
     });

     

Whenever we do not have anything further to ask the user, we call sdk.conversationHelper.addAnythingElseMessage to make sure the conversation flow is still opened.

Try it out

Now that your app has contextual flow, try out what you have so far.

In the chat console on the right, type in a request “What happened today?”. After you type the request, hit “Send”.

The chatbot will answer with an interesting event from the past and will ask you if you would you like to hear more. Try to answer Yes few times, then answer No.

What’s next?

In the next part, you’ll learn how to contextual conversations flow to gather missing data, a technique called “entities filling”.

Was this article helpful to you? Yes No 2

How can we help?