JavaScript SDK Lite

SDK Lite version does not have a user interface, it performs the same communication functions by sending and receiving messages but leaving the entire visual part to the client.

Installation

First of all, we need to import the Script:

<script async src="...url/app-lite.js"></script>

After importing the script we will call the "init" method explained below

window.onload = function () {
    init(window.ImbeeSDK.AppLite);
};        

This configuration can be modified in later stable versions.

We have to create the function we call during the start of the core, in this case, it will be init(IMbee)

function init(IMbee) {
    ...
}

Within this function we will establish the configuration of our core, we will see this below.

Basic setup

To set the minimum configuration we will use the following example:

function init(IMbee) {
    var wsUrl = "...",
        xmppUrl = "...",
        apikey = "...",
        uniqueIdsha = "...",
        botIdsha = "...",
        environment = IMbee.ENVIRONMENT.Development;

    IMbee.init(wsUrl, xmppUrl, environment, apikey);

    IMbee.externalUserRegistration(uniqueIdsha, function(data) {
        IMbee.chatCreate(botIdsha, function(conversationId, created) {
            var options = {
                conversationTarget: conversationId
            }
            var appLite = IMbee.getApp(options);
            appLite.start();
        });
    });
}

In this basic configuration we see several key points that we will have to know and configure:

• wsURL is the webservice url.

• xmppUrl is the url that points to the xmpp server.

• apikey is the unique key by company or client.

• uniqueIdsha is the unique identifier per user.

• botIdsha is the unique identifier of the bot.

• environment Identify the environment in which the core will run.

  • IMbee.ENVIRONMENT.Production which has the value 1.

  • IMbee.ENVIRONMENT.Development that has the value 2.

All these parameters except the uniqueIdsha will be provided by Imbee and change for each environment.

More options

You can add more options to the options (parameter of IMbee.getApp).

To add a message received listener (triggered only when receiving a new message):

onMessageReceived: function(message) {
    console.log(message.getConversation().getUnreadMessagesNumber());
}

To access the content of the message you can find it here: message.attributes.content

onMessageUpdated: function(message) {
    console.log(message.getConversation().getUnreadMessagesNumber());
}

To add a connection changed listener:

onChatConnectionChanged: {
    onChatConnected: function() {
        console.log("connected");
    },
    onChatConnecting: function() {
        console.log("connecting");
    },
    onChatDisconnected: function() {
        console.log("disconnected");
    }
}

Send message

To send a simple text message:

var content = {
    type: IMbee.MESSAGE_CONTENT_TYPE.MESSAGE,
    plainText: "blablabla"
};
app.sendMessageWithFlags(conversationId, content, null, null);

To send an invisible message with postback:

app.sendMessageWithFlags(conversationId, content, "MY_POSTBACK", IMbee.MESSAGE_FLAG.INVISIBLE);

To send a custom message:

var externalContent = {
    type: IMbee.MESSAGE_CONTENT_TYPE.EXTERNAL,
    externalType: "my_external_type",
    externalData: {...}
};
app.sendMessageWithFlags(conversationId, externalContent, null, null);

Example code

An example of code is shown below, this is not functional until the URLs and id's that will be provided by IMbee are correctly configured.

<script async src="../app-lite.js"></script>
<script type="text/javascript">
    
    window.onload = function () {
        init(window.ImbeeSDK.AppLite);
    };     

    function init(IMbee) {
    
        var wsUrl = "https://wsprovidedurl.es",
            xmppUrl = "https://xmppprovidedurl.url",
            apikey = '6a0084f2e77ff621ff23ae43866234234234324',
            uniqueIdsha = 'uniqueId000039371921a',
            botIdsha = 'a47bb1d93c4223269512b72732432442423443242',
            environment = IMbee.ENVIRONMENT.Development;
       
        IMbee.init(wsUrl, xmppUrl, environment, apikey);
        
        IMbee.externalUserRegistration(uniqueIdsha, function (data) {
            IMbee.chatCreate(botIdsha, function (conversationId, created) {
                var options = {
                        conversationTarget: conversationId,
                        onMessageReceived: function (message) {
                            console.log("Message recived: " + message);
                            console.log(message);
                            // Triggered when receive a message 
                            // do your stuff                       
                        },
                        onMessageUpdated: function (message) {
                            // Triggered when receive or send a message
                        },
                        onChatConnectionChanged: {
                            onChatConnected: function () {
                                console.log("Chat connected");
                            },
                            onChatConnecting: function () {
                                console.log("Chat connecting");
                            },
                            onChatDisconnected: function () {
                                console.log("Chat disconnected");
                            }
                        }
                    };
                    
                var appLite = IMbee.getApp(options);
                appLite.start();
            });
        });
    };