Delay Between Tweens, Using AS3 scripting only Options

[azpaul]

Hello,

I almost have my movie clip the way I want it to be. I have a little more animation and a little more coding to do but it is almost there. I can definitely see the light.

I see the problem but I am not sure how to overcome it.

All the code runs before any tween effects and timers complete so all my effects launch at the same time.


I have data that is read in from XML. This data is parsed and then sent through a switch and case for appropriate action.

When the case is true, I have a simple visible statement to show a symbol and then run a tween that pops the symbol out at you on the z axis. I got help using TweenMax. Sweet add on for flash!

The problem I am having is that I can not seem to be able to delay the actions from one case to another case in my list. My timer runs in the background while the code keeps on running.

How do I have the code pause before the next case statement is enacted?

I don't want to pause the whole movie, just the statement. All of the animation on all the cases run at the same time, I need them to pause about 10 seconds.

Does this s make sense?

Here is my code so far.

Thanks!

CODE

import flash.utils.Timer;
import flash.events.TimerEvent;
import com.greensock.TweenMax;
import com.greensock.easing.*;

var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = new XML();
var fields:Array;

xmlLoader.addEventListener(Event.COMPLETE, LoadXML);

//A bit of error handling in case the XML goes missing
xmlLoader.addEventListener(IOErrorEvent.IO_ERROR, xmlError);

xmlLoader.load(new URLRequest("data.xml"));

//numbers = new Array(num1, num2);
fields = new Array("one", "two");

function xmlError(e:IOErrorEvent):void {
            //Just letting the user know something's screwed            
}


function LoadXML(e:Event):void {

xmlData = new XML(e.target.data);
ParseContent(xmlData);

}

function ParseContent(contentInput:XML):void {
    
    trace("XML Contents");
    trace("------------------------");

    var numberList:XMLList = contentInput.numberdraw;
    //var gameNumber:XMLList = contentInpute.gamenumber;

    //trace ('length is ' + numberList.length());
    trace('Game Number is ' + contentInput.gamenumber);
    gnumber.text= contentInput.gamenumber;
    
     for (var i:int = 0; i < numberList.length(); i++){
        //trace ("I is " + i);
        //trace ("List Length is " + numberList.length());
        
        myTimer.start();
        
        var numberDraw:XML = numberList[i];
        trace("Number Draw " + numberDraw);
        
            
            switch (int(numberDraw)) {
            case 1:
            trace("Case 1 success");
            break;
            
            case 2:
            trace ("Case 2 success");
            background1.visible = true;
            num2Stroke.visible= true;
            num2Stroke.z = 0;
            TweenMax.to(num2Stroke, 1, {z: -200, yoyo: 3, repeat: 1, repeatDelay: 1});
            num2.visible = false;
            break;
    
                   case 58:
            trace ('Case 58 success');
            background58.visible = true;
            num58Stroke.visible= true;
            num58Stroke.z = 0;
            TweenMax.to(num58Stroke, 1, {z: -200, yoyo: 3, repeat: 1, repeatDelay: 0});
            num58.visible = false;
            break;
            
        }

    }
}

[milchreis]

think of this differently!

actionscript is not a procedural language.
there's a big (and nice) Event system, helping you (which you already use)

Rather than thinking about "how to put a delay between two lines of code" try to ask yourself "_when_ should this or that or whatever happen".
You did make the first great step when choosing the Timer class, great.

You say you have your timer running in the background. Errr - no, you don't.
Is this all of your code? If so, you miss something important:

- you never create your Timer object. All I see is "myTimer.start();" which shold throw an error as you never define what "myTimer" is.
- you never add an Eventlistener to your timer so you can react when it's done counting.

Again, the basic idea how this works:

- create a new timer
- add a listener to it, so you know when it's done
- whenever you want to "pause", start the timer and do nothing after that -> nothing happens, except that the timer counts
- when the timer is done, he throws the event, which you can react on in your event handler method, where you should place all the code that should be executed after the pause.

[azpaul]

think of this differently!

actionscript is not a procedural language.
there's a big (and nice) Event system, helping you (which you already use)

Rather than thinking about "how to put a delay between two lines of code" try to ask yourself "_when_ should this or that or whatever happen".
You did make the first great step when choosing the Timer class, great.

You say you have your timer running in the background. Errr - no, you don't.
Is this all of your code? If so, you miss something important:

- you never create your Timer object. All I see is "myTimer.start();" which shold throw an error as you never define what "myTimer" is.
- you never add an Eventlistener to your timer so you can react when it's done counting.

Again, the basic idea how this works:

- create a new timer
- add a listener to it, so you know when it's done
- whenever you want to "pause", start the timer and do nothing after that -> nothing happens, except that the timer counts
- when the timer is done, he throws the event, which you can react on in your event handler method, where you should place all the code that should be executed after the pause.

Thanks for the reply. I have jumped some major hurdles in the last five days. I did have the timer running, it was not shown in this code because it was included from timer.as. Here is the code for the timer.

CODE

