function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
}
var xPos = 200;
var yPos = 200;

var radius = 10;

var xSpeed = 0;
var ySpeed = .1;
var gravity = 0;

var paddleX = 175;
var paddleY = 390;
var paddleSpeed = 0;

var paddleX2 = 175;
var paddleY2 = 10;
var paddleSpeed2 = 0;

function setup() {
  createCanvas(400, 400);
  xSpeed = random(-1, 1);
  ySpeed = 5;
}

function draw() {
  background(220);
  circle(xPos, yPos, 10);
  xPos = xPos + xSpeed;
  yPos = yPos + ySpeed;
  ySpeed += gravity;
  paddleX += paddleSpeed;
  paddleX2 += paddleSpeed2;
if(collide()|| collide2() ){
    console.log("collided");
    ySpeed = -ySpeed;
  }
  rect(paddleX, paddleY, 50, 10);
  rect(paddleX2, paddleY2, 50, 0);
}
var pSpeed = 8;
function keyPressed(){
  if(keyCode ===LEFT_ARROW){
   console.log("left");
    paddleSpeed = -pSpeed;
  }
  if(keyCode ===RIGHT_ARROW){
    console.log("right");
    paddleSpeed = pSpeed;
  }
  if(key === 'a'){
    console.log("left");
     paddleSpeed2 = -pSpeed;
  }
  if(key === 'd'){
    console.log("right");
     paddleSpeed2 = pSpeed;}
}

function keyReleased(){
  paddleSpeed = 0;
  paddleSpeed2 = 0;
}

function collide(){
  if(xPos > paddleX && xPos < paddleX + 50 && yPos + radius > paddleY){
    return true;
  }
  return false;
}
function collide2(){
  if(xPos > paddleX2 && xPos < paddleX2 + 50 && yPos - radius < paddleY2){
     return true;
     }
  return false;
}
if(xPos + radius > 400 || xPos - radius < 0){ xSpeed = -xSpeed; }
function reset (){
  var xPos = 200;
var yPos = 200;
}