Instance methods and events

The Webchat widget, upon initialization, exposes a collection of methods and events that you can use to interact with the widget. You can use these to control the widget's behaviour, theme the widget, send messages from your own functions and much more.

<script src="https://cdn.jsdelivr.net/npm/@moveo-ai/web-client@latest/dist/web-client.min.js"></script>
<script>
MoveoAI.init({
integrationId: "YOUR_INTEGRATION_ID",
})
.then((instance) => {
console.log("connected");
// The instance returned here exposes the methods and events listed below.
// You can also assign them to a global variable so they can be accessed from anywhere in your website.
})
.catch((error) => console.error(error));
</script>

Instances

MethodDescription
openWindowOpens Webchat if it is currently closed.
closeWindowCloses Webchat if it is currently opened.
sendMessageSends the specified message to the virtual assistant.
updateContextUpdates the context of the user.
setCSSVariablesOverrides the exposed CSS variables so the web-widget can be custom styled.
setLocaleUpdates the locale of the user.

instance.openWindow

Opens the chat window if it is currently closed

Example
instance.openWindow();

instance.closeWindow

Closes the chat window if it is currently open

Example
instance.closeWindow();

instance.sendMessage

This method can be used to programmaticaly send a text message to the assistant.

Example
instance.sendMessage({ text: "This is a sample text message" });
Usage
  • If a conversation already exists, the message will be sent directly to the user.
  • If there is no existing conversation, the welcome_trigger_message will be overridden and the message will be sent.
  • If Visitor Information is required, the message will be sent only after the form has been completed.
note

If the chat window is closed, use the openWindow method to open it.

Example
instance.sendMessage({ text: "This is a sample text message" });
instance.openWindow();

instance.updateContext

This method can be used to update the user information or to add new tags to the current session.

Example
instance.updateContext({
user: { display_name: "Moveo user" },
customer_id: 12345,
});

instance.setLocale

This method can be used to update the default language text of the webchat. You can find a list if the supported locales (languages) in the following table.

Available locales
CodeLanguage
de๐Ÿ‡ฉ๐Ÿ‡ช German
el๐Ÿ‡ฌ๐Ÿ‡ท Greek
en๐Ÿ‡บ๐Ÿ‡ธ English
es๐Ÿ‡ช๐Ÿ‡ธ Spanish
fr๐Ÿ‡ซ๐Ÿ‡ท French
it๐Ÿ‡ฎ๐Ÿ‡น Italian
bg๐Ÿ‡ง๐Ÿ‡ฌ Bulgarian
pt-br๐Ÿ‡ง๐Ÿ‡ท Portuguese (Brazil)
ro๐Ÿ‡ท๐Ÿ‡ด Romanian
pl๐Ÿ‡ต๐Ÿ‡ฑ Polish
cs๐Ÿ‡จ๐Ÿ‡ฟ Czech
id๐Ÿ‡ฎ๐Ÿ‡ฉ Indonesian
nl๐Ÿ‡ณ๐Ÿ‡ฑ Dutch
sr๐Ÿ‡ท๐Ÿ‡ธ Serbian
sv๐Ÿ‡ธ๐Ÿ‡ช Swedish
ru๐Ÿ‡ท๐Ÿ‡บ Russian
sq๐Ÿ‡ฆ๐Ÿ‡ฑ Albanian
zh๐Ÿ‡จ๐Ÿ‡ณ Chinese
ar๐Ÿ‡ธ๐Ÿ‡ฆ Arabic
ja๐Ÿ‡ฏ๐Ÿ‡ต Japanese
tr๐Ÿ‡น๐Ÿ‡ท Turkish
Example
instance.setLocale("en");

instance.setCSSVariables

This method can be used to change appearance of the web-widget. You can find a list of all the available variables below

CSS variables:
VariablesDescription
--moveo-background-colorThe primary color of web widget
--moveo-accent-colorThe secondary color of the web widget
--moveo-header-heightThe height of the web widget header
Example
instance.setCSSVariables({
"--moveo-background-color": "red",
"--moveo-accent-color": "blue",
});

Events

EventDescription
onSessionCreatedIs executed every time a new conversation is created
onConversationClosedIs executed every time a conversation is closed

instance.onSessionCreated

You can use this event to execute your own functions when a new session is created.

instance.onSessionCreated(() => {
instance.updateContext({
user: { display_name: "Moveo user" },
});
});

instance.onConversationClosed

You can use this event to handle the cases when the conversation is closed.

instance.onConversationClosed(() => {
console.log("Resolved");
window.close();
});
Last updated on