function getTime() : void {
    
/*    if (firstInstance == 0) {
        //trace( "First instance is yes?  " + firstInstance);
        firstInstance++
        
        
    } else {        
        trace ("First instance is no?  " + firstInstance);    
        firstInstance++
        timeClock.visible = true;
        Ball.visible = false;
        
    }*/

var endTime:int = getTimer();
endTime += 1*3*1000;  //adjust endTime to 15 minutes in the future.

var countdownTimer:Timer = new Timer(1000);
countdownTimer.addEventListener(TimerEvent.TIMER, updateTime);
countdownTimer.start();

function updateTime(e:TimerEvent):void
{
  var timeLeft:Number = endTime - getTimer();
  var seconds:Number = Math.floor(timeLeft / 1000);
  var minutes:Number = Math.floor(seconds / 60);

  seconds %= 60;
  minutes %= 60;

  var sec:String = seconds.toString();
  var min:String = minutes.toString();
  if (sec.length < 2) {
    sec = "0" + sec;
  }

  if (min.length < 2) {
    min = "0" + min;
  }


  var time:String = min + ":" + sec;
  timeClock.text = time;
  trace (sec);
  
  if (min =="00" && sec == "00" ) {
    countdownTimer.stop();
    //gameStatus.text  = "CLOSED";
    closedStatus.visible = true;
    openStatus.visible = false;
    
    //TweenMax.to(this.[gameStatus.textmc, 2, {x:400, y:300, motionBlur:{strength:1.5, fastMode:true, padding:15}});
    //getData();
    timeClock.visible = false;
        Ball.visible = true;
    //activateTween();
    timeline.play();
    nextGame.visible = false;
    
    } else {
        timeline.pause();
        Ball.visible = false;
function getTime() : void {
    
/*    if (firstInstance == 0) {
        //trace( "First instance is yes?  " + firstInstance);
        firstInstance++
        
        
    } else {        
        trace ("First instance is no?  " + firstInstance);    
        firstInstance++
        timeClock.visible = true;
        Ball.visible = false;
        
    }*/

var endTime:int = getTimer();
endTime += 1*3*1000;  //adjust endTime to 15 minutes in the future.

var countdownTimer:Timer = new Timer(1000);
countdownTimer.addEventListener(TimerEvent.TIMER, updateTime);
countdownTimer.start();

function updateTime(e:TimerEvent):void
{
  var timeLeft:Number = endTime - getTimer();
  var seconds:Number = Math.floor(timeLeft / 1000);
  var minutes:Number = Math.floor(seconds / 60);

  seconds %= 60;
  minutes %= 60;

  var sec:String = seconds.toString();
  var min:String = minutes.toString();
  if (sec.length < 2) {
    sec = "0" + sec;
  }

  if (min.length < 2) {
    min = "0" + min;
  }


  var time:String = min + ":" + sec;
  timeClock.text = time;
  trace (sec);
  
  if (min =="00" && sec == "00" ) {
    countdownTimer.stop();    
    closedStatus.visible = true;
    openStatus.visible = false;
    timeClock.visible = false;    
    //activateTween();
    timeline.play();
    nextGame.visible = false;
    
    } else {
        timeline.pause();
        
    }
}
}
    }
}
}

So where am I right now?

I bailed on the case and switch idea and was able to make the tweens somewhat dynamic. I put the tweens in the function that get and load the xml data. This was the only place I could access the symbols dynamically from the data. When I tried it outside of the function, I kept getting errors no matter how I tried accessing the symbol properties, like visible.

I was directed to tweenMax and timelineMax by another forum. This was easy to implement and pretty painless to use.

You mentioned event listeners. I know what they are used for but I am having a hard time understanding how to use them and write them. All the examples that I have found seem to focus on mouse events. This project uses no mice, no interaction with a user and is a display only movie that will run infinitely in a loop.

I currently have a function in a .as file that gets called first and hides symbols that are called later from the stage. That function then calls the timer function which is displayed on the stage and counts down from a predetermined time. This will eventually be about 5 minutes. When the timer reaches 00:00 then I call my last and final function that loads the xml data and then tweens a number of symbols based based on the values. It works perfectly for the 1st round.

That's where I stuck now. I can not seem to figure out how to make the movie replay calling the hide function, then reset call the timer and reload the xml file. The xml file data changes every 5 minutes so each round will have new data which will tween a different symbol set.

GreenSock has been a tremendous help and replies quickly to forum posts. He recommended using gotoAndPlay(1); and adding a blank frame on 2 to re initialize the objects. I tried this and it did not work so I must be missing something.

See the tweening code at the bottom.

Any ideas on this part? Was I clear on everything?

I do have to say though, I would not have been able to even start this project if I did not watch Justin's tutorials on Actionscript 3 Basics. He did an awesome job explaining things.

Sorry for the duplicate post I have no idea how that happened and I can not seem to find where to delete the post.

Thanks!

CODE

include "stroke_off.as";
include "timer.as";


