*/

let bg;

let mode;

​

function preload() {

  bg = loadImage("images/480px-NGC_6946.jpg");

  col = loadImage("images/mlcolor.png");

  gray = loadImage("images/mlgray.png");

​

}

​

function setup() {

  createCanvas(480, 480);

  mode = -1;

}

​

function draw() {

  background(bg);

  imageMode(CORNER);

  image(col, width / 4, height / 4, 400, 400);

  //292,279  349,279

  if (mouseIsPressed) {

    image(gray, width / 4, height / 4, 400, 400);

​

    colorMode(RGB, 255);

    if (mode == 0) stroke(255, 0, 0);

    else if (mode == 1) stroke(0, 255, 0);

    else if (mode == 2) {

      colorMode(HSB, 255, 100, 100);

      stroke(10 * (frameCount % 25), 80, 100);

    }

    strokeWeight(10);

    line(mouseX - 10, mouseY, 292, 279);

    line(mouseX + 10, mouseY, 349, 279);

  }

}

​

function mousePressed() {

  mode = (mode + 1) % 3;

}