From Bright Pattern Documentation
Jump to: navigation, search
• 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 >