AS3 changing between animation states - actionscript-3

Question

I am having troubles coding the animation state changes in flash. I have a little big planet style game with 3 horizontal rows the character can jump between. I have the motion set-up in a tween, but I haven't been able to get the character to transition from running animation to jump back/jump forward animation, and then back to run animation when it has finished transitioning between the layers.
The run animation frames are from 1 - 60, jump back a layer is 61, and jump forward a layer is 62. I haven't begun to worry about stationary yet, so it has no frames.
Edit: I've removed the anmatePlayer function and moved the animation control code into the checkEveryFrame function. I only made a separate function for the animations because I wasn't sure where it should go.
package
{
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.transitions.easing.*;
import fl.transitions.TweenEvent;
public class Main_Test_2 extends MovieClip
{
// variables
private var cam:MovieClip = new MovieClip();
private var player:Player = new Player();
private var topPosition:uint = 250;
private var centerPosition:uint = 430;
private var bottomPosition:uint = 610;
private var tweenSpeed:Number = 0.33;
private var UI:UserInterface = new UserInterface();
public function Main_Test_2():void
{
// initialize
init();
}
public function init():void
{
// initialize variables
stage.addChild (cam);
player.x = 200;
player.y = bottomPosition;
cam.addChild (UI);
cam.addChild (player);
// add event listeners
stage.addEventListener(Event.ENTER_FRAME, checkEveryFrame);
UI.topButton.addEventListener(MouseEvent.CLICK, topButtonClick);
UI.centerButton.addEventListener(MouseEvent.CLICK, centerButtonClick);
UI.bottomButton.addEventListener(MouseEvent.CLICK, bottomButtonClick);
}
public function checkEveryFrame(event:Event):void
{
cam.x -= player.x - player.x;
cam.y -= player.y - player.y;
player.vx = player.x - player.prevX;
player.vy = player.y - player.prevY;
player.prevX = player.x;
player.prevY = player.y;
/*if (player.y != topPosition || player.y != centerPosition || player.y != topPosition)
{
player.gotoAndStop (61);
}
else if (player.y == topPosition || player.y == centerPosition || player.y == topPosition)
{
player.gotoAndStop (1);
}*/
if (player.currentFrame == 60)
{
player.gotoAndStop (1);
}
else if (player.currentFrame < 60)
{
player.gotoAndStop (player.currentFrame + 1);
}
/*if (player.y < player.prevY)
{
player.gotoAndStop (61);
}
else if (player.y > player.prevY)
{
player.gotoAndStop (62);
}
else if (player.vy == 0)
{
player.gotoAndStop (1);
}*/
}
public function topButtonClick (event:MouseEvent):void
{
trace ("Top Click");
if (player.y >= bottomPosition)
{
var tween01:Tween = new Tween (player, "y", None.easeNone, bottomPosition, centerPosition, tweenSpeed, true);
}
else if (player.y == centerPosition)
{
var tween02:Tween = new Tween (player, "y", None.easeNone, centerPosition, topPosition, tweenSpeed, true);
}
else if (player.y < topPosition)
{
player.y = topPosition;
}
}
public function centerButtonClick (event:MouseEvent):void
{
trace ("Center Click");
if (player.y > centerPosition)
{
var tween01:Tween = new Tween (player, "y", None.easeNone, bottomPosition, centerPosition, tweenSpeed, true);
}
else if (player.y < centerPosition)
{
var tween03:Tween = new Tween (player, "y", None.easeNone, topPosition, centerPosition, tweenSpeed, true);
}
}
public function bottomButtonClick (event:MouseEvent):void
{
trace ("Bottom Click");
if (player.y <= topPosition)
{
var tween03:Tween = new Tween (player, "y", None.easeNone, topPosition, centerPosition, tweenSpeed, true);
}
else if (player.y == centerPosition)
{
var tween4:Tween = new Tween (player, "y", None.easeNone, centerPosition, bottomPosition, tweenSpeed, true);
}
else if (player.y > bottomPosition)
{
player.y = bottomPosition;
}
}
}
}

Answer 1

It would be helpful to see the code that actually calls animatePlayer; regardless, below is a solution.
Rather than rely on MovieClip to animate, you handle it in your existing checkEveryFrame, thereby providing you more exact control to change your animation state exactly when you need to. I've taken the liberty of unifying your UI clicking actions into a more maintainable function. Additionally, with the absence of your keybinding function, I've added playerState changes to the UI clicking for the sake of demonstration.
As best as I can tell, this should compile, but I'm unable to attempt it without the rest of your objects.
package {
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.transitions.easing.*;
import fl.transitions.TweenEvent;
public class Main_Test_2 extends MovieClip
// variables
private var cam:MovieClip = new MovieClip();
private var player:Player = new Player();
private var tweenSpeed:Number = 0.33;
private var UI:UserInterface = new UserInterface();
public function Main_Test_2():void {
// initialize
init();
}
public function init():void {
// initialize variables
stage.addChild(cam);
player.x = 200;
player.y = playerTracks[0];
cam.addChild(UI);
cam.addChild(player);
// add event listeners
stage.addEventListener(Event.ENTER_FRAME, checkEveryFrame);
UI.topButton.addEventListener(MouseEvent.CLICK, movePlayer);
UI.centerButton.addEventListener(MouseEvent.CLICK, movePlayer);
UI.bottomButton.addEventListener(MouseEvent.CLICK, movePlayer);
}
public function checkEveryFrame(event:Event):void {
cam.x -= player.x - player.x;
cam.y -= player.y - player.y;
player.vx = player.x - player.prevX;
player.vy = player.y - player.prevY;
player.prevX = player.x;
player.prevY = player.y;
// Animation control
var a:Array = animations[playerState]; // current animation set
if (a.length == 2) {
var maxFrames:int = a[1] - a[0]; // Normalize the max value
var currentFrame:int = player.currentFrame - a[0]; // Normalize the current value
var nextFrame:int = normalizedCurrentFrame%maxFrames + a[0] // Modulus of max, and return to actual
player.gotoAndStop(nextFrame)
}
}
private var playerState:String = "run";
private var animations:Object = {
"run":[1,60],
"jump":[61],
"jumpForward":[62]
}
private var playerTracks:Array = [610, 430, 250];
private var playerLocIndex:int = 0;
public function movePlayer(e:MouseEvent):void {
// Based on the button clicked, increase/decrease/set the index of the destination
switch (e.currentTarget) {
case UI.topButton:
playerState = "jump";
playerLocIndex++;
if (playerLocIndex > 2) { playerLocIndex = 2; } // Clamp upper
break;
case UI.centerButton:
playerState = "run";
playerLocIndex = 1;
break;
case UI.bottomButton:
playerState = "jumpForward";
playerLocIndex--;
if (playerLocIndex < 0) { playerLocIndex = 1; } // Clamp lower
break;
}
new Tween(player, "y", None.easeNone, player.y, playerTracks[playerLocIndex], tweenSpeed, true);
}
}
}

Answer 2

Ok, I solved the problem. I had to use a timer that executed its action after the timer ran out. I placed it and a line of code to change states in each line of code with the tweens so the animation would go from run to the jump forward/backward animation and back to run at the end of the timer. Hope this helps someone else in the future.