Chat APIs and In-app Messaging SDKs for Developers

Applozic provides Chat APIs and In-app Messaging SDKs for Android, iOS and Web apps to power cross-device, multi-platform rich messaging.
Find comprehensive guides and platform-specific Chat API documentation to get started with In-app Messaging.

Get Started    

Rich Messaging

Rich messaging documentation

In addition to text, audio, attachment etc type of messages Applozic also provides a set of structured messaging options in form of message templates, suggested replies, buttons and more. This documentation will guide you through creating a structure for sending these types of messages.
The structure for the messages is defined in form of a JSON and then sent in the metadata of a message.
Applozic provides 6 types of inbuilt templates for structured messages.

Identifying a Rich message

“contentType” property has been added into metadata to separate rich messages from normal messages. The value of “contentType” is “300” for rich messages. Below is the metadata for all rich messages templates :

{
    "contentType":"300"
}

As of now, Applozic provides two generic types of rich messages:
1) Generic card rich message
2) Generic list rich message

Generic cards

Suggested Replies

To render suggested replies on the UI you need to send 2 fields in the payload:
1) title : display name for the button.
2) message: A message that would be sent as a reply.

Note: Suggested Replies were previously called Quick Replies.

The templateId for suggested replies is 6

Below is the payload that would render the suggested replies on UI:

"metadata":{  
   "payload":"[{"title":"Where is my cashback? ",
   "message":"Where is my cashback? "
},
{  
   "title":"Show me some offers ",
   "message":"Show me some offers"
},
{  
   "title":"Cancel my order ",
   "message":"Cancel my order "
},
{  
   "title":"I want to delete my account ",
   "message":"I want to delete my account"
},
{  
   "title":"Send money ",
   "message":"Send money "
},
{  
   "title":"Accept money ",
   "message":"Accept money "
}
]", 
   "templateId":"6",
"contentType":"300",
}

The complete message would look like below:

{
  "to":"reytum",
  "metadata" : {
    "payload":"[{\"title\":\"Where is my cashback? \",\"message\":\"Where is my cashback? \"},{\"title\":\"Show me some offers \",\"message\":\"Show me some offers\"},{\"title\":\"Cancel my order \",\"message\":\"Cancel my order \"},{\"title\":\"I want to delete my account \",\"message\":\"I want to delete my account\"},{\"title\":\"Send money \",\"message\":\"Send money \"},{\"title\":\"Accept money \",\"message\":\"Accept money \"}]",
   "templateId":"6",
   "contentType":"300"
  }
}

Below is the image of the message that will be rendered from the above JSON:

On click of the button a message would be sent with the text from the "message" property of the payload.

To get the click outside the SDK you need to implement the ALRichMessageListener in your Application class and then override the onAction method from it.

public class SampleApplication extends Application implements ALRichMessageListener{
  
   @Override
    public void onAction(Context context, String action, Message message, Object object) {
        if("Click" == action){
              String text = (String) object;//object will be the message text from the button
          //message will be applozic message object
          }   
    }
}

Generic templates

To render the generic cards you need to send the following fields in the payload:
1) title - The title that will be displayed in bold
2) subtitle - The subtitle of the content (could be address or short description)
3) headerImageUrl - The image that will be displayed
4) overlayText - The text will be displayed over the image (could be price)
5) description - A description could be 3 lines.
6) rating - small text that would be shown right of the title
7) actions - Vertically aligned buttons that would be displayed at the of the template(Maximum of 3)

templateId for generic templates is 2.

Below is a sample json for the payload:

[{
  "title": "OYO Rooms kundanahalli",
  "subtitle": "Kundanahalli road turn.",
  "headerImageUrl": "http://www.tollesonhotels.com/wp-content/uploads/2017/03/hotel-room.jpg",
  "overlayText": "Rs. 4000",
  "description": "Bharathi Road | Near Head Post Office, Cuddalore 607001",
  "rating": 2345,
  "actions": [
    {
      "data": "Thanks for selections, We will send details",
      "name": "View Details",
      "action": "sendMessage"
    },
    {
      "data": "www.facebook.com/myhotel.html",
      "name": "Go to Facebook",
      "action": "openUrl"
    },
    {
      "data": "Thanks for selections, We will send details",
      "name": "Open Activity",
      "action": "openActivity"
    }
  ]

}]

You can make a list of the jsons and then stringify them and add it to the payload.
Below is the complete message JSON for the same:

