Using Event Listeners

For this guide, we will be sending analytic events to Google Analytics. The same steps can be used to do any other desired tasks. It is expected that your site is already configured to use Lead Capture AI via the Lead Capture SDK prior to following this guide.

Lead Capture AI sends events to Lead Capture SDK which can be used to understand how a user is interacting with Lead Capture AI.

The list of currently available events can be found on the JavaScript Functions page.

Setup

Insert the following code snippet into your page before the Lead Capture SDK <script> tag.

<script>
  window.AuroraLeadCaptureAsyncInit = () => {
    // Event listener code will be added here
  };
</script>

Listeners to events must be configured within the AuroraLeadCaptureAsyncInit method. To configure a listener use the AuroraLeadCapture.addEventListener method. This method takes an event and a callback.

• event
  • This is the name of the event from the list on the JavaScript Functions page
• callback
  • This is a function which will be called when the specified event occurs

<script>
  window.AuroraLeadCaptureAsyncInit = () => {
    const callback = (data) => {
      // This code will fire when the event is received
      // data will consist of the object that is sent with the event
    };

    AuroraLeadCapture.addEventListener(event, callback);
  };
</script>

Examples

In these examples, Google Analytics must be installed on the host page, where LCAI is embedded, and configured to receive events. The callback function in this example is referencing the gtag JavaScript function provided by Google, not Aurora.

1. Sending a Google analytic event when a lead is submitted in LCAI. This will use the contact event as one contact event is equivalent to one lead.

   Note: contact_received should be replaced with the name of the event you wish to send.

   <script>
     window.AuroraLeadCaptureAsyncInit = () => {
       const contactCallback = (contact) => {
         gtag('event', 'contact_received');
       };
   
       AuroraLeadCapture.addEventListener('contact', contactCallback);
     };
   </script>

2. Sending a Google analytic event when solar model data is returned in LCAI. This will use the results event.

   Note: results_displayed should be replaced with the name of the event you wish to send.

   <script>
     window.AuroraLeadCaptureAsyncInit = () => {
       const resultsCallback = (results) => {
         gtag('event', 'results_displayed');
       };
   
       AuroraLeadCapture.addEventListener('results', resultsCallback);
     };
   </script>