Fork me on GitHub
#om
<
2015-09-02
>
teamaverage05:09:59

What techniques are there for incorporating animation into an Om app? At the moment I'm using the 3rd party "Velocity" lib and sending messages via channels but this feels too contrived

teamaverage05:09:48

I can utilise the stock life cycle events to get something to show via did-mount. But when it came to animating the disappearance of something I thought I could just use will-unmount, however it seems the DOM element is unloaded before my animation kicks in

meow12:09:35

@teamaverage: I'm not sure if this would help or not, and I'm not 100% sold on the approach myself, but here it is: https://github.com/omcljs/om-cookbook/tree/master/recipes/animator

meow12:09:46

@teamaverage: also this semi-related issue with CSS animations and core.async: http://dev.clojure.org/jira/browse/ASYNC-131

meow12:09:42

@teamaverage: would love to know what you come up with by way of a solution. How do you like Velocity?

teamaverage22:09:34

Thanks for the link @meow I'll check it out : )

teamaverage22:09:55

@meow: After thinking about it a little more, I can clarify by saying I know of a few ways to achieve animation but I'd like the most idiomatic way; one that doesn't go against the grain of React/Om

teamaverage22:09:07

The simple thing I'm aiming to get working is a button-toggle dropdown where the button is a component (i.e. with its own life cycle methods) and so is the drop-down but both live in the same namespace

teamaverage22:09:08

The latest technique is I'm just passing a map of state through to om/build when I'm constructing the drop-down. I've a function which converts this state {:show-results true/false} to a velocity call.