<commit_before><!DOCTYPE html>
<html lang="en">
  <head>
    <title>p2.js Platformer example</title>
    <meta charset="utf-8">
    <script src="../../build/p2.js"></script>
  </head>
  <body>

    <!-- The canvas, where we draw stuff -->
    <canvas width="600" height="400" id="myCanvas"></canvas>

    <p>Use arrow keys to control character</p>

    <script>
      var canvas, ctx, w, h, zoom=50, jumpSpeed=6, walkSpeed=2,
          world, characterBody, planeBody, platforms=[], boxes=[];

      var buttons = {
        space : false,
        left :  false,
        right : false,
      }

      init();
      animate();

      function init(){

        // Init canvas
        canvas = document.getElementById("myCanvas");
        w = canvas.width;
        h = canvas.height;
        ctx = canvas.getContext("2d");
        ctx.lineWidth = 1/zoom;

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

        world.defaultFriction = 0.5;
        world.solver.stiffness = 1e5;
        world.solver.relaxation = 3;

        // Init materials
        var groundMaterial = new p2.Material(),
            characterMaterial = new p2.Material(),
            boxMaterial = new p2.Material();

        // Add a character body
        characterShape = new p2.Rectangle(0.5,1);
        characterBody = new p2.Body({
          mass: 1,
          position:[0,3],
          fixedRotation: true,
        });
        characterBody.addShape(characterShape);
        world.addBody(characterBody);
        characterShape.material = characterMaterial;
        characterBody.damping = 0.5;

        // Add a ground plane
        planeShape = new p2.Plane();
        planeBody = new p2.Body({
          position:[0,-1]
        });
        planeBody.addShape(planeShape);
        world.addBody(planeBody);
        planeShape.material = groundMaterial;

        // Add platforms
        var platformPositions = [[2,0],[0,1],[-2,2]],
            platformShape = new p2.Rectangle(1,0.3);
        for(var i=0; i<platformPositions.length; i++){
          var platformBody = new p2.Body({
            mass: 0, // Static
            position:platformPositions[i],
          });
          platformBody.addShape(platformShape);
          world.addBody(platformBody);
          platforms.push(platformBody);
        }
        platformShape.material = groundMaterial;

        // Add movable boxes
        var boxPositions = [[2,1],[0,2],[-2,3]],
            boxShape = new p2.Rectangle(0.8,0.8);
        for(var i=0; i<boxPositions.length; i++){
          var boxBody = new p2.Body({
            mass: 1,
            position:boxPositions[i],
          });
          boxBody.addShape(boxShape);
          world.addBody(boxBody);
          boxes.push(boxBody);
        }
        boxShape.material = boxMaterial;

        // Init contactmaterials
        var groundCharacterCM = new p2.ContactMaterial(groundMaterial, characterMaterial,{
          friction : 0.0, // No friction between character and ground
        });
        var boxCharacterCM = new p2.ContactMaterial(boxMaterial, characterMaterial,{
          friction : 0.0, // No friction between character and boxes
        });
        var boxGroundCM = new p2.ContactMaterial(boxMaterial, groundMaterial,{
          friction : 0.6, // Between boxes and ground
        });
        world.addContactMaterial(groundCharacterCM);
        world.addContactMaterial(boxCharacterCM);
        world.addContactMaterial(boxGroundCM);
      }

      function drawBox(body){
        ctx.beginPath();
        var x = body.position[0],
            y = body.position[1],
            s = body.shapes[0];
        ctx.save();
        ctx.translate(x, y);     // Translate to the center of the box
        ctx.rotate(body.angle);  // Rotate to the box body frame
        ctx.fillRect(-s.width/2, -s.height/2, s.width, s.height);
        ctx.restore();
      }

      function drawPlane(){
        var y1 = planeBody.position[1],
            y0 = -h/zoom/2,
            x0 = -w/zoom/2,
            x1 = w/zoom/2;
        ctx.fillRect(x0, y0, x1-x0, y1-y0);
      }

      function render(){
        // Clear the canvas
        ctx.clearRect(0,0,w,h);

        // Transform the canvas
        // Note that we need to flip the y axis since Canvas pixel coordinates
        // goes from top to bottom, while physics does the opposite.
        ctx.save();
        ctx.translate(w/2, h/2);  // Translate to the center
        ctx.scale(zoom, -zoom);   // Zoom in and flip y axis

        // Draw all bodies
        ctx.strokeStyle='none';

        ctx.fillStyle='green';
        drawPlane();
        for(var i=0; i<platforms.length; i++){
          drawBox(platforms[i]);
        }

        ctx.fillStyle='red';
        drawBox(characterBody);
        for(var i=0; i<boxes.length; i++){
          drawBox(boxes[i]);
        }

        // Restore transform
        ctx.restore();
      }

      // Animation loop
      function animate(){
        requestAnimationFrame(animate);

        // Apply button response
        if(buttons.right) characterBody.velocity[0] =  walkSpeed;
        else if(buttons.left)  characterBody.velocity[0] = -walkSpeed;
        else characterBody.velocity[0] = 0;

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

        // Render scene
        render();
      }

      var yAxis = p2.vec2.fromValues(0,1);
      function checkIfCanJump(){
        var result = false;
        for(var i=0; i<world.narrowphase.contactEquations.length; i++){
          var c = world.narrowphase.contactEquations[i];
          if(c.bi === characterBody || c.bj === characterBody){
            var d = p2.vec2.dot(c.ni,yAxis); // Normal dot Y-axis
            if(c.bi === characterBody) d *= -1;
            if(d > 0.5) result = true;
          }
        }
        return result;
      }

      window.onkeydown = function(event){
        switch(event.keyCode){
          case 38: // up
          case 32: // space
            if(!buttons.space){
              if(checkIfCanJump()) characterBody.velocity[1] = jumpSpeed;
              buttons.space = true;
            }
            break;
          case 39: // right
            buttons.right = true;
            break;
          case 37: // left
            buttons.left = true;
            break;
        }
      }

      window.onkeyup = function(event){
        switch(event.keyCode){
          case 38: // up
          case 32: // space
            buttons.space = false;
            break;
          case 39: // right
            buttons.right = false;
            break;
          case 37: // left
            buttons.left = false;
            break;
        }
      }

    </script>

  </body>
