AS3 - Moving a clip (player) along a path

Question

I'll try to explain my problem in a clear and short way.

I'm writing a grid-game. In this game when the player clicks somewhere, the player moves, along the grid with a path calculated by the computer (because there's obstacles that the player avoid : walls...) to the final point. It's an isometric grid but it's like it was a basic 2D grid.

So I have my path, which is a Point Array (key points screen coordinates) :

path : [x=10,y=100],[x=40,y=172], .. etc.

To display the movement of the player, I tried to use tweens (TweenLite/TweenMax). There's no option on TweenLite to wait for a tween to finish before starting the next. In any case the solutions seem complicated (shitty delays/onFinish:function).

The solution I found is acceptable : TweenLite provides a LinePath2D function which works exactly like I wished. The only problem is that it works with only one function (path is the complete array):

var pathanimate:LinePath2D = new LinePath2D(path);
pathanimate.addFollower(Player);
TweenMax.to(pathanimate, 1, { progress:1, ease:Linear.easeNone });

So I can't "touch" anything during the movement. INCLUDING the aspect of the sprite of the player that must changes with the direction during each step of the path (it would be more simple if it LinePath worked with a loop).

I don't know if this is clear (i'm french huh) but I see only but two options :

Keep the LinePath and have, on each frame, some kind of counter/timer that "measures" the direction of the player. Could be heavy in ressources, but keeps the LinePath2D that works very well alone
Find another solution

I'd be glad to hear your ideas and code !

Thanks in advance

Just so you know, the greensock library has something called TimelineLite and TimelineMax which will play the tweens in order, waiting for the previous one to finish before moving on to the next. — Bennett Yeates
Tried that, didn't work properly. In fact if during the movement the player clicks elsewhere the current movement won't stop... — John Biscuit
timeline.stop(), I'm not saying you have to use tweenmax, just letting you know what's available. — Bennett Yeates

Nicolas Siver Nicolas Siver · Accepted Answer · 2014-03-07T20:50:16

Actually I can provide several solutions, but they will include many lines of code. Briefly speaking:

System of waypoints. You have algorithm to set collection of waypoints to your character, and render him (updating from the main gaming loop), and character reaches one waypoint after another by shifting them from the collection.
Working with tweens, append them (so there will be queue).

In both options, you can set new path for the character, all you need is simple logic to approximate current position of the character to the closest grid point, and calculate new path from there, It's very easy with basic grid systems, like:

closestGridCellX = Math.round(this.x / gridCellSize);
closestGridCellY = Math.round(this.y / gridCellSize);

AS3 - Moving a clip (player) along a path

1 Answers