Flash - SideScroller Turret Math - actionscript-3

I'm working on a side scroller, and for the enemy I'm making a turret. I'm trying to make the turret aim at the player but I cant seem to get it right. Below is a rough sketch of what I want to achieve:
I want the barrel (dark blue), to aim/rotate to its pointing at the player.
I have uploaded a YouTube video of my scene:
http://www.youtube.com/watch?v=eeP47VoX9uA&feature=youtu.be
This is what I have so far (loop):
function enterFrameHandler(e : Event) : void{
_turretBarrel.rotation = Math.atan2(enTarget.x, enTarget.y) * 180/Math.PI;
}
What this does is only rotate the barrel when I jump, and the barrel isn't even aiming at the player, also the barrel doesn't change rotation when I walk on the other side of the turret.
My enTarget.x is always central to the stage and the scene (including the turret) moves around the player left and right (x)... Only the enTarget.y moves (jump/high platform).
I'm slightly new to Flash and ActionScript. If anyone could help me out, or point me in the right direction then that would be great.
Thanks

1) Make sure you got the right numbers and the position of the avatar and the turret are in the same coordinate space. A simple trace of each would do. In this case you probably want the world (relative to stage) position of both clips. Make sure they make sense compared to top left corner of the screen (0, 0).
2) Remember that _turretBarrel.rotation is a rotation that ranges from -180 to 180 so this would need to be taken into consideration when calculating angles.
3) Make sure you use the corresponding degrees/radians where appropriate.
4) force focus on avatar, run the game and see if the bounds looks ok. Then do the same thing with the turret.
Another good thing in general for debugging purposes is to setup some kind of debug graphics. i.e. draw a line of what you think is the direction vector to verify your numbers and calculations.
On a side note:
This is what the majority of programming is; Debugging. Assume nothing but hard facts, get your numbers from the debugger (probably quicker), or trace output. If you're still using the horrible flash professional IDE. I would really recommend getting one with a proper debugger like FlashDevelop (free) or Flash Builder (commercial)

Oliver, it looks like you are calculating the tangens of wrong angle (between player and X-axis). You need something like the following:
function enterFrameHandler(e : Event) : void{
_turretBarrel.rotation = Math.atan2(enTarget.x - barrel.x, enTarget.y - barrel.y) * 180/Math.PI;
}

Related

AS3 collision detection in an object itself

I´m programing a space ship side scroll in as3. The bottom of the stage are mountains and here comes the problem, when I try to detect the ship collision against the mountains..
Because the poor collision detection and the need of avoid large loops my idea is create an object that works as a collider itself detecting a collision and avoiding parse all the stage or more selective metod.
I place "by hand" in the flash stage several instances of circles with a class for manage them where I place the If(this.collider.hits(ship)....
I spent looong time but I can find the way to make it work some of the mistakes i get are like this
Error 1061: Call to a possibly undefined method hitTestObject through a reference with static type Class.
some Idea? Thanks in advance
when you hit test with points it is important that the point being tested is relative to the object being tested against, eg
if(mountain.hitTestPoint(this.x + circle1.x, this.y + circle1.y))
will return true if the circles are inside the object calling the function because their position relative to the mountain is now relative to it rather then relative to the ships xy position within the clip... hope that makes sense.
btw I have done this myself in the past but I would have to remind you that you can only hit test with the points so there is no need to have circles, use blank sprites instead and set the visible flag in the properties panel to false, no drawing will make it slightly faster... not that you will notice, also sprites/graphics use less memory then movie clips.
also I would recommend hard coding some points in the clips rather then actually adding the clips in the sprite/clip itself, this will make it easier to work with them and scale later on (believe me this will annoy the hair from your head to do something later and slow the game to scale on the fly)
try something like this... you can determine the points values by adding a clip to the movie clip and getting its position from the properties if you must.
private var hitPoints:Vector.<Point> = new Vector.<Point>
hitPoints.push(new Point(10, 40));
hitPoints.push(new Point(30, 40));
//...do this for all your points
//loop through all your points and check if the hit relative to the ships position.
for(var i:int = 0; i < hitPoints.length; i++)
{
if (scene.hitTestPoint(ship.x + hitPoints[i].x, ship.y + hitPoints[i].y))
{
//do your hit stuff here
break;//don't forget to break
}
}
in this code you will need to make sure the scene object is a reference to your scenery at the bottom of the screen.
I hope this helps but if this is not enough help then you should post some of your code here so we can have a look and see where it can be improved.

AS3 - Moving a clip (player) along a path

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
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);

