a timeline task?

[Andrei Thomaz]

hello list,

In my effort to build a gugga-powered version of dr promo site, I am
starting to code the simplest secitons, as classes derived from
gugga.application.Section. The most simple section uses an animation in
its own timeline to make the opening/closing animation. So, to build
the opening sequence, I need a task that does the following:

1) goes to a specified frame and plays;
2) when the animation stops (I used a stop() action in timeline to stop
it), it fires the 'completed' event.

Is there a Task that I can uses for that? Or, if not, how could I build
a Task class that plays an animation (in timeline) and fires the
'completed' event when the animation is stopped? I couldn't think about
anything better than the following:

- a Task class that has a member called m_mcTarget and another called
m_nStartFrame
- when the Task is activated, it executes
m_mcTarget.gotoAndPlay(m_nStartFrame);
- to detect when the animation stops, the Task could use some kind of
onEnterFrame function (where I compare the value of currentframe with
the previous value of currentframe), but I would like there was some
better way to do this.

what do you think about that? There are other sections that use
scrippted animations, but I think it would be nice if gugga had some
kind of 'timeline task' ;-)

bye,
andrei

[Todor Kolev]

Hello Andrei,

Your suggestion sounds interesting. We'll try to add it in GuggaFF for the next release. It is actually aditional functionality to the gugga.animations.TimeLineAnimation . It is a task which represents one MovieClip animation. When the task is started, the MovieClip.play() is invoked, and when the last frame is reached - "completed" is dispatched.

This task works for us in all the projects we had. I think you can use it for the DR site. You can make your open and close animations to overlap the sections content. The last frame of the open animation and the first frame of the close animation will almost match the section's content (probably without texts if they are dynamic). Thus you can have clearly separated abstractions in your application, where the animation is animation and the section is section, whithout mixing them in a single MovieClip.

Todor

[Andrei Thomaz]

hello Todor,

please, look if the code below makes sense:

// SegmentedTimeLineAnimation
// What is the difference in relation to TimeLineAnimeation:
//
// - we needed a task that played only a fraction of a timeline;
// - TimeLineAnimation actually has cuePoints, but it cann't stop in a
cuePoint
// - we just added the possibility of setting a startingPoint and an
finalPoint to the task.
//
// and...@cappuccinohzta.com.br / andrei...@gmail.com
// 2006
//

import gugga.animations.IAnimation;
import gugga.collections.ArrayList;
import gugga.animations.TimeLineAnimation;

class SegmentedTimeLineAnimation extends
gugga.animations.TimeLineAnimation
{
private var mStartPoint:Number; // a frame number
private var mFinalPoint:Number;

function SegmentedTimeLineAnimation()
{
super();

mStartPoint = 0;
mFinalPoint = 0;
}

function setStartPoint( nStartPoint:Number ):Void
{
if (nStartPoint > 0)
mStartPoint = nStartPoint;
}

function setFinalPoint( nFinalPoint:Number ):Void
{
if (nFinalPoint > 0)
mFinalPoint = nFinalPoint;
}

function setStartFinalPoint( nStartPoint:Number, nFinalPoint:Number
):Void
{
setStartPoint(nStartPoint);
setFinalPoint(nFinalPoint);
}

// functions of TimeLineAnimation that we override
// - start
// - onEnterFrameHandler

public function start():Void
{
if (!mIsRunning)
{
mIsRunning = true;

dispatchEvent({type:"start", target:this});

if (mStartPoint > 0)
gotoAndStop(mStartPoint);
else
gotoAndStop(1);

show();
this.play();
}
}

public function onEnterFrameHandler()
{
if (!mIsRunning)
{
this.onEnterFrame = null;
return;
}

// final point
if (this._currentframe == mFinalPoint) {
onAnimationCompleted();
}

for(var i:Number = mCuePoints.length - 1; i >= 0; i--)
{
if(this._currentframe >= mCuePoints[i].position)
{
dispatchEvent({type:mCuePoints[i].event, target:this});
break;
}
}

if (!this.mDoLoop)
{
if(this._currentframe == this._totalframes)
{
onAnimationCompleted();
}
}
}
}

[Todor Kolev]

Hi Andrei,

Sorry for the late answer - busy week. The code you posted looks fine. Let me give you my thoughts about implementing the partial/segmented animation.

We want to have an animation that will be visualized as a MovieClip and we want to play it from one frame to another. Lets take a step back and take a look of what we have now. We can make different animations - time line (MovieClip) or properties tween and we can determine cue points in them.

It comes naturally that we can play these animations from one cue point to another. Now the problem is how to implement it. If we make subclasses extending our two animations, then we'll have duplicated functionality which we can not reuse. So we have two design patterns to solve this problem - Decorator and Bridge. The Bridge will just solve our reuse problem without giving us any freedom, that is why we'll chose the Decorator pattern. This means that we will create a class which will wrap an animation without caring about its exact type and will play a portion of it. This solution will give you also the advantage that you can make two different wrappers for one animation. It will be ideal for your case with open and close animation in a single MovieClip.

Lats sum it all together. We'll have a class called PartialAnimation which will implement gugga.animations.IAnimation and will have a constructor like: PartialAnimation(aAnimation:IAnimation, aStartingPoint:String, aEndPoint:String).

If you decide to implement such a class you should think for some more things:
    1. You should add a method to each animation to start it from a certain cue point - startFromQuePoint(aPoint:String) I suggest.
    2. What if the animation supplied in the PartialAnimation's constructor is still running.
    3. What if the animation is started from someone else and is playing when you attempt to start it from a certain point when the PartialAnimation starts.

One little note about your code - do not make IF or FOR statements without bracketed body. This will bring you problems when extending the code.

Todor

[Andrei Thomaz]

Hello Todor,

I studied the code of TimeLineAnimation, to implement the
PartialAnimation class, and I am with a doubt: how do you set the scope
of the animation, in the case of it being used as a task? Because:

a) I could associate the movie clip, whose timeline I want to control
with PartialAnimation class, with a class derived from
PartialAnimation. Problem: how to make this class also derived of
Section class ?
b) Or pass the object's scope to the instance of PartialAnimation that
will be the section opening's task (as it is done in ExecuteMethodTask,
for example).

I am in doubt because I don't understand why the PartialAnimation would
receive a IAnimation-derived object in the constructor. For what I
could understand, it should receive the object to be animated (as in
ExecuteMethodTask).

thanks for your time,
andrei