// Cloned by p birdwood on 10 Sep 2020 from World "Tutorial 3.2" by "Coding Train" project 
// Please leave this clone trail here.
 

/*
https://vimeo.com/channels/learningp5js/138935675
*/

var x = 0;
var xspeed = 3; 
var y = 0;
var yspeed = 3;

function setup() {
  createCanvas(800, 810);
  
}

function draw() {
  background(0);
  stroke('red');
  strokeWeight(4);
  noFill();
  ellipse(x, y, 50, 50);
  
  stroke('green')
 strokeWeight(4);
  
  ellipse(mouseX, mouseY, 50, 50);
 
  
  if (x > width) {
    xspeed = -3;
   }
   if (x < 0) {
    xspeed = +3;
    } 
  

 
  if (y > height) {
    yspeed = -3;
   }
   if (y < 0) {
    yspeed = +3;
    } 
  

  if ((y > mouseY - 25) && 
        (y < mouseY + 25) && 
        (x > mouseX-25) &&
        (x < mouseX+25)) {
      if (yspeed == 3) {
          yspeed = -3;
          y = y - 10;
      } else {
          yspeed = 3;
          y = y + 10;
      }
        }
      
    if ((y > mouseY - 25) && 
        (y < mouseY + 25) && 
        (x > mouseX-25) &&
        (x < mouseX+25)) {
        if (xspeed == 3) { 
           xspeed = -3;
           x = x - 10;
           } else {
           xspeed = 3;
           x = x + 10;
    }
   }
  
 y = y + yspeed; 
 x = x + xspeed;
 
 
 
 
 
 
}