simple collision detection with box2dweb

Posted by skywalker on Game Development See other posts from Game Development or by skywalker
Published on 2014-05-25T16:17:37Z Indexed on 2014/05/26 22:07 UTC
Read the original article Hit count: 591

im beginner in box2dweb that version of box2d for javascript

i wrote simple gravity system and i want to detect the collision between the box and the ground , when the falling box hit the ground execute simple function like function sucs(){alert("the box on the floor !")};

this is my code

var CANVAS_WIDTH = 1024, CANVAS_HEIGHT = 700, SCALE = 30;

var b2Vec2 = Box2D.Common.Math.b2Vec2
        , b2BodyDef = Box2D.Dynamics.b2BodyDef
        , b2Body = Box2D.Dynamics.b2Body
        , b2FixtureDef = Box2D.Dynamics.b2FixtureDef
        , b2Fixture = Box2D.Dynamics.b2Fixture
        , b2World = Box2D.Dynamics.b2World
        , b2MassData = Box2D.Collision.Shapes.b2MassData
        , b2PolygonShape = Box2D.Collision.Shapes.b2PolygonShape
        , b2CircleShape = Box2D.Collision.Shapes.b2CircleShape
        , b2DebugDraw = Box2D.Dynamics.b2DebugDraw;

var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");

var world = new b2World(new b2Vec2(0, 8), true);

var fixDef = new b2FixtureDef();
var bodyDef = new b2BodyDef();
fixDef.density = 1.0;
fixDef.friction = 0.5;
bodyDef.type = b2Body.b2_staticBody;
fixDef.shape = new b2PolygonShape;
fixDef.shape.SetAsBox(20, 2);
bodyDef.position.Set(10, 400 / 30 + 1.8);
world.CreateBody(bodyDef).CreateFixture(fixDef);


fixDef.density = 1.0;
fixDef.friction = 0.5;
fixDef.restitution = 0.3;

bodyDef.type = b2Body.b2_dynamicBody;
bodyDef.position.Set(50 / SCALE, 0 / SCALE);
//bodyDef.linearVelocity.Set((Math.random() * 12) + 2, (Math.random() * 12) + 2);
 fixDef.shape = new b2PolygonShape();
 fixDef.shape.SetAsBox(25 / SCALE, 25 / SCALE);
 world.CreateBody(bodyDef).CreateFixture(fixDef);

 var debugDraw = new b2DebugDraw();
    debugDraw.SetSprite(document.getElementById("canvas").getContext("2d"));
    debugDraw.SetDrawScale(30.0);
    debugDraw.SetFillAlpha(0.5);
    debugDraw.SetLineThickness(1.0);
    debugDraw.SetFlags(b2DebugDraw.e_shapeBit | b2DebugDraw.e_jointBit);
    world.SetDebugDraw(debugDraw);


var image = new Image();
image.src = "image.png";

window.setInterval(gameLoop, 1000 / 60);

function gameLoop() {

    world.Step(1 / 60, 8, 3);

    world.ClearForces();
    context.clearRect(0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);

    b = world.GetBodyList()
    var pos = b.GetPosition();
    context.save();
    context.translate(pos.x * SCALE, pos.y * SCALE);
    context.rotate(b.GetAngle());
    context.drawImage(image, -25, -25);
    context.restore();

    b = b.GetNext();
    pos = b.GetPosition();
    context.save();
    context.translate(pos.x * SCALE, pos.y * SCALE);
    //b.GetAngle()++;
    context.rotate(b.GetAngle());
    context.drawImage(image, -25, -25);
    context.restore();

    world.DrawDebugData();

};

© Game Development or respective owner

Related posts about collision-detection

Related posts about JavaScript