sumitsarkar / event-layer

A router for events to different analytics destinations

Event Layer for Analytics

This module is heavily inspired from Event Layer. We have made it more configurable by providing more options and extensions on top of it.

Currently supported adapters:

• Segment
• Mixpanel
• Google Analytics
• Google Tag Manager
• Facebook Tracking Pixel
• Heap Analytics
• Intercom
• Amplitude
• Keen.io
• Helpscout
• FullStory
• Olark
• Calq
• Sentry
• Castle
• Rollbar
• Talkus
• Elev.io
• Drift
• Drip
• Lucky Orange
• Bugsnag
• Bugsnag
• Improvely
• Inspectlet
• Qualaroo
• Customerio
• Chameleon

If you require more adapters to be integrated, feel free to raise a pull request or reach us out on our support channel so that we can integrate your favorite tool with this library.

Inspiration

This Javascript package aims to remain a destination agnostic interface for all kinds of custom events generated in the browser when a user interacts with it. It's basically a router of events to different destinations.

Setup

This library is distributed via the ABC Artifactory. Please reach out to [e-mail] to get access to the Artifactory.

1. Install the library using

   npm install @abc/event-layer

2. When added to a page, the library exports EventLayer object to the window object of the DOM. However, it requires initialization for you to be able to use any of the other functions in EventLayer.EventLayer. For more options look at Configuration Options

   const Analytics = EventLayer.EventLayer
   Analytics.initialize({
     'google-analytics': {
        enabled: true
      }
   })

3. Now that the EventLayer is initialized, you can send your custom events to the layer:

   Analytics.page('product', 'Flyers', {
     'category': 'Stationary',
     'my-custom-property': 'My Custom Property Value'
   })

Configuration Options

One can configure each adapter to spew different outputs if they wish to. The interface for the configuration is:

{
  'name-of-adapter': {
    enabled: true | false,
    transformers: {
      identityTransformer: (userId, userProperties) => {
        return {
          userId: 'transformedUserId',
          userProperties: {
            'property1': 'value1'
          }
        }
      }
      eventTransformer: (eventName, eventProperties) => {
        return {
          eventName: 'transformedEventName',
          eventProperties: {
            'property1': 'value1'
          }
        }
      }
    }
  }
}

The following transformers can be added in the adapter configuration: eventTransformer, identityTransformer, pageTransformer, aliasTransformer, groupTransformer and fbTrackTransformer. To find more about the interface please refer to the TypeScript definition: Definitions

Following are the adapter names that you can modify in the configuration:

'amplitude'
'bugsnag'
'calq'
'castle'
'chameleon'
'customerio'
'drift'
'drip'
'elvio'
'facebookTrackingPixel'
'fullstory'
'google-analytics'
'google-tag-manager'
'heap'
'helpscout'
'improvely'
'inspectlet'
'intercom'
'keen'
'luckyorange'
'mixpanel'
'olark'
'qualaroo'
'rollbar'
'segment'
'sentry'
'talkus'