JavaScript API
We expose some functions in the Frontend to programmtically control the Chat window.
window.Pylon("show")
Opens the chat window. Useful for programmatically triggering the chat window from an explicit support flow or button on your site.
window.Pylon("hide")
Closes the chat window.
window.Pylon("onShow")
Pass in a callback function that is called when the chat is shown. Useful for managing state of the chat window. If you pass in null
as the callback function, the existing callback is removed.
window.Pylon("onShow", function () {
console.log("show chat!");
});
window.Pylon("onHide")
Pass in a callback function that is called when the chat is hidden. Useful for managing state of the chat window. If you pass in null
as the callback function, the existing callback is removed.
window.Pylon("onHide", function () {
console.log("hide chat!");
});
window.Pylon("onChangeUnreadMessagesCount")
Pass in a callback function that is called immediately and when the unread message count changes. If you pass in null
as the callback function, the existing callback is removed.
window.Pylon("onChangeUnreadMessagesCount", function (unreadCount) {
console.log("unread changed!", unreadCount);
});
window.Pylon("setNewIssueCustomFields")
Pass in an object of custom field slugs to their values. New issues created through the chat will have these custom fields values set.
You must first create the corresponding custom fields inside of Pylon.
Example:
window.Pylon("setNewIssueCustomFields", { user_id: "abc123" });
You can find the slug value on the custom fields page next to the custom field.
![](https://mintlify.s3-us-west-1.amazonaws.com/pylon/images/chat-slug.png)
window.Pylon("showNewMessage", "string")
Pass in a message to prepopulate in the editor. For example, use this when a user runs into an error in your application and you want to prefill a message they can submit.
window.Pylon("showNewMessage", "I'm experiencing an issue with syncing from Google Sheets to Email and could use some assistance");
Optionally, this string can also be HTML. For example, for rendering a link. Pass an optional argument indicating the message to be shown is HTML.
NOTE: Only specific HTML tags are supported: <a>
, <b>
, <p>
, and <i>
. If other tags are used, the editor may error.
window.Pylon("showNewMessage", "I'm experiencing an issue with <a href='https://www.app.company.com/sync/123'>syncing</a> from Google Sheets to Email and could use some assistance", { isHtml: true});