Instance Mode

This is a rewrite of simplisticExample.html. Hopefully, it is written efficiently. There is a difference. In the MyCanvas version, the red rectangle and line are only active when the mouse is over the canvas. In this version, the rectangle and line follow the mouse no matter where the mouse is on the page. The simplisticMyCanvas took 13 lines of code. This instance mode took 22 lines.

To see the red rectangle, move the mouse over the left canvas.

const sketch1 = (p) => {
  p.setup = () => {
    p.createCanvas(300, 170);
    p.fill(255, 0, 0);
  }
  p.draw = () => {
    p.background("FloralWhite");
    p.rect(p.mouseX, p.mouseY,  200, 80);
  };
};
const sketch2 = (p) => {
  p.setup = () => {
    p.createCanvas(300, 200);
    p.stroke(255, 0, 255);
  }
  p.draw = () => {
    p.background("Khaki");
    p.line(p.mouseX, p.mouseY,  250, 120);
  };
};
let myp5_1 = new p5(sketch1);
let myp5_2 = new p5(sketch2);

James Brink, 5/22/2020