p2 test

by AntonLapshin

HTML

<script src="https://rawgithub.com/schteppe/p2.js/master/build/p2.min.js"></script>
<script src="https://rawgithub.com/GoodBoyDigital/pixi.js/master/bin/pixi.js"></script>

JavaScript

var renderer, stage, world, ball, plane;

init();
animate();

function init(){

  // Init p2.js
  world = new p2.World();

  // Add a circle
  ball.shape = new p2.Circle({ radius: 1 });
  ball.body = new p2.Body({ mass:1, position:[0,3] });
  ball.body.addShape(ball.shape);
  world.addBody(ball.body);

  // Add a plane
  plane.shape = new p2.Plane();
  plane.body = new p2.Body({ position:[0,-1] });
  plane.body.addShape(plane.shape);
  world.addBody(plane.body);

  // Initialize the stage
  renderer = PIXI.autoDetectRenderer(600, 400);
  stage = new PIXI.Stage(0xFFFFFF);
  document.body.appendChild(renderer.view);

  // create a texture from an image path
  ball.texture = PIXI.Texture.fromImage('https://s3.postimg.org/jgfai6pgz/rsz_euroball_min.png');
	ball.graphics = new PIXI.Sprite(ball.texture);
  ball.graphics.anchor.x = 0.5;
  ball.graphics.anchor.y = 0.5;
  ball.graphics.position.x = 200;
  ball.graphics.position.y = 150;

  stage.addChild(ball.graphics);
}

// Animation loop
function animate(t){
  t = t || 0;
  requestAnimationFrame(animate);

  // Move physics bodies forward in time
  world.step(1/60);

  // Transfer positions of the physics objects to Pixi.js
  ball.graphics.position.x = ball.body.position[0];
  ball.graphics.position.y = ball.body.position[1];
  ball.graphics.rotation =   ball.body.angle;

  // Render scene
  renderer.render(stage);
}