Move enemies in platform game

Im relative new to as3, this is my first question here.
Im making super mario game, I added tiles, collision detection, enemies, scrolling.
Sorry for my english, if you dont understand me well, I uploaded file here that you can understand better.
http://www.fastswf.com/K0pTu_0
When game starts all enemies are moving, what I want is that enemies move only if they are on the stage, or if they are near the player.
For example if I set enemy position enemy.x = 3000;
I dont want that he moves if player.x = 40 or something like that.
I tried something like this
if (enemy.x < stage.stageWidth)
{
enemy.x += enemy.speed;
}
But when enemy left the stage, he just stop and wont move anymore.
Btw, I crated one movie clip and I put everything inside it including player.
For example I scroll MovieClip to left, and character go right.
You may want to consider a pre-made platform. This has a free version that you can use to help develop something similar to what you are working on. The paid version has some nice features as well.
https://www.scirra.com/construct2

Moving the "camera" of an HTML Canvas element

I'm trying to find a clean way to "move the camera" of a canvas element.
This for my prototype game (side scroller). I'd love to think there's a better solution than moving the whole set of nodes to simulate a "camera" moving around.
Am almost certain to have read a simple how-to (using offsets?) but the fact I don't find anything like that starts to raise doubts... have I imagined reading that!?
Thanks to help me clarify...
J
Presumably you redraw your whole game scene 30 times a second (more or less)
You need to redraw your whole game scene but first translate the Canvas context by some offset.
context.translate(x,y) is precisely what you want. You'll want to read up on the use of that as well as the save() and restore() methods.
When you translate the context, everything drawn afterwards is shifted by that amount.
So you constantly draw something (maybe an enemy) at 50,50 using drawImage(badguy,50,50). Then the player moves, which changes the x of translate to -1 (because the player is moving to the right) instead of 0. You still draw the enemy sprite with the command drawImage(badguy,50,50), but when you draw it the enemy shows up as if it were at 49,50 because of the context.translate(-1,0) command shifting everything before its drawn.
Of course when you get into performance you'll want to be making sure that you are only ever drawing things that can actually be seen on the screen! If your are far down the level with context.translate(-2000,0), you dont want to be drawing objects at 50,50 anymore, only ones that intersect the viewable area.

Box2dweb, shifting the canvas?

I'm currently working on a game with html5/js, using box2dweb for the collision but I'm running into the issue where I am required to scroll the level with the player. Box2d renders directly to the 2d context so I think in it's current state there is no way to shift the render portion of the canvas?
In as3 you could just put everything in a movieclip and change it's position accordingly.
So, is it possible in anyway to have control of a camera of some sorts or the render portion of the canvas object to shift it's 'position' to keep the player centered at all times?
Thanks in advance,
M0rph3v5
Box2D, by itself, doesn't draw anything, it just calculates positions/collisions.
It offers the so-called "Debug Drawing", but it's purpose is... debug.
Anyway you could start from there to add all the needed features.
http://code.google.com/p/box2d/wiki/FAQ
Yeah I figured, turns out I had to use a context.translate right before the debugdraw as well to 'shift' everything. Got it working nicely now.
EDIT:
The code I'm currently using
context.save();
context.translate(-1*xpos+(canvas.width/2),-1*ypos+(canvas.height/2));
context.rotate(cars[carid].angle);
context.drawImage(carSprite, -carspritewidth/2, -carspriteheight/2);
context.restore();
where xpos and ypos are the x and y positions of the car, after that i just draw the actual car sprite at 0,0 (with the carsize divided as the center).