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.