Emberjs and Mixpanel Route visits
This is useful for tracking 'page views' when using emberjs and mixpanel. I guess the same theory will apply to people using KISS metrics too.
First the mixpanel mixin:
//in ember-cli 'mixins/mixpanel.js
//assuming you have mixpanel already imported into your Brocfile
export default Ember.Mixin.create({
beforeModel: function(transition) {
this._super(transition);
return mixpanel.track("visit" , {pageName: transition.targetName});
}
});Then reopen Ember.Route I done it in router.js
import MixpaneMixin from 'app/mixins/mixpanel';
Em.Route.reopen(MixpaneMixin);Done! If you have a route call login for example in mixpanel you will see visit login
Written by charlie
Related protips
3 Responses
Thanks for the post but one thing is that it ended up sending multiple events for nested routes. I ended up using this initializer
export function initialize(container) {
var router = container.lookup('router:main');
router.on('didTransition', function() {
var page = this.get('url');
if (!page) {
var loc = window.location;
page = loc.hash ? loc.hash.substring(1) : loc.pathname + loc.search;
}
mixpanel.track("visit", {pageName: page});});
}
export default {
name: 'mixpanel',
initialize: initialize
};
How do you make code look good on coderwall? :/
yea is 4 indent.. good point re that problem in mp i wrote a ember-cli addon should fixed that very similar to yours just not as a initalizer.
Have a fresh tip? Share with Coderwall community!
JavaScript on a page runs with the privileges of that origin. One altered library, tag manager, or snippet can read inputs, change what people see, and call your APIs as the user.
Security insights from Cside