API Docs for: 2.0.20133.2
Show:

ui.chat Class

Module: UI Chat
Parent Module: UI

Chat UI Module

Item Index

Methods

Methods

render

(
  • config
)
Promise static

Render the Chat UI

Parameters:

  • config ui.chat.Config

    A ui.chat.Config object

    • [uiInfo] ui.UIInfo optional

      A ui.UIInfo object ui.UIInfo

      • [type] ui.HostType optional
        A value in {{#crossLink "ui.HostType"}}{{/crossLink}} which indicates the type of UI to render e.g. IFRAME, POPUP.
      • [containerSelector] String optional
        Only required for iframe -- a JQuery selector statement to define the element into which the iframe will be loaded
      • [height] Number optional
        The height of the rendered UI
      • [width] Number optional
        The width of the rendered UI

Returns:

Promise:

A promise that resolves to a ui.chat.SDK object when the UI component has successfully loaded

Example:

// Modalities API must be called first to get the modalities object which is required to render chat.
// Render chat as an IFRAME.
// More UIInfo examples available here
var uiInfo = {
    type: MsSupportSdk.ui.HostType.IFRAME,
    containerSelector: "#iframe-container"
};

// Create a chat config
var config = {
    uiInfo: uiInfo
    modalities: window.savedModalities, // See Modalities API examples about how to get the modalities object
    onEstablished: function() {
        console.log("Chat established");
    },
    onQueued: function (e) {
        console.log("Chat queued.");
    },
    onQueueUpdated: function (e) {
        console.log("Chat queue position updated.");
    },
    onMessage: function (e) {
        console.log("Chat message received.");
    },
    onClosed: function () {
        console.log("Chat closed.");
    },
    onTransferred: function() {
        console.log("Chat transferred.");
    },
    onRejoinUrl: function (e) {
        console.log("Rejoin url received.");
    },
    onAgentDataReady: function() {
        console.log("AgentDataReady received");
    }
 };

// Render chat UI
MsSupportSdk.ui.chat.render(config).then(
    function(chatSDK) {
        // See ui.chat.SDK for details about chatSDK. 
        // chatSDK.updateContext({ foo: "bar" }); // Update context of the current chat session
        // chatSDK.sendMessage("Test message"); // Send a message to agent
    },
    function(err) {
        console.log(err.message);
    });