@dpgradio/creative 7.0.6 → 7.1.0

package/README.md

@@ -152,6 +152,18 @@ dataLayer.pushVirtualPageView(brand) // brand is not required when the config is
 dataLayer.pushEvent(event, data)
 ```
 
+With Mixpanel
+```js
+import { mixpanel } from '@dpgradio/creative'
+import Mixpanel from 'mixpanel-browser'
+
+mixpanel.initialize(Mixpanel, {
+    mixpanelId: 'MIXPANEL ID',
+})
+
+mixpanel.trackEvent(event, data)
+```
+
 ## API
 
 With an initialized [configuration](#config):

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dpgradio/creative",
-  "version": "7.0.6",
+  "version": "7.1.0",
   "description": "Support package for standalone Javascript applications",
   "main": "src/index.js",
   "scripts": {

package/src/analytics/mixpanel.js

@@ -0,0 +1,37 @@
+import privacy from '../privacy/privacy.js'
+
+class Mixpanel {
+  constructor() {
+    this.trackingEvents = false
+    this.trackBacklog = []
+    this.mixpanel = null
+  }
+
+  initialize(Mixpanel, { mixpanelId, trackPageview = true }) {
+    this.mixpanel = Mixpanel
+    privacy.push('analytics', () => {
+      this.mixpanel.init(mixpanelId, {
+        track_pageview: trackPageview,
+        persistence: 'localStorage',
+        api_host: 'https://api-eu.mixpanel.com',
+      })
+
+      while (this.trackBacklog.length > 0) {
+        const { eventName, properties } = this.trackBacklog.shift()
+        this.mixpanel.track(eventName, properties)
+      }
+
+      this.trackingEvents = true
+    })
+  }
+
+  pushEvent(eventName, properties) {
+    if (this.trackingEvents) {
+      this.mixpanel.track(eventName, properties)
+    } else {
+      this.trackBacklog.push({ eventName, properties })
+    }
+  }
+}
+
+export default new Mixpanel()

package/src/index.js

@@ -1,8 +1,13 @@
 export { default as hybrid } from './app/hybrid.js'
 
+// Privacy
 export { default as privacy } from './privacy/privacy.js'
-export { default as dataLayer } from './privacy/dataLayer.js'
 
+// Analytics
+export { default as dataLayer } from './analytics/dataLayer.js'
+export { default as mixpanel } from './analytics/mixpanel.js'
+
+// Websocket
 export { default as socket } from './socket/socket.js'
 
 export { default as configuration, config } from './config/config.js'
@@ -11,6 +16,7 @@ export { default as api } from './api/api.js'
 
 export { default as authentication } from './app/authentication.js'
 
+// Utils
 export { default as loadScript } from './utils/loadScript.js'
 export { default as openLink } from './utils/openLink.js'
 export { default as openExternalUrl } from './utils/openExternalUrl.js'