lundi 8 juin 2015

Direction-aware transition with Ember Liquid Fire's {{liquid-with}} helper

In my Ember app, I would like to make nice Liquid Fire transitions within the same route when the model of a dynamic route changes. Here's my router:

// app/router.js

Router.map(function() {
    this.route("campaigns", { path: "/" }, function() {
        this.route("campaign", { path: "/campaign/:election_year" });
    });
});

I would like the view to leave the screen to the left when switching to an election_year that is in the future (e.g., from campaign/2008 to campaign/2012) and to the right the other way around.

My first thought was to use use the {{liquid-outlet}} and the toModel hook in the app/transitions.js file, but Edward Faulkner (creator of Liquid Fire) says in this thread that

liquid-outlet does not handle model-to-model transitions on the same route

and that I should use {{liquid-with}} instead. However I'm at a loss as to how handle the directionality, i.e. make the view go left when election_year increases, and go right when it decreases. Any clues?




Aucun commentaire:

Enregistrer un commentaire