​

// ****************************************************************

​

let canvasWidth = 800;

let canvasHeight = 600;

​

let rectWidth = 100;

let rectHeight = 50;

let movingRect = { x: 0, y: canvasHeight - rectHeight }; // start position in Q3

​

function setup() {

  createCanvas(canvasWidth, canvasHeight);

}

​

function draw() {

  background(230, 230, 250);

  // calculate the direction towards the mouse

  let directionX = mouseX - movingRect.x;

  let directionY = mouseY - movingRect.y;

​

  // normalize the direction vector

  let length = sqrt(directionX * directionX + directionY * directionY);

  // move the rectangle towards the mouse

  if (length > 0) {

    movingRect.x += (directionX / length) * 2; // move at a speed of 2 pixels

    movingRect.y += (directionY / length) * 2; // move at a speed of 2 pixels

  }

​

  // draw the moving rectangle

  fill(255, 255, 204); // pastel yellow

  rect(movingRect.x, movingRect.y, rectWidth, rectHeight);

}

​