@Arantor,
Yes, I've basically kept what was in crate.js, as in...
animSheet: new ig.AnimationSheet( 'media/crate.png', 8, 8 ),
@quidmonkey
from
https://github.com/phoboslab/impact-box2d, the readme says...
"Copy the box2d directory into your lib/plugins/ directory and require the plugins.box2d.entity and plugins.box2d.game files. Subclass your game from ig.Box2DGame and your entities from ig.Box2DEntity:"
So I had added the box2d directory and required 'plugins.box2d.entity' and 'plugins.box2d.game' but not 'plugins.box2d.debug'. I did now, but the game still won't load.
I'm confused about whether to need to use the 'box2d' folder as suggested above or the default 'dbox2d' which as overlapping js files like 'entity.js and game.js' but not 'lib.js' and 'debug.js'. Presumably the former two, entity and game js files are identitical?
I've reattached my two files. 1. Main.js and 2. ball.js and perhaps you can see where I've gone wrong?
1. main.js
ig.module(
'game.main'
)
.requires(
'impact.game',
'impact.font',
'plugins.dc.dc',
'plugins.dbox2d.dbox2d',
'game.entities.player',
'game.entities.crate',
'plugins.box2d.entity',
'plugins.box2d.game',
'plugins.box2d.debug',
'game.entities.ball',
'game.levels.test'
)
.defines(function(){
MyGame = ig.Box2DGame.extend({
gravity: 100, // All entities are affected by this
// Load a font
font: new ig.Font( 'media/04b03.font.png' ),
clearColor: '#1b2026',
paused: false,
init: function() {
// bind keys for desktop web
//ig.input.bind(ig.KEY.SPACE, 'jump');
//ig.input.bind(ig.KEY.LEFT_ARROW, 'left');
//ig.input.bind(ig.KEY.RIGHT_ARROW, 'right');
//ig.input.bind(ig.KEY.F, 'shoot');
this.loadLevel( LevelTest );
AppMobi.webview.execute('canvasInit();');
// -------------------
// begin from http://impactjs.com/forums/code/box2d-plugin
// In your game's init() method, after the Box2d world has
// been created (e.g. after .loadLevel())
this.debugDrawer = new ig.Box2DDebug( ig.world );
// end from http://impactjs.com/forums/code/box2d-plugin
// ---------------------
},
loadLevel: function( data ) {
this.parent( data );
for( var i = 0; i < this.backgroundMaps.length; i++ ) {
this.backgroundMaps[i].preRender = true;
}
},
update: function() {
// screen follows the player
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;
}
// Update all entities and BackgroundMaps
this.parent();
},
draw: function() {
// Draw all entities and BackgroundMaps
this.parent();
// ---------------------
// begin from web page http://impactjs.com/forums/code/box2d-plugin
// Then draw the Box2d debug stuff
this.debugDrawer.draw();
// end from http://impactjs.com/forums/code/box2d-plugin
// ---------------------
if( !ig.ua.mobile || (typeof top != "undefined" && top.location.href.match('^http://localhost:58888')!=null)) {
this.font.draw( 'Left/Right/Jump: Arrow Keys, F to shoot', 2, 2 );
}
},
pause: function() {
if (ig.system) {
if(ig.game){
ig.game.font.draw('Game Paused',ig.system.width/2,ig.system.height/2,ig.Font.ALIGN.CENTER);
}
ig.system.stopRunLoop.call(ig.system);
}
},
unpause: function() {
if (ig.system ) {
ig.system.startRunLoop.call(ig.system);
}
}
});
// Start the Game with 60fps, scaled up by a factor of 2 or 4
// Set height/width/scale based on device type
if(ig.ua.iPad){ig.main( '#_cvs', MyGame, 60, 256, 187, 4 );}
else{ig.main( '#_cvs', MyGame, 60, 240, 150, 2 );}
});
2. ball.js
ig.module(
'game.entities.ball'
)
.requires(
'plugins.dbox2d.entity'
)
.defines(function(){
EntityBall = ig.Box2DEntity.extend({
size: {x: 16, y: 16},
type: ig.Entity.TYPE.B,
checkAgainst: ig.Entity.TYPE.NONE,
collides: ig.Entity.COLLIDES.NEVER,
animSheet: new ig.AnimationSheet( 'media/crate.png', 8, 8 ),
// --------------------
// begin from http://impactjs.com/forums/code/box2d-plugin
// In your entity class
createBody: function() {
var bodyDef = new b2.BodyDef();
bodyDef.position.Set(
(this.pos.x + this.size.x / 2) * b2.SCALE,
(this.pos.y + this.size.y / 2) * b2.SCALE
);
this.body = ig.world.CreateBody(bodyDef);
// These two lines define the shape
// e.g. b2.PolygonDef, b2.CircleDef
var shapeDef = new b2.CircleDef();
shapeDef.radius = 8 * b2.SCALE;
shapeDef.density = 1;
this.body.CreateShape(shapeDef);
this.body.SetMassFromShapes();
},
// end from http://impactjs.com/forums/code/box2d-plugin
// ------------------------
// orginal code for crate entity
//-------------------------
// createBody: function() {
// var def = new b2.BodyDef();
// def.type = b2Body.b2_dynamicBody;
// def.position.Set(
// (this.pos.x + this.size.x / 2) * b2.SCALE,
// (this.pos.y + this.size.y / 2) * b2.SCALE
// );
// this.body = ig.world.CreateBody(def);
// var shape = new b2.PolygonShape();
// shape.SetAsBox(
// this.size.x / 2 * b2.SCALE,
// this.size.y / 2 * b2.SCALE
// );
// var fixtureDef = new b2.FixtureDef();
// fixtureDef.shape = shape;
// fixtureDef.density = 1;
// this.body.CreateFixture(fixtureDef);
//},
init: function( x, y, settings ) {
this.addAnim( 'idle', 1, [0] );
this.parent( x, y, settings );
}
});
});
Thanks if you take a lot at it. Any thoughts are appreciated.