Keyboard interaction - Zola Osman

mySketch
xxxxxxxxxx
 
//zola osman
​
var xLocation=0
var yLocation=0
ball=200
ball2=200
ball3=200
ball4=0
ball5=0
z=255
o=255 
l=255
a=255
​
function setup() {
  createCanvas(500,500);
  
}
​
function draw() {
  background(255,255,255);
  
  fill(255,0,0)
  //200,200 ball
  if(xLocation<ball+50&&xLocation>ball-50&&yLocation<250&&yLocation>150){
    fill(255,255,255)
    ball=8000
     }
     ellipse(ball,200,30,30)
     
     
     //400,400 ball
     fill(0,0,250)
     if(xLocation<ball2+250&&xLocation>ball2+150&&yLocation<450&&yLocation>350){
    ball2=8000
     }
     ellipse(ball2+200,400,50,50)
     
     //350,150 ball
     fill(244, 66, 217)
     if(xLocation<ball3+200&&xLocation>ball3+150&&yLocation<200&&yLocation>100){
       ball3=8000
     }
  ellipse(ball3+150,150,40,40)
  
  //100,300 ball
  fill(237, 144, 45)
  if(xLocation<ball4+150&&xLocation>ball4+50&&yLocation<350&&yLocation>250){
    ball4=8000
  }
  ellipse(ball4+100,300,75,75)
  
  //150,150 ball
  fill(44, 237, 44)
  if(xLocation<ball5+200&&xLocation>ball5+100&&yLocation<200&&yLocation>100){
    ball5=8000
  }
  ellipse(ball5+150,150,65,65)
  
  fill(200,200,255)
     //main circle and letter color change
     
     if(key=="z"){
       fill(0,0,z)
       
     }
       
  if(key=="o"){
    fill(o,200,0)
    
  }
  
  if(key=="l"){
    fill(9,l,49)
    
    }
​
if(key=="a"){
  fill(a,184,225)
  
  }
  
if(keyIsDown(RIGHT_ARROW)){
  xLocation = xLocation+3
  
} 
  
  if(keyIsDown(LEFT_ARROW)){
  xLocation = xLocation-3
  
}
  
    if(keyIsDown(UP_ARROW)){
  yLocation = yLocation-3
  
}
    if(keyIsDown(DOWN_ARROW)){
  yLocation = yLocation+3
  
}
    
  ellipse(xLocation,yLocation,100,100);
  
​
}