1 decade ago
by Aquen
Hi guys,
I encountered a problem, while making a sidescroller/jumpnrun game.
I wanted my player to jump so I used the following code:
if (ig.input.pressed('jump')) {
this.body.ApplyForce( new b2.Vec2(0,-500),
this.body.GetPosition()
);
this.currentAnim= this.anims.jump;
}
The jumping works, but the user can make multiple jumps, and I don't want that. ;)
Has anyone an idea how to prevent multiple jumps? :-/
Here the whole code of the player so far:
ig.module(
'game.entities.player'
)
.requires(
'plugins.box2d.entity'
)
.defines (function(){
EntityPlayer = ig.Box2DEntity.extend({
size: {x: 16, y:24},
name: 'player',
animSheet: new ig.AnimationSheet( 'media/player.png', 16, 24 ),
init: function( x, y, settings ){
this.parent ( x, y, settings);
this.addAnim( 'idle', 1, [0]);
this.addAnim( 'jump', 0.07, [1,2] );
},
update: function(){
this.body.SetXForm(this.body.GetPosition(), 0);
if( ig.input.state('left')){
this.body.ApplyForce( new b2.Vec2(-20,0),
this.body.GetPosition());
this.flip=true;
}
else if (ig.input.state('right')){
this.body.ApplyForce( new b2.Vec2(20,0),
this.body.GetPosition());
this.flip= false;
}
if (ig.input.pressed('jump')) {
this.body.ApplyForce( new b2.Vec2(0,-500),
this.body.GetPosition()
);
this.currentAnim= this.anims.jump;
}
else {
this.currentAnim= this.anims.idle
}
this.currentAnim.flip.x = this.flip;
this.parent();
}
});
});
You&
039;ll need a grounded property. ImpactJS uses #standing, which is the same thing with a different name. In Box2D detecting the grounded/standing state is done through sensors, which detect contact but don't actually collide. Basically, you put a sensor box at the bottom of the character and if it has a contact, you're grounded and can jump. For specifics, check out:
http://www.iforce2d.net/b2dtut/jumpability
1 decade ago
by Joncom
A very simple solution would be to use
this plugin.
Then you could achieve what you want like this:
if(ig.input.pressed('jump') && this.standing) {
this.vel.y = -100;
}
1 decade ago
by Aquen
Thanks for your responses.
I downloaded and copied the plugin. I've updated the player.js but now there is an error while loading the game. "Unhandled Error. Cannot convert 'ig.Box2DEntity' to object.
That's how my player.js looks now:
ig.module(
'game.entities.player'
)
.requires(
'plugins.box2d.entity'
)
.defines (function(){
EntityPlayer = ig.Box2DEntity.extend({
size: {x: 16, y:24},
name: 'player',
animSheet: new ig.AnimationSheet( 'media/player.png', 16, 24 ),
health: 100,
type: ig.Entity.TYPE.A,
init: function( x, y, settings ){
this.parent ( x, y, settings);
this.addAnim( 'idle', 1, [0]);
this.addAnim( 'jump', 0.07, [1,2] );
},
update: function(){
this.body.SetXForm(this.body.GetPosition(), 0);
if( ig.input.state('left')){
this.body.ApplyForce( new b2.Vec2(-20,0),
this.body.GetPosition());
this.flip=true;
}
else if (ig.input.state('right')){
this.body.ApplyForce( new b2.Vec2(20,0),
this.body.GetPosition());
this.flip= false;
}
if(ig.input.pressed('jump') && this.standing) {
this.vel.y = -100;
}
else {
this.currentAnim= this.anims.idle
}
this.currentAnim.flip.x = this.flip;
this.parent();
}
});
});
I thought I could have made some Syntax mistakes but I found nothing like that. o:
1 decade ago
by Joncom
Change this line:
EntityPlayer = ig.Box2DEntity.extend({
To:
EntityPlayer = ig.Entity.extend({
1 decade ago
by Aquen
Hmm this doesn't work neither. :-/
I also thought I had to use the ig.Box2D.extend because it is a Box2D game
( in HTML5 Game development with ImpactJS by Davy Cielen and Arno Meysman it is programmed in this way).
1 decade ago
by Joncom
Quote from Aquen
Hmm this doesn't work neither. :-/
You need to replace that line for all of your entities, not just player.
I also thought I had to use the ig.Box2D.extend
That is how you would do it if you were using the official Box2D plugin. Which one should you use? That's your call.
If you haven't already though, read
this post here to see what the differences are. Also, to get it working, there are
installation instructions.
1 decade ago
by Aquen
I replaced it in all entity documents and also in the main.js(because the debugger took it also as an error. I switched ig.Box2DGame.extend to ig.Game.extend).
The error I get is:
Cannot convert ig.world to object
this.body = ig.world.CreateBody(bodyDef);
1 decade ago
by Joncom
Are you loading a level in init of main.js?
Does the level have a collision map?
What browser are you using?
Are you familiar with how to use breakpoints to debug your code?
1 decade ago
by Aquen
Yes the level is chpsen im the init of main.js.
You mean a collision layer? Yes it has.
Im using opera. But it doesnt work on IE neither.
Nope I am not familiar with breakpoints.
1 decade ago
by Joncom
1. You may want to look into
debugging tools that let you set breakpoints. Basically a breakpoint is a line of code that you specify. And when the script reaches that point, the script gets paused and you can look at all the values. It's very helpful for making sure everything is what it should be.
2. Would you be able to upload your game someplace (maybe
Github)? Because it's difficult to debug without seeing any of the code.
1 decade ago
by Aquen
Hi,
Ah thanks for the information about the debugging tools.
I uploaded it on File-Upload.net
Here is the link:
[Link removed because it contained the ImpactJS library.]
Thanks for your help by the way... :-)
1 decade ago
by Joncom
So the error was entirely my fault. You can get the fixed version
here.
Also, remove line 25 of player.js, which currently looks like this:
this.body.SetXForm(this.body.GetPosition(), 0);
That's how you used to set fixed rotation in an older version of Box2D. You can accomplish the same thing now using
isFixedRotation.
1 decade ago
by Aquen
Thanks! I will try it later :-)
1 decade ago
by Aquen
Ok the good thing: It loads the game. But the player flies up (without any key pressed) and then I can't move oO
There is no error in the debugger.
1 decade ago
by Joncom
Are you sure there's no error in your JavaScript console? When I tried to move I got an error saying something like "b2 does not exist".
If you&039;re not able to move, one thing I would do is put #console.log("Just tried to move"); under the line where you move the entity. This way, even if the entity does not move, you can at least see that the code was called.
1 decade ago
by Aquen
Oh yeah I tried it against and now I see the same error:
Unhandled Error: Undefined variable: b2
The Log message is not shown anywhere.
ARGS.
What to do now? I thought the b2.Vec2 would be a box2D standard feature. Or did you remove it in your customized version? Then how can I get the thing done?
1 decade ago
by Joncom
Quote from Aquen
Oh yeah I tried it against and now I see the same error:
Unhandled Error: Undefined variable: b2
The Log message is not shown anywhere.
ARGS.
What to do now? I thought the b2.Vec2 would be a box2D standard feature. Or did you remove it in your customized version? Then how can I get the thing done?
You would get that error even if you were using the official plugin. It happens because you were using an outdated version of the Box2D plugin (and now you're not).
// Old way
var someVec = new b2.Vec2();
// New way
var otherVec = new Box2D.Common.Math.b2Vec2();
Notice how b2Vec2 exist within the
Box2D object now instead of
b2? You&
039;re going to have to fix any instance where #b2 is referenced.
Use
this site to figure out where certain classes are. For example, if you wanted to know where
b2Body was, go
here and look at
package: "Box2D.Dynamics"
This means that
b2Body can be accessed via
Box2D.Dynamics.b2Body. Hope that makes sense...
1 decade ago
by Aquen
So that means that in my player.js I have to fix it like this:
ig.module(
'game.entities.player'
)
.requires(
'plugins.box2d.entity'
)
.defines (function(){
EntityPlayer = ig.Entity.extend({
isFixedRotation: true,
size: {x: 16, y:24},
name: 'player',
animSheet: new ig.AnimationSheet( 'media/player.png', 16, 24 ),
health: 100,
type: ig.Entity.TYPE.A,
init: function( x, y, settings ){
this.parent ( x, y, settings);
this.addAnim( 'idle', 1, [0]);
this.addAnim( 'jump', 0.07, [1,2] );
},
update: function(){
if( ig.input.state('left')){
this.body.ApplyForce( new Box2D.Common.Math.b2.Vec2(-20,0),
this.body.GetPosition());
this.flip=true;
}
else if (ig.input.state('right')){
this.body.ApplyForce( new Box2D.Common.Math.b2.Vec2(20,0),
this.body.GetPosition());
this.flip= false;
}
if(ig.input.pressed('jump') && this.standing) {
this.body.ApplyForce( new Box2D.Common.Math.b2.Vec2(0,-100));
}
else {
this.currentAnim= this.anims.idle
}
this.currentAnim.flip.x = this.flip;
this.parent();
}
});
});
Do I have to fix the this.body.ApplyForce and the this.body.GetPosition too?
Don't know if you meant that with the b2Body in your posting.
When I change it like above, the problem isn't solved.
But now the error in the script debugger vanished. I have only the errormessages in a special menue. It says: Invalid value for property: image-rendering
1 decade ago
by Joncom
Box2D.Common.Math.b2.Vec2(-20,0)
...should be like this:
Box2D.Common.Math.b2Vec2(-20,0)
By the way, when you post code, it&
039;s easier to read if you enclose it in #. Like this:
##
/* code here */
##
1 decade ago
by Aquen
I tried it and now I can move and jump. But the problem is: My player is flying up to the top border of the Interface at beginning of the game.
Here the code of my two .js files:
ig.module(
'game.main'
)
.requires(
'impact.game',
'impact.font',
'plugins.box2d.game',
'game.levels.level1',
'game.entities.player',
'game.entities.crate'
)
.defines(function(){
MyGame = ig.Game.extend({
gravity: 500,
// Load a font
font: new ig.Font( 'media/04b03.font.png' ),
init: function() {
ig.input.bind(ig.KEY.LEFT_ARROW, 'left');
ig.input.bind(ig.KEY.RIGHT_ARROW, 'right');
ig.input.bind(ig.KEY.X, 'jump');
this.loadLevel(LevelLevel1);
},
update: function() {
// Update all entities and backgroundMaps
this.parent();
var player = this.getEntitiesByType( EntityPlayer)[0];
if (player) {
this.screen.x= player.pos.x - ig.system.width/2;
this.screen.y = player.pos.y - ig.system.height/2;
}
// Add your own, additional update code here
},
draw: function() {
// Draw all entities and backgroundMaps
this.parent();
}
});
// Start the Game with 60fps, a resolution of 320x240, scaled
// up by a factor of 2
ig.main( '#canvas', MyGame, 60, 320, 240, 2 );
});
ig.module(
'game.entities.player'
)
.requires(
'plugins.box2d.entity'
)
.defines (function(){
EntityPlayer = ig.Entity.extend({
isFixedRotation: true,
size: {x: 16, y:24},
name: 'player',
animSheet: new ig.AnimationSheet( 'media/player.png', 16, 24 ),
health: 100,
type: ig.Entity.TYPE.A,
init: function( x, y, settings ){
this.parent ( x, y, settings);
this.addAnim( 'idle', 1, [0]);
this.addAnim( 'jump', 0.07, [1,2] );
},
update: function(){
if( ig.input.state('left')){
this.body.ApplyForce( new Box2D.Common.Math.b2Vec2(-20,0),
this.body.GetPosition());
this.flip=true;
}
else if (ig.input.state('right')){
this.body.ApplyForce( new Box2D.Common.Math.b2Vec2(20,0),
this.body.GetPosition());
this.flip= false;
}
if(ig.input.pressed('jump') && this.standing) {
this.body.ApplyForce( new Box2D.Common.Math.b2Vec2(0,-100));
}
else {
this.currentAnim= this.anims.idle
}
this.currentAnim.flip.x = this.flip;
this.parent();
}
});
});
By the way: How can I make my player move faster? I thought there was something like "accelerate"?
1 decade ago
by Joncom
Your code is more complicated than it needs to be...
Try this:
update: function() {
if (ig.input.state('left')) {
this.vel.x = -100;
this.flip = true;
} else if (ig.input.state('right')) {
this.vel.x = 100;
this.flip = false;
}
if (ig.input.pressed('jump') && this.standing) {
this.vel.y -= 200;
} else {
this.currentAnim = this.anims.idle
}
this.currentAnim.flip.x = this.flip;
this.parent();
}
1 decade ago
by Aquen
Oh ok thanks for the tip. But in fact the problem with the player on the top border of the interface is not solved. :( And also the bug, that my player can't move is also back now.
1 decade ago
by Joncom
Quote from Aquen
...the problem with the player on the top border of the interface is not solved.
Should be fixed in the
latest version.
1 decade ago
by Aquen
Oh yeah it's fixed. But my player can not jump. Moving right or left is working but jumping not.
ig.module(
'game.entities.player'
)
.requires(
'plugins.box2d.entity'
)
.defines (function(){
EntityPlayer = ig.Entity.extend({
isFixedRotation: true,
size: {x: 16, y:24},
name: 'player',
animSheet: new ig.AnimationSheet( 'media/player.png', 16, 24 ),
health: 100,
type: ig.Entity.TYPE.A,
init: function( x, y, settings ){
this.parent ( x, y, settings);
this.addAnim( 'idle', 1, [0]);
this.addAnim( 'jump', 0.07, [1,2] );
},
update: function(){
if (ig.input.state('left')) {
this.vel.x = -100;
this.flip = true;
} else if (ig.input.state('right')) {
this.vel.x = 100;
this.flip = false;
}
if (ig.input.pressed('jump') && this.standing) {
this.vel.y -= 200;
} else {
this.currentAnim = this.anims.idle
}
this.currentAnim.flip.x = this.flip;
this.parent();
}
});
});
I tried it also with the b2Vec2 for jumping but it didn't work neither.
1 decade ago
by Joncom
You can fix it by changing line 165 in
/lib/plugins/box2d/entity.js from:
if (normal.y < 0) {
... to:
if (normal.y > 0) {
... although I'm not sure why this is. Your game (compared with mine) appears to be inverted. Hmm..
1 decade ago
by Aquen
Yeah one step closer!
Now I have just some minor bugs, which are:
1. When I move and jump around and so on and then stand still, I can't move and jump anymore.
2. When I shortly press left or jump at the beginning of the game I have the same problem. It's like the charakter is stuck.
1 decade ago
by Joncom
That's because Box2D puts non-moving entities "to sleep" in order to save CPU. So you need to either wake up your entity when you want to move, or disable sleeping altogether.
EntityPlayer = ig.Entity.extend({
allowSleep: false,
...
});
This reminds me, @Joncom, when I had Box2D in Impact++, there was a nasty bug that caused static bodies to never go to sleep. It was something inherent to the version of Box2D, but not too difficult to fix, and helped performance a good amount when dealing with many bodies. Did you check if your plugin's version of Box2D has this problem?