{
  "to":"reytum",
  "message" : "Below are the list of hotels",
  "metadata" : {
    "payload":"[{\n  \"title\": \"OYO Rooms kundanahalli\",\n  \"subtitle\": \"Kundanahalli road turn.\",\n  \"headerImageUrl\": \"http://www.tollesonhotels.com/wp-content/uploads/2017/03/hotel-room.jpg\",\n  \"overlayText\": \"Rs. 4000\",\n  \"description\": \"Bharathi Road | Near Head Post Office, Cuddalore 607001\",\n  \"rating\": 2345,\n  \"actions\": [\n    {\n      \"data\": \"Thanks for selections, We will send details\",\n      \"name\": \"View Details\",\n      \"action\": \"sendMessage\"\n    },\n    {\n      \"data\": \"www.facebook.com/myhotel.html\",\n      \"name\": \"Go to Facebook\",\n      \"action\": \"openUrl\"\n    },\n    {\n      \"data\": \"Thanks for selections, We will send details\",\n      \"name\": \"Open Activity\",\n      \"action\": \"openActivity\"\n    }\n  ]\n\n},\n{\"title\": \"OYO Rooms Whitefiled\",\n  \"subtitle\": \"WHitefield road turn.\",\n  \"headerImageUrl\": \"http://www.tollesonhotels.com/wp-content/uploads/2017/03/hotel-room.jpg\",\n  \"overlayText\": \"Rs. 3000\",\n  \"description\": \"Bharathi Road | Near Head Post Office, Cuddalore 607001\",\n  \"rating\": 2345,\n  \"actions\": [\n    {\n      \"data\": \"Thanks for selections, We will send details\",\n      \"name\": \"View Details\",\n      \"action\": \"sendMessage\"\n    },\n    {\n      \"data\": \"www.facebook.com\",\n      \"name\": \"Go to Facebook\",\n      \"action\": \"openUrl\"\n    },\n    {\n      \"data\": \"Thanks for selections, We will send details\",\n      \"name\": \"Open Activity\",\n      \"action\": \"openActivity\"\n    }\n  ]\n}]",
   "templateId":"2",
   "contentType":"300"
  }
}

Below is the image of the message that will be rendered from the above JSON:

You can also experiment on removing the headerImageUrl, rating, subtitle etc fields based on your use case.

Below is the image of the message that will be rendered if you don't pass headerImageUrl and 'rating' field in the JSON:

Actions for generic templates:

To receive the click action of a for a message you need to implement the ALRichMessageListener in your Application class and then override the onAction method from it.

@Override
    public void onAction(Context context, String action, Message message, Object object) {
    //action will be the text that is sent in the action field 
    //message will be the complete message object containing the payload in the metadata
    //object will be the text that is sent in the data field.
        switch (action) {
            case "sendMessage":
                new MessageBuilder(context).setMessage((String) object).setGroupId(message.getGroupId()).send();
                break;

            case "openUrl":
                Intent intent = new Intent(context, PaymentActivity.class);
                intent.putExtra("formAction", (String) object);
                context.startActivity(intent);
                break;

            case "openActivity":
                Intent intent1 = new Intent(context, MainActivity.class);
                context.startActivity(intent1);
        }
    }
/// For Generic Card
NotificationCenter.default.addObserver(forName: NSNotification.Name(rawValue: "GenericRichCardButtonSelected"), object: nil, queue: nil) { (object) in
            print("\(object)")
            /// Object contains 6 elements.
            /// "card" - This contains information about the generic card that has been clicked.
            /// "template" - This contains complete payload passed in the message object.
            /// "messageKey" - Key of the message object.
            /// "userId" - User Id of the receiver.
            /// "buttonIndex" - Index of the button that has been tapped(index starts from 1).
            /// "buttonName" - Name of the button that has been tapped.
}

/// For Generic List
NotificationCenter.default.addObserver(forName: NSNotification.Name(rawValue: "GenericRichListButtonSelected"), object: nil, queue: nil) { (object) in
            print("\(object)")
            /// Object contains 5 elements.
            /// "template" - This contains complete payload passed in the message object.
            /// "messageKey" - Key of the message object.
            /// "userId" - User Id of the receiver.
            /// "buttonIndex" - Index of the button that has been tapped(index starts from 0).
            /// "buttonName" - Name of the button that has been tapped.
        }

Generic lists

Generic lists are used to display a list of structures items. Currently Applozic supports only text lists.
Below are the properties you need to send in the payload for rendering the list.
1) headerText : used to display a text as a title
2) payload: consisting of a list of title and message structure similar to quick replies.

templateId for lists is 8.

Below is the JSON structure for list:

"metadata":{  
   "payload":"[   
   {   
      "   title":"Where is my cashback? ",
   "message":"Where is my cashback? "
},
{  
   "title":"Show me some offers ",
   "message":"Show me some offers"
},
{  
   "title":"Cancel my order ",
   "message":"Cancel my order "
},
{  
   "title":"I want to delete my account ",
   "message":"I want to delete my account"
},
{  
   "title":"Send money ",
   "message":"Send money "
},
{  
   "title":"Accept money ",
   "message":"Accept money "
}
]", 
   "templateId":"8",
"contentType":"300",
"headerText":"Hi, How may I help you ?"
}

Below is the JSON of complete message sent with the above payload:

{  
   "to":"reytum",
   "message":"",
   "metadata":{  
      "payload":"[{\"title\":\"Where is my cashback? \",\"message\":\"Where is my cashback? \"},{\"title\":\"Show me some offers \",\"message\":\"Show me some offers\"},{\"title\":\"Cancel my order \",\"message\":\"Cancel my order \"},{\"title\":\"I want to delete my account \",\"message\":\"I want to delete my account\"},{\"title\":\"Send money \",\"message\":\"Send money \"},{\"title\":\"Accept money \",\"message\":\"Accept money \"}]",
      "templateId":"8",
      "contentType":"300",
      "headerText":"Hi, How may I help you ?"
   }
}

Below is the image of the message that will be rendered from the above JSON.