taccgl Transitions
A taccgl™ animation is composed of one or more transitions. A
javaScript program first calls taccgl™ multiple times to create and
parameterize each of the transitions. Then it
calls taccgl.start to play them. Playing takes place
in an asynchronous way, i.e. after starting, the animation runs in
quasi parallel, while the calling program can do other tasks or
terminate. (Note that taccgl™ initiates a javascript event handler,
which is called regularly to proceed with the animation. )
The
user program can anytime, even while the animation is playing, modify
or extend the animation.
A transition shows or animates graphical objects of various shapes,
for example a single triangle, an HTML element painted on a
rectangle, a distorted or morphed HTML element, a box, or an
imported external 3D object created with a 3D drawing program.
Typically a transition moves, rotates, resizes, clips, or fades the
graphical object or possibly performs several of these actions
simultaneously. For performing multiple motions sequentially, like
moving an element from one place to another one needs multiple
transitions. As an important special case a transition might
not perform any motion or action, in this case it just shows the
graphical object for a specified period of time.
taccgl™ transitions are designed to be fully executable by
shader programs in the GPU. On taccgl.start
all transitions are downloaded into the GPU. Then taccgl™
uses a single1
GPU-draw command per frame to make the GPU perform all transitions at once.
Therefore taccgl™ consumes very little javaScript performance
while playing animations and leaves much room for the user program.
A transition is repesented by a javaScript object of
class Transition Class or a subclass thereof.
There are subclasses for various basic shapes, see Shapes.
A transition object is first created (using e.g. the a,
actor, or cont methods) whereby the basic
shape of the graphical object must be selected.
After object creation a multitude
of parameters can be set by calling methods.
Finally transition.start must be called to start
the newly created transition.
For each transition, the following items can be set
- various parameters of the Shape,
- the Time and Duration of the Transion
- the Motion performed during the transition
- the Textures and possible animations
WebGL™ is a trademark of the Khronos Group Inc. [1] If user shaders are used more draw commands are needed.
|