I have seen two different ways to do animations, one using the playhead:
number(`a`): this.animationTime animationDuration: 5
I was using this method and able to pass the animation duration from the graph and use the animation time, but I was attempting to also make a reset button and could not find a way to move the playhead back to 0 without clicking play. By manipulating animation duration, I made a button to make the playhead disappear (which is necessary to make a draggable point in my diagram usable again), but when the playhead reappears, it is still at the final time. I cannot seem to reset the playhead to 0.
this.animationTime seems to be stuck in memory.
The alternative to using the playhead is doing something like this sketch using button properties:
This example is a couple of years old and possibly predates the availability of animationTime and animationDuration. This almost worked for my purposes, except that I was unable to control the end time of the animation. The value gets set using “timeSincePress” which defaults to a max of 10 seconds and won’t let you pass a number from the graph (gives error, “parameters to sinks and sources must be constant”). I have a calculated maximum that I need for my graph, so this wasn’t workable.
number("t"):when graph1.number("P")=1 act1.timeSincePress otherwise 0
I would be open to any other workarounds that do the following:
- Animate when button is pressed (or open up playhead) with duration being passed from the graph
- Reset animation and playhead upon button press (could be different button) and remove playhead so diagram can be manipulated again before the student restarts the animation.