Matterjs

// Importando Matter.js

const { Engine, World, Bodies, Body } = Matter;

​

let engine;

let world;

let balls = [];

let ground;

let leftWall;

let rightWall;

​

function setup() {

  createCanvas(800, 600);

​

  // Criar o motor e o mundo de física

  engine = Engine.create();

  world = engine.world;

​

  // Criar o chão como um corpo estático

  ground = Bodies.rectangle(width / 2, height - 10, width, 20, {

    isStatic: true,

  });

  World.add(world, ground);

​

  // Criar paredes laterais como corpos estáticos

  leftWall = Bodies.rectangle(10, height / 2, 20, height, {

    isStatic: true,

  });

  World.add(world, leftWall);

​

  rightWall = Bodies.rectangle(width - 10, height / 2, 20, height, {

    isStatic: true,

  });

  World.add(world, rightWall);

}

​

function draw() {

  background(51);

​

  // Atualizar o motor de física

  Engine.update(engine);

​

  // Desenhar o chão

  fill(127);

  noStroke();

  rectMode(CENTER);

  rect(ground.position.x, ground.position.y, width, 20);

​

  // Desenhar as paredes laterais

  rect(leftWall.position.x, leftWall.position.y, 20, height);

  rect(rightWall.position.x, rightWall.position.y, 20, height);

​

  // Criar uma nova bolinha continuamente

  if (frameCount % 3 === 0) {

    let ball = Bodies.circle(mouseX, mouseY, 10, {

      restitution: 0.8, // Propriedade que faz a bolinha quicar

      friction: 0.2,

    });

    World.add(world, ball);

    balls.push(ball);

  }

​

  // Desenhar as bolinhas

  fill(255, 150);

  noStroke();

  for (let ball of balls) {

    ellipse(ball.position.x, ball.position.y, 20);

  }

}

​