# Events

Use to further customize your chat.

⛔ Legacy API

You are browsing legacy API. Current version you can find here.

# Message: Sent

Fires when a message is sent.

<script>
smartsupp('on', 'message_sent', function(message) {
  console.log('sent message:', message);
});
</script>

# Message: Received

Fires when a message is received.

<script>
smartsupp('on', 'message_received', function(message) {
  console.log('received message:', message);
});
</script>

# Agent: Join

Fires when agent joins a chat or when page is loaded and agent is already in chat. Can be used to modify agent properties like name or description based on your conditions (e.g: language, name).

<script>
  // change agent name and note for all agents
  smartsupp('on', 'agent.join', function(model, agent) {
    agent.nickname = 'Custom name';
    agent.note = 'Custom description';
  });

  // change agent name and note for specified agent
  smartsupp('on', 'agent.join', function(model, agent) {
    if (agent.nickname.indexOf('John Doe') >= 0 /* || agent.id = 123 */) {
      agent.nickname = 'Custom name';
    agent.note = 'Custom description';
  }
  });

  // change agent name and note for by language
  smartsupp('on', 'agent.join', function(model, agent) {
    if (model.get('lang') == 'fr') { // model.get('lang') returns current chat language
      agent.nickname = 'Nom personnalisée';
      agent.note = 'Description personnalisée';
    } else {
      agent.nickname = 'Custom name';
      agent.note = 'Custom description';
    }
  });
</script>

# Agent: Leave

Fires when agent leaves the chat.

<script>
  smartsupp('on', 'agent.leave', function(model, agent) {
    console.log("Agent leave from chat:", agent);
  });
</script>

# event

Fires when chat event occurs. Data are same as data sent to Google Analytics.

<script>
  var keenClient = new Keen({ ... });
  smartsupp('on', 'event', function(category, action, label) {
  // send event data to other service e.g.: keen.io (https://keen.io)
      keenClient.addEvent('smartsupp_event', {
      category: category,
      action: action,
      label: label
    });
  });
</script>

Fires when visitor logs in.

<script>
  smartsupp('on', 'login', function(values) {
    console.log('login values: ', values);
  });
</script>

# message

Fires when visitor, agent or trigger sends a message into the chat. Fires for all messages in chat.

<script>
  smartsupp('on', 'message', function(model, message) {
    if (message.type == 'visitor') {
      console.log('visitor message:', message.content);
    } else if (message.type == 'agent') {
      if (message.triggeredBy) {
        console.log('triggered message:', message.content, '; trigger:'+message.triggeredBy);
      } else {
        console.log('agent message:', message.content);
      }
    }
  });
</script>

# render

Fires before chat is rendered.

<script>
  smartsupp('on', 'render', function() { console.log('render'); });
</script>

# rendered

Fires after chat is rendered.

<script>
  smartsupp('on', 'rendered', function() { console.log('rendered'); });
</script>

# sent

Fires when user sends a message.

<script>
  smartsupp('on', 'sent', function(message) { console.log('sent message:', message); });
</script>

# status

Fires when online status of Smartsupp account is changed and when chat (page) is loaded.

<script>
  // Change color by status
  smartsupp('on', 'status', function(status) {
    if(status == 'online') {
      smartsupp('theme:colors', {
        widget: '#2ecc71',
        primary: '#2ecc71'
      });
    } else {
      smartsupp('theme:colors', {
        widget: '#c0392b',
        primary: '#c0392b'
      });
    }
  });
</script>

# startup

Fires when chat is loaded.

<script>
  smartsupp('on', 'startup', function() { console.log('startup'); });
</script>

← Visitor groups Visitor status →