Closed kunjee17 closed 8 years ago
I'll think about how to do that. In principle, what a URL change generates (in this scheme) is a list of actions, so you could theoretically make those actions perform an animation ... but perhaps there is something the library can do to make that easier.
@rgrempel thanks :). Will looking forward to it. For me (while building SPA) first blocker was good url library and your library just blast that blocker. I'm back to elm. :+1:
fyi - I have seen some work by @etaque on this . I think he's also going to consolidate his router solution with the transition module.
yes, the hard work is being done by elm-transit (my router is already doing transitions, but it doesn't work with hashes yet).
@etaque and @rgrempel is it possible that we can mix match both libraries. May be end up with one or two mature routing library. Like React-Router for react.
I thought about this a bit more, and I'm pretty sure that it is just a question of getting your location2action
(or, now, location2messages
) function to return some actions (or messages) that will kick off an animation.
To illustrate, I've updated one of the examples to do that ... when you click on the squares to spin them, you can then use the back / forward buttons, and the URL transition will now be animated (just like the original spin was). Here are the changes:
https://github.com/rgrempel/elm-route-url/commit/1618b1685e8981f3d48ddf8ae92f0657beca1287
But, this isn't really anything that elm-route-url can facilitate, since it has no idea what it means to animate your particular state change -- you just have to return messages that actually trigger an animation, whatever that means in your context.
@rgrempel - I think an interesting challenge occurs when one wants to implement a transition where e.g. one page slides out of view and a new page slides in, side-by-side. That means both pages are momentarily visible together at the same time, which means they both have to be rendered, which means they both must be in the model (I guess?), which isn't really desirable. Do you know of an elegant solution? (I understand this is quite out of scope for this issue but still relevant).
I suppose the Elm-ish solution, as usual, is essentially to model the problem.
So, suppose you have a Page
which represents one of several virtual pages, and you've got an update
and view
function that works with that Model
-- so, the normal thing, you might say.
Now, if you want to animate a transition to the next Page
, I suppose you'll have to add something like a Maybe AnimationState
to the Page
. And, the AnimationState
would be composed of something like a Page
-- that is, the next page -- and something that tracks the animation progress. And your update
method would need a modification to kick off the animation (and progress it). And your view
method would need to consult the AnimationState
to know whether to draw just one Page
or perhaps two side-by-side (at some stage of the animation, as tracked within the AnimationState
).
Or something like that ... that's all a little vague, of course, but I think that would basically be the idea.
Now, you could imagine a generic AnimationState model
type, where, provided with the update
, view
et. al. functions for the model
type, it would wrap them in some way to provide update
and view
functions that generically handle drawing the various stages of an animation. That seems possible to me, without thinking it through very hard -- there may well be some pitfalls that don't occur to me.
Hi,
First of all this is the one full fledge routing library I found. Having all the thing. Thanks for great work. Only part I feel is it will be great if there is a way to inject animation for transitioning from page to page.
It is just a case of beautification but a good to have to compete other part like react and angular.
Thanks for great work. :)