New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Question] Pattern for executing javascript during an animation #20

mattkrick opened this Issue Feb 14, 2015 · 2 comments


None yet
2 participants
Copy link

mattkrick commented Feb 14, 2015

During an animation, I'd like to execute some javascript.
If the JS is adjusting attributes, my current pattern is to create a 1ms animation and put it in the sequence. Not pretty, but simple enough.

Alternatively, if I need create/delete an element, I wait until the end:
player.onfinish (I assume this will change to player.finished.then in a future version?)

However, if I need to move something, create a new element, and then move the new element, I think I have to create 2 players and call the 2nd player after the first one finishes, and then the 3rd when the 2nd finishes... this has the potential to get nasty. Is there a better way?

In an ideal world, AnimationSequence would accept an array of Animation as well as functions, but I understand this could get tricky if folks start playing with async functions.


This comment has been minimized.

Copy link

mattkrick commented Feb 14, 2015

Ah I think I found it, I would just embed the function inside an animation with an arbitrary duration?

      new Animation(elem, function () {
      }, {
        duration: 500

This comment has been minimized.

Copy link

shans commented Feb 17, 2015

Right, although it's probably better to do something like:

new Animation(elem, function(tf) {
if (tf == null) return; console.log('here');
}, { duration: 0, fill: 'forwards' });

to guarantee that there's only a single invocation of the log, and to prevent the animation from taking up space in a sequence.

Note that we're thinking of changing this somewhat - one suggestion is that functions will be able to be registered on any animation via an onsample registration point.


@shans shans closed this Apr 30, 2015

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment