Forums » Help » Box 2D questions

I have two somewhat stupid questions regarding the impact implementation of Box 2d. I apologize if these issues have been raised before...

1. How to I check if a box 2D entity is 'standing' (that is to say moving on a static surface) other than to check that the y velocity is zero? Is there a 'collides with tile' property or the equivalent in the Box 2D framework?

2. It is not clear to me from the documentation exactly where/how to implement the box2D world class. Does this go in the main.js file? Also, what is this cryptic AABB notation I see everywhere and why is it used?

Thanks!

1. My Box2D plugin makes this pretty simple. To check if the entity is standing, do: if(this.standing) {}. If you don't want to use the plugin, just have a look in entity.js to see how the .standing property is set.

2. Again, if you use the plugin, this is all done automatically. You don't need to setup the world. However if you want to see how it's being done, have a look at the game.js init function.

Thank you for the helpful post! I am going to check this out tonight, looks to be exactly what I am looking for.

I am updating my game with your version of Box2D and I am having a few minor issues. The game fails to loads to about 99% complete, then hangs. My error console returns the following message when I attempt to load my game.

TypeError: 'undefined' is not an object (evaluating 'ig.world.Step')

at

5698game.js:32

I have placed the entity.js, game.js, lib.js, and debug.js in ~/lib/plugins/box2d. My entity and game are defined as:

MyGame = ig.Game.extend({ ... })

and

EntityPlayer = ig.Entity.extend({ ... }) 

Is this the proper way to set up the plug in? I remember that the last time I used box 2D the entity and game definitions looked something like:

EntityPlayer = ig.Box2DEntity.extend({ ... })

and

MyGame = ig.Box2DGame.extend({ ... })

Any advice would be much appreciated.

I suppose a better way to phrase my question is: do I have to do anything differently from standard box2d to declare my EntityPlayer and MyGame objects?

Your syntax is correct.

It sounds like maybe ig.world is undefined. This could happen if you have not loaded a level. Did you make sure to call loadLevel in your game init function?

Otherwise, just to be sure, type ig.world and ig.world.Step in console and see which one of those is coming back undefined.

The first call to load level is in

init: function() { ... }

in my main.js file if I am reading the code correctly. The call to load the level proceeds as follows:

this.loadLevel( LevelAlienWorld1 );

within that fuction where alienWorld1.js is a level file in ~/lib/game/levels. It seems like this is the correct setup. I have gone through my own & the impact source code and it looks like things are set up to load the level correctly.

Basically all Box2D does to the loadLevel() function is overwrite the default function in order to auto generate the Box2D world from the collision map, right? Thanks again for the help.

Edited 8/19/2013...

So what happens if you type ig.world in console? What about ig.world.Step?

Neither one should be undefined.

I'm sorry, yes, they are both undefined. That is what motivated me to look through the source & verify that the level loading was properly set up. I am going through the documentation associated with Box2D but at the moment I am a bit stumped on this problem. Thanks again for your help, any further advice would be much appreciated.

Assuming you are using Chrome, you can press "CTRL + SHIFT + J" to bring up the developer tools (such as console). If you click the Sources tab and then select lib/plugins/box2d/game.js, you can set a breakpoint on line 127.

Then if you refresh the game, the script will get paused on the line where the createWorldFromMap function returns the world object. If the game does not pause, then it means createWorldFromMap was not called at all.

Setting a breakpoint this way allows you to inspect the state of your game at a specific point in the code. This is useful because you can see whether or not the variable world has a value (by hovering your mouse over the variable).

Edit 1

Are you sure your level has a collision map? Because not having one would cause ig.world to be undefined.

Edit 2

By the way, do you have your source uploaded somewhere like Github? It might make finding out what's wrong easier.

The collision map is definitely there and I am pretty sure that it is defined correctly. I even double checked the level file using a text editor and I can see that there is a layer with "name":"collision" although it is hard to interpret this file by eye. I used break points as you suggested and I think I have tracked down the source of the error (why didn't I think of this?!).

I can tell that ig.world is not defined when the call to ig.world.step occurs in line 32 of ~/plugins/box2d/game.js. I also set a break point at line 23 in that same file. What I find is that this break point does not occur, which implies that the logical test:

if (ld.name == 'collision') { ... }

never returns true, and thus the game world is not created. Why would this be the case? I am going through the code right now to try and understand how the game sets up the Box2d world. Any further thoughts given this new info?

I have used SVN before for document writing but never git. I am looking into it atm, I will try to have my source up soon. I really am not doing anything that radical though. I had a game set up with standard Box 2d, then I added your version and edited the entity.js and game.js files to call the correct functions. It seems like it should just work...

Edit: Could it be that the update() method is somehow being called before the call to loadLevel()?

Quote from Sledge
I have used SVN before for document writing but never git. I am looking into it atm, I will try to have my source up soon.

No worries, and no need to switch to Git (SVN is fine). I just meant that if you could upload your source code somewhere, I could maybe take a look.

I also set a break point at line 23 in that same file. What I find is that this break point does not occur, which implies that the logical test: if (ld.name == 'collision') { ... } never returns true.

Awesome. You're getting closer! Maybe put a breakpoint on or just above the for-loop where that check occurs.

Again within the Sources tab, there are a few buttons on the right: a play/pause button, 3 arrow buttons, and a button to disable your breakpoints. The arrow buttons are used for stepping through the code (once paused) step by step. Specifically you'll want to use the button with the arrow pointing down toward a dot.

This way, you could observe:
- which map object the game is trying to load,
- which layer of the map the loop is currently on (check the value of i),
- and the name of each layer.

That should make it pretty clear why the == 'collision' check is failing.

It seems like the problem is more complicated and I am trying to solve the wrong problem. I should mention that my game first loads a start screen which has no collision map associated with it. I think that partially explains my initial problem.

However, when I disable the start screen and load to the first level, now I have circular dependencies:

Unresolved (circular?) dependencies. Most likely there's a name/path mismatch for one of the listed modules:
game.main (requires: game.levels.tree1)
game.levels.tree1 (requires: game.entities.player, game.entities.robot, game.entities.bluerobot, game.entities.orangerobot, game.entities.levelexit)

The root of all this seems to be that I don't really understand what is going on under the hood of impact. I have spent some time going through some of the impact related vids on YouTube and I am slowly building up an understanding. It is still not clear to me exactly what the sequence of events is that the impact engine uses to load the resources & code associated with a typical game...

Quote from Sledge
It seems like the problem is more complicated and I am trying to solve the wrong problem. I should mention that my game first loads a start screen which has no collision map associated with it. I think that partially explains my initial problem.

That's it! The plugin requires a collision map from which to make the world. I could have done a better job catching such a case and informing the user. Will change the plugin accordingly.

That next error you posted is usually a pretty simple fix. Mind posting the code for your tree1 level?

PS

The root of all this seems to be that I don't really understand what is going on under the hood of impact.

That's OK. No matter how much you learn there will still be something you don't know. Good thing we have forums ;)

So I have resolved the circular dependencies issue. I am skipping the start screen but now I get a new error:

TypeError: 'undefined' is not a function (evaluating 'this.body.SetXForm(this.body.GetPosition(), 0)')

My source is now posted on git:

https://github.com/Sledge-/KWSGame_RR_Box2D_v0.3

What do you think, can you see any obvious errors?

Edit: OK, now I am also getting Weltmeister errors. I think something very basic must be wrong in my code, and I just can't see it at the moment. The Weltmeister error is:

Failed to load entity list via glob.php: SyntaxError: JSON Parse error: Unrecognized token '<'
<?php 
require_once( 'config.php' );

$globs = is_array($_GET['glob']) ? $_GET['glob'] : array($_GET['glob']);
$files = array();
foreach( $globs as $glob ) {
    $pattern = WM_Config::$fileRoot . str_replace( '..', '', $glob );
    $files = array_merge( $files, (array)glob( $pattern ) );
}

$fileRootLength = strlen( WM_Config::$fileRoot );
foreach( $files as $i => $f ) {
	$files[$i] = substr( $f, $fileRootLength );
}

echo json_encode( $files );

?>
Unresolved (circular?) dependencies. Most likely there's a name/path mismatch for one of the listed modules:
weltmeister.weltmeister (requires: weltmeister.edit-entities)
weltmeister.edit-entities (requires: weltmeister.entities)

Note that I have not edited anything having to do with the level editor.

Looking at it now...

By the way, if you edit your post and enclose your code in double pounds like this:

##
code here
##

then it's much easier to read.

Edit 1

OK. So this whole block in player can be removed. It's from the old Box2D 2.0.2 plugin and you're using Box2D 2.1a.

// This sets the position and angle. We use the position the object
// currently has, but always set the angle to 0 so it does not rotate
this.body.SetXForm(this.body.GetPosition(), 0);

If you still want your entity to have a fixed rotation, you can do this:

EntityPlayer = ig.Entity.extend({
  isFixedRotation: true, // <-- this right here
  update: function() {
    ...
  }
  ...
});

Edit 2

You're probably going to notice a few more errors that look like this: b2 is not defined. In the older Box2D plugin, b2 is where the classes were stored. No longer. Here is how to fix those errors:

Example. b2 is not defined in player.js on line 103.

That line looks like this:

this.body.ApplyImpulse( 
    new b2.Vec2(0,-this.jump), 
    this.body.GetPosition() );

so obviously we're looking for b2.Vec2.

Use this website to look it up. If you click b2Vec2 on the side, this page comes up. On that page it says:

Package: Box2D.Common.Math

Therefore, you can find the class at Box2D.Common.Math.b2Vec2

So your new line will look like this:

this.body.ApplyImpulse( 
    new Box2D.Common.Math.b2Vec2(0,-this.jump), 
    this.body.GetPosition() );

No more error!

Very informative & helpful stuff. I am working through the changes now and I already have a running game! Of course now there are all sorts of hilarious physics bugs but that's a fun problem to solve. I will try to post a demo soon once I get a bit further along. Thanks again for all your help!