function setup(){
  var myCanvas = createCanvas(windowWidth,windowHeight); //you must keep this line unmodified
  ballx = width/2
  bally = height/2
  textSize(50)
  xdirection = random(-10,10)
  ydirection = random(-10,10)
}

function draw() { 
  text(key,  width/3,height/3)
noStroke()
  //start writing your code here
 background(0,0,0,5)
  stroke(0,255,0)

strokeWeight(5)
  line(0,height/2,width,height/2)
  line(width/2,0,width/2,height)
noStroke()
  fill(0,255,0)
  rect(mouseX,mouseY,40,40)
  if(mouseX-ballx < 5){
   xdirection *= -1
  }

  if(mouseY-bally < 5){
   ydirection *= -1
  }
   


  fill(255,0,0)
  ellipse(ballx,bally,20,20)
  ballx +=xdirection
  
  if(ballx > width || ballx < 0){
     xdirection *= -1
  }

  if(bally > height){
    ydirection *= -1
  }else if(bally < 0 ){
    ydirection *= -1
  }
  bally+=ydirection

}


function mousePressed(){
fill(0,0,255)
  ellipse(random(width),random(height),60,60)
}
function mouseClicked(){
  fill(255,0,0)
  ellipse(mouseX,mouseY,60,60)
}

function mouseReleased(){
fill(0,255,255)

  rect(random(width),random(height),60,60)
}

function keyPressed(){

  if(keyCode == 65){
  display_text = "hello"
}else if(keyCode == LEFT_ARROW){
  display_text = "left arrow"
 }else{
   display_text = key
}
  text(display_text,width/2,height/2)

}