EaselJS: The Tick Event

(Click the image to see a larger version.)

You can attach 'tick' event handlers to individual shapes, but there has to be a master tick event, of sorts, that tells them all when to go. It can also pass them information about the tick event, in this example I have used the delta event.

1) After adding the circle to the stage, I have not updated the stage, because that will get done by the tick event.
2) Having set the frames per second to 40, this means that there are 25ms between each tick.
3) This is what I am referring to as the master tick event. Without it, none of the others will occur.
4) This is function that the tick event initially calls.You'll note that I have made the event (and therefore its properties) available to the function.
5) 'delta' is a property of the tick event - it tells you how many milliseconds have passed since the last tick. Since the frame rate is meant to be 40 per second, it should be approximately 25ms.
6) The update has to be called here, if you try to call it in the other ticks, everything won't work. Also, the stage.update can be used to pass info to other tick events.
7) Now you can add a tick event to other objects, that will be called by stage.update.
8) This contains the info sent by stage.update
9) This is how you access that info.