• 5.2

Events

Events allow the webpage that contains a chat widget to process corresponding events or propagate them to third-party systems. Events show that something has happened on the page with a chat widget.

For example, the chat widget fires events when:

• A user opens a pre-chat form
• A user closes a pre-chat form
• A user starts a chat
• A proactive offer appears on the screen
• A user closes a proactive offer
• and more (see full list of event handlers below)

All Event Handlers

Bright Pattern provides event handlers in the form of a JavaScript object that can be included along with the chat widget HTML snippet. The event handlers supplement the existing chat application.

Name	Description
weAreOnline	Chat is available
weAreOffline	Chat is not available
windowCloseIconClicked	User closes chat widget without launching a chat (clicks "X")
preChatWindowPhoneButtonClicked	User clicks "Call" button on pre-chat form window
preChatWindowChatButtonClicked	User clicks "Chat" button on pre-chat form window
preChatWindowCancelButtonClicked	User clicks "Cancel" button on pre-chat form window
reactiveChatButtonClicked	User launches the chat by clicking the "Chat" button
proactiveYes	User clicks "Yes – Help" on proactive chat offer
proactiveNo	User clicks "No – Cancel" on proactive chat offer
proactiveChatOffered	Proactive chat is offered

Example JavaScript Object

var callbacks = {
		weAreOnline: function() {console.log('weAreOnline')},
		weAreOffline: function() {console.log('weAreOffline')},
		windowCloseIconClicked: function() {console.log('windowCloseIconClicked')},
		preChatWindowPhoneButtonClicked: function() {console.log('preChatWindowPhoneButtonClicked')},
		preChatWindowChatButtonClicked: function() {console.log('preChatWindowChatButtonClicked')},
		preChatWindowCancelButtonClicked: function() {console.log('preChatWindowCancelButtonClicked')},
		reactiveChatButtonClicked: function() {console.log('reactiveChatButtonClicked')},
		proactiveYes: function() {console.log('proactiveYes')},
		proactiveNo: function() {console.log('proactiveNo')},
		proactiveChatOffered: function() {console.log('proactiveChatOffered')},

};

< Previous | Next >