Chat Widget Documentation: General

By default, if agents are online and “enabled” on chat, the widget will automatically show a button on the page that can be clicked to begin a chat (see data-hidden below if you do not want to show the button by default). You can use “COMPANY-preprod.js” to connect to the preproduction server.

The script may have the following attributes:

• data-id (mandatory): The “setup” to use which is a combination of the theme and various forms and settings. This will be created by administrators in Arthur.
• data-hidden (optional, default: “false”): A value of “true” will mean the chat button will not show unless explicitly triggered. “false” will mean the button will be added automatically. The chat window may be hidden on pages where URL history tracking is required, but chat initiation is not.

Note: If a customer has an ongoing chat the window will re-open when they refresh the page or navigate to another regardless of the value of `data-hidden`.

After including the script, a global window object EdgeTierChat should be available with various methods.

All methods take a callback that will be invoked when the operation is finished. The callback will be provided with two parameters:

• error: A string or null if an error occurred during the operation.
• data: Any information returned or null.

 

Any of these methods can be called independently of each other. For example, you do not need to call isAvailable() before open(), the widget will do that internally for you.

EdgeTierChat.isAvailable(callback)

Check if chat is turned on for the given data-id and if agents are online for the customer’s language.  Language is determined via the “lang” attribute on the source HTML page. The callback will return a single boolean property isAvailable as a result.

EdgeTierChat.isAvailable((error, data) => {
    if (error) {
        console.error(error);
    } else if (data.isAvailable) {
        // Add a custom "Chat Now" button.
        const button = document.createElement("button");
        button.textContent = "Chat Now";
        button.addEventListener("click", () => EdgeTierChat.open());
        document.body.appendChild(button);
    }
});

EdgeTierChat.showButton(callback)

Display the widget button to start a chat.

// Just try to show the button and ignore the result.
EdgeTierChat.showButton();


// Show the button and do something afterwards.
EdgeTierChat.showButton(error => {
    if (error) {
        console.error(error);
    } else {
        console.log("Button has been rendered");
    }
});


// Show the button after five seconds.
setTimeout(() => EdgeTierChat.showButton(), 5000);

EdgeTierChat.open(callback)

Open the chat window.

// Just open the chat window and ignore the result.
EdgeTierChat.open();


// Open the chat window and do something afterwards.
EdgeTierChat.open(error => {
    if (error) {
        console.error(error);
    } else {
        console.log("Chat window has been opened");
    }
});

EdgeTierChat.setOptions(options, callback) Define widget options before opening. Any subsequent calls to this method after the widget is already opened will have no effect unless the user completely closes and reopens it again. Currently two options are available:

• hideMinimiseButton, boolean, default = false. If set to true the minimise button will not be rendered in the widget. This is primarily intended for custom rendering solutions e.g. web views or pop out windows.
• hideCloseButton, boolean. A close button will display by default if the “data-hidden” attribute is “true”. Use this option to hide that button if necessary.

// Set options and ignore any errors.
EdgeTierChat.setOptions({ hideMinimiseButton: true });


// Set options and handle errors.
EdgeTierChat.setOptions({ hideMinimiseButton: true }, error => {
    if (error) {
        console.error(error);
    } else {
        console.log("The option has been set.");
    }
});

EdgeTierChat.storeVariable(variableId, value, callback)

Store a variable that will be passed to Arthur when a chat starts. The variable value can be a boolean, number, string, date or null. Only known variable IDs may be stored, please contact EdgeTier directly for a list of accepted variables.

// Example IDs for variables. These will depend on your specific configuration.
const variableIds = { SESSION_ID: 1, DEPARTMENT: 2 };

// Store a value of 100 for the variable "SESSION_ID" and ignore the result.
EdgeTierChat.storeVariable(variableIds.SESSION_ID, 100);


// Store a value of "Sales" for "DEPARTMENT" and do something afterwards.
EdgeTierChat.storeVariable(variableIds.DEPARTMENT, "Sales", error => {
    if (error) {
        console.error(error);
    } else {
        console.log("The variable has been stored");
    }
});

EdgeTierChat.setSetupId(setupId, callback)

Change the “setup ID” which is used to determine branding, widget placement and other settings. This is the equivalent of the “data-id” attribute on the script above. Note that the setup ID cannot be changed after a user opens the window, even if they later minimise it.

// Just change the setup ID and ignore the result.
EdgeTierChat.setSetupId(2);


// Change setup ID and do something afterwards.
EdgeTierChat.setSetupId(2, (error) => {
    if (error) {
        console.error(error);
    } else {
        console.log("The setup ID has been changed");
    }
});

EdgeTierChat.Errors

Enum/dictionary of errors for handling specific use cases.

EdgeTierChat.showButton(error => {
    if (error === EdgeTierChat.Errors.Offline) {
    const message = document.createElement("p");
    message.textContent = "No agents are online now, please try again later.";
    document.body.appendChild(message);
    } else {
    // Do something else.
}
});