let h, l;

​

let x, y, vx, vy;

let r;

​

let mag = 2;

​

function setup() {

​

  createCanvas(400, 400);

  xp = 30;

  y1 = 200;

  y2 = 200;

  h = 100;

  l = 5;

  r = 5;

​

  x = width / 2;

  y = height / 2;

​

  v = createVector(random([-1, 1]), random([-1, 1]));

  v.setMag(mag);

​

}

​

​

​

function draw() {

  background(220);

​

  rectMode(CENTER);

  angleMode(RADIANS);

​

  if (keyIsDown(90) && y1 > h / 2) {

    y1 -= 2;

  }

  if (keyIsDown(83) && y1 < 400 - h / 2) {

    y1 += 2;

  }

  if (keyIsDown(38) && y2 > h / 2) {

    y2 -= 2;

  }

  if (keyIsDown(40) && y2 < 400 - h / 2) {

    y2 += 2;

  }

​

  if (y - r < 0 || y + r > height) {

    v.y = -v.y;

  }

  //joueur 1

​

  if (x < r || x > width - r) {

    x = width / 2;

    y = height / 2;

​

    v = createVector(random([-1, 1]), random([-1, 1]));

    v.setMag(mag);

  }

​

  if (x - r < xp - l / 2 && x - r < xp + l / 2 && abs(y1 - y) <= h / 2) {

    let angle = map((y1 - y), -h/2, h/2, -2*PI/3, 2*PI/3) + PI;

    v = p5.Vector.fromAngle(angle, mag);

​

​

    v.x = -v.x;

  }

​

  //joueur 2

​

  if (x + r > width - xp + l / 2 && x + r > width - xp - l / 2 && abs(y2 - y) <= h / 2) {

    v.x = -v.x;

  }

​

  x += v.x;

  y += v.y;

​

  fill(0);

​

​

​

  rect(xp - l, y1, l, h);

  rect(width - xp + l, y2, l, h);

  circle(x, y, r * 2);

}