Listening to all transition events


#1

I’ve been looking for a way to catch all transition events, and haven’t found anything so far. I was hoping there was some sort of infrastructure already in place that made it fairly easy to respond to all client side transitions in an app. There’s a couple of use cases this would allow. I’d be happy to find alternative solutions to those instead:

  • Usage patterns: Help to understand user journeys through an app, by uploading the navigation events, time spent between each one etc. Is there already an analytics package for ember that allows this sort of thing?

  • Websocket sources: If we’re plumbing in websockets to help with background data loading, I’d like to stop sending certain data streams based on the user’s current location in the app, which components etc are active. I guess this could be the responsibility of each component (to send their own stop message etc), but it feels to me like it would be easier to manage from a single location.

A simple implementation might be just to add an API method that gets all each transition event posted to it. Any suggestions?


#2

That’s private API, so expect the code to break when you upgrade your ember version. The routing subsystem is accessible as a service. Here is what I do to update my breadcrumbs as the user navigates:

// In a component
_routing: Ember.inject.service('-routing'),

handlerInfos: function () {
    return get(this, '_routing.currentState.routerJsState.handlerInfos');
}.property('_routing.currentState'),

updateBreadcrumbs: function () {
    const infos = get(this, 'handlerInfos);
    infos.forEach(function (item) {
        const route = item.handler;
        // do things here. Each entry describes an active route.
    }, this);
}.observes('handlerInfos')