import com.greensock.*;
//import com.greensock.easing.*;
//import com.greensock.TimelineLite;

var timeline:TimelineLite = new TimelineMax();

var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = new XML();
//var fields:Array;
var draw0:String;   var draw1:String;   var draw2:String;   var draw3:String;  
var draw4:String;   var draw5:String;   var draw6:String;   var draw7:String;  
var draw8:String;   var draw9:String;

//trace ("num2Stroke visible is set to " +num2Stroke.visible);


strokeOff();

//trace ("num2Stroke visible is set to " +num2Stroke.visible);
//var ingrd:Array = [ing1, ing2, ing3];

xmlLoader.addEventListener(Event.COMPLETE, LoadXML);
//A bit of error handling in case the XML goes missing;
xmlLoader.addEventListener(IOErrorEvent.IO_ERROR, xmlError);
xmlLoader.load(new URLRequest("data.xml"));
//numbers = new Array(num1, num2);
//fields = new Array("one","two");

function xmlError(e:IOErrorEvent):void{
    //Just letting the user know something's screwed
    trace("Error Loading XML");
}

function LoadXML(e:Event):void{
    xmlData = new XML(e.target.data);
    ParseContent(xmlData);
}

function ParseContent(contentInput:XML):void
{
    trace("XML Contents");
    trace("------------------------");

    var numberList:XMLList = contentInput.numberitem;
    //trace ('length is ' + numberList.length());
    gnumber.text = contentInput.gamenumber;
    trace ("Game Number is " +gnumber.text);
        
    for (var i:int = 0; i < numberList.length(); i++)    {
        //trace ("I is " + i);
        //trace ("List Length is " + numberList.length());
        var numberItem:XML = numberList[i];
        draw0 = numberList[0];    draw1 = numberList[1];     draw2 = numberList[2];    draw3 = numberList[3];    
        draw4 = numberList[4];    draw5 = numberList[5];     draw6 = numberList[6];    draw7 = numberList[7];    
        draw8 = numberList[8];    draw9 = numberList[9];     /*draw2 = numberList[2];    draw2 = numberList[2];    */

    }
                
                timeline.append(TweenMax.to(Ball, 4, {bezier:[{x:600, y:-150}, {x:(this["num" +draw0].x-15), y:(this["num" +draw0].y+25)}, {rotation:-30}]}), 2);
                timeline.append(TweenMax.to(Ball, 1, {alpha : 0} ));
                timeline.append(TweenMax.to(this["num"+ draw0], 1, {visible:false} ), -1.75);
                timeline.append(TweenMax.to(this["background"+draw0], 1, {visible:true} ), -1.75);
                timeline.append(TweenMax.to(this["num"+ draw0 + "Stroke"], 1, {visible:true} ), -1.75);                
                timeline.append(TweenMax.to(this["num"+ draw0 + "Stroke"], 1, {scaleX: 2.5, scaleY: 2.5, yoyo: 1, repeat: 1}), -1.);
                                
                timeline.append(TweenMax.to(Ball, 1, {x:1364.75, y:90, rotation:0}));
                timeline.append(TweenMax.to(Ball, .70, {alpha : 1} ), -.25);
                timeline.append(TweenMax.to(Ball, 4, {bezier:[{x:600, y:-150}, {x:(this["num" +draw1].x-15), y:(this["num" +draw1].y+25)}, {rotation:-30}]}));
                timeline.append(TweenMax.to(Ball, 1, {alpha : 0} ));
                timeline.append(TweenMax.to(this["background"+draw1], 1, {visible:true} ), -1.75);
                timeline.append(TweenMax.to(this["num"+ draw1 + "Stroke"], 1, {visible:true} ), -1.75);
                timeline.append(TweenMax.to(this["num"+ draw1 + "Stroke"], 1, {scaleX: 2.5, scaleY: 2.5, yoyo: 1, repeat: 1}), -1);
                            
                timeline.gotoAndPlay(1);
                
                                
    
    
    
}

stop();

[milchreis]

To answer

So where am I right now?

ok, as this is getting a little out of hand (in terms of amount of code), here are some tipps that may save the day (not necessarily today):
- if you post code, please only post the related parts
- if you ever get stuck while being in the middle of the project, ask youself if you should cancel the project. Yes, I'm serious. Maybe you didn't see it coming when starting the project, that's ok and very common.

But maybe it is just this little something that blocks your way. If that is the case, freeze your project and make yourself familiar with that problematic part.
So please, create a new project and take small baby steps. You have to know how to walk before you even think about dancing.

Look at this example, it illustrates how the timer works:

CODE

var t:Timer = new Timer(3000);//3 seconds
            trace(new Date().time);//jsut to trace a "start" time out
            t.start();
            t.addEventListener(TimerEvent.TIMER, timeIsOver);

        function timeIsOver(e:TimerEvent):void
        {
            trace(new Date().time);//jsut to trace out the time and compare it with the other one
            e.target.stop();
            
            //things here happen when the time is over
        }

for me, it traced
1280231176542
1280231179575