cathyatseneca / DSAnim

Plug-in free web based data structure animations built with processing.js
MIT License
38 stars 12 forks source link

Time Based Refactor #16

Closed cathyatseneca closed 10 years ago

cathyatseneca commented 10 years ago

Currently sketches are done with frame based animations. These should be rewritten as time based animations

cathyatseneca commented 10 years ago

The refactor was not simply a time based refactor but also involved changing the way the animations would be created. The original animations were very much a state transitioning mess. Although the objects had many drawing functions, the way to then use them to create animations were messy and a simple piece of code had to be warped into doing the correct state transition at the right time.

The new system involves the following:

Animation - this object describes an animation and all the things that are drawn on the screen. It also tracks a series of animation steps. Drawing the animation involves drawing all the animation objects and applying the animation steps in order. Each animation step has a minimal display time that can be modified.

Animation step - this is one discrete step of animation. It can consist of multiple animation instructions sent to different animation objects. When completed, the ability to pause, step forward and back through an animation will be possible.

Animation Instruction - a specific instruction for a particular object that alters it's internal state. When that particular instruction is completed, the instruction's completion is set.

To create an animation, run through the standard algorithms and indicate the changes in the visual elements as the algorithm runs (such as changing colours, drawing something at a different location etc.)