</html>
<commit_msg>moving platforms for character demo<commit_after><!DOCTYPE html>
<html lang="en">
  <head>
    <title>p2.js Platformer example</title>
    <meta charset="utf-8">
    <script src="../../build/p2.js"></script>
  </head>
  <body>

    <!-- The canvas, where we draw stuff -->
    <canvas width="600" height="400" id="myCanvas"></canvas>

    <p>Use arrow keys to control character</p>

    <script>
      var canvas, ctx, w, h, zoom=50, jumpSpeed=6, walkSpeed=2,
          world, characterBody, planeBody, platforms=[], boxes=[];

      var buttons = {
        space : false,
        left :  false,
        right : false,
      }

      init();
      animate();

      function init(){

        // Init canvas
        canvas = document.getElementById("myCanvas");
        w = canvas.width;
        h = canvas.height;
        ctx = canvas.getContext("2d");
        ctx.lineWidth = 1/zoom;

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

        world.defaultFriction = 0.5;
        world.solver.stiffness = 1e5;
        world.solver.relaxation = 3;

        // Init materials
        var groundMaterial = new p2.Material(),
            characterMaterial = new p2.Material(),
            boxMaterial = new p2.Material();

        // Add a character body
        characterShape = new p2.Rectangle(0.5,1);
        characterBody = new p2.Body({
          mass: 1,
          position:[0,3],
          fixedRotation: true,
        });
        characterBody.addShape(characterShape);
        world.addBody(characterBody);
        characterShape.material = characterMaterial;
        characterBody.damping = 0.5;

        // Add a ground plane
        planeShape = new p2.Plane();
        planeBody = new p2.Body({
          position:[0,-1]
        });
        planeBody.addShape(planeShape);
        world.addBody(planeBody);
        planeShape.material = groundMaterial;

        // Add platforms
        var platformPositions = [[2,0],[0,1],[-2,2]],
            platformShape = new p2.Rectangle(1,0.3);
        for(var i=0; i<platformPositions.length; i++){
          var platformBody = new p2.Body({
            mass: 0, // Static
            position:platformPositions[i],
          });
          platformBody.motionState = p2.Body.KINEMATIC;
          platformBody.addShape(platformShape);
          world.addBody(platformBody);
          platforms.push(platformBody);
        }
        platformShape.material = groundMaterial;

        // Add movable boxes
        var boxPositions = [[2,1],[0,2],[-2,3]],
            boxShape = new p2.Rectangle(0.8,0.8);
        for(var i=0; i<boxPositions.length; i++){
          var boxBody = new p2.Body({
            mass: 1,
            position:boxPositions[i],
          });
          boxBody.addShape(boxShape);
          world.addBody(boxBody);
          boxes.push(boxBody);
        }
        boxShape.material = boxMaterial;

        // Init contactmaterials
        var groundCharacterCM = new p2.ContactMaterial(groundMaterial, characterMaterial,{
          friction : 0.0, // No friction between character and ground
        });
        var boxCharacterCM = new p2.ContactMaterial(boxMaterial, characterMaterial,{
          friction : 0.0, // No friction between character and boxes
        });
        var boxGroundCM = new p2.ContactMaterial(boxMaterial, groundMaterial,{
          friction : 0.6, // Between boxes and ground
        });
        world.addContactMaterial(groundCharacterCM);
        world.addContactMaterial(boxCharacterCM);
        world.addContactMaterial(boxGroundCM);
      }

      function drawBox(body){
        ctx.beginPath();
        var x = body.position[0],
            y = body.position[1],
            s = body.shapes[0];
        ctx.save();
        ctx.translate(x, y);     // Translate to the center of the box
        ctx.rotate(body.angle);  // Rotate to the box body frame
        ctx.fillRect(-s.width/2, -s.height/2, s.width, s.height);
        ctx.restore();
      }

      function drawPlane(){
        var y1 = planeBody.position[1],
            y0 = -h/zoom/2,
            x0 = -w/zoom/2,
            x1 = w/zoom/2;
        ctx.fillRect(x0, y0, x1-x0, y1-y0);
      }

      function render(){
        // Clear the canvas
        ctx.clearRect(0,0,w,h);

        // Transform the canvas
        // Note that we need to flip the y axis since Canvas pixel coordinates
        // goes from top to bottom, while physics does the opposite.
        ctx.save();
        ctx.translate(w/2, h/2);  // Translate to the center
        ctx.scale(zoom, -zoom);   // Zoom in and flip y axis

        // Draw all bodies
        ctx.strokeStyle='none';

        ctx.fillStyle='green';
        drawPlane();
        for(var i=0; i<platforms.length; i++){
          drawBox(platforms[i]);
        }

        ctx.fillStyle='red';
        drawBox(characterBody);
        for(var i=0; i<boxes.length; i++){
          drawBox(boxes[i]);
        }

        // Restore transform
        ctx.restore();
      }

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

        for(var i=0; i<platforms.length; i++){
          platforms[i].velocity[0] = Math.sin(t*0.001);
        }

        // Apply button response
        if(buttons.right) characterBody.velocity[0] =  walkSpeed;
        else if(buttons.left)  characterBody.velocity[0] = -walkSpeed;
        else characterBody.velocity[0] = 0;

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

        // Render scene
        render();
      }

      var yAxis = p2.vec2.fromValues(0,1);
      function checkIfCanJump(){
        var result = false;
        for(var i=0; i<world.narrowphase.contactEquations.length; i++){
          var c = world.narrowphase.contactEquations[i];
          if(c.bi === characterBody || c.bj === characterBody){
            var d = p2.vec2.dot(c.ni,yAxis); // Normal dot Y-axis
            if(c.bi === characterBody) d *= -1;
            if(d > 0.5) result = true;
          }
        }
        return result;
      }

      window.onkeydown = function(event){
        switch(event.keyCode){
          case 38: // up
          case 32: // space
            if(!buttons.space){
              if(checkIfCanJump()) characterBody.velocity[1] = jumpSpeed;
              buttons.space = true;
            }
            break;
          case 39: // right
            buttons.right = true;
            break;
          case 37: // left
            buttons.left = true;
            break;
        }
      }

      window.onkeyup = function(event){
        switch(event.keyCode){
          case 38: // up
          case 32: // space
            buttons.space = false;
            break;
          case 39: // right
            buttons.right = false;
            break;
          case 37: // left
            buttons.left = false;
            break;
        }
      }

    </script>

  </body>
</html>

{'fraction_non_alphanumeric': 0.12587104819188732, 'fraction_numerical': 0.020098290911758233, 'mean_word_length': 1.6928698400158009, 'pattern_counts': {'":': 0, '<': 52, '<?xml version=': 0, '>': 43, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6862730', 'n_tokens_mistral': 4104, 'n_tokens_neox': 3916, 'n_words': 919}