let ourMode = 1;

​

function setup() {

  createCanvas(540,540);

  buffer = createGraphics(400, 400);

  buffer.background(0);

  buffer.noStroke();

  buffer.fill(65, 90, 143)

  buffer.textSize(60);

  // buffer.text('QUIT',190,150)

  // buffer.ellipse(200, 200, 300, 300);

  buffer.rect(10, 10, 10, 400);

  background(0);

    buffer2 = createGraphics(400, 400);

  buffer2.background(0);

  buffer2.noStroke();

  buffer2.fill(251, 215, 78)

  buffer2.textSize(60);

  buffer2.text('QUIT',190,150)

  // buffer.ellipse(200, 200, 300, 300);

  // buffer.rect(10, 10, 10, 400);

  background(0);

}

​

function draw() {

  background(217, 68, 75,0);

  if(ourMode == 0) {

    image(buffer,0,0,mouseX,mouseY);

  } else if (ourMode == 1) {

    blendMode(DIFFERENCE);

    for (let i = 0; i < 20; i++) {

      for (let j = 0; j < 15; j++) {

        let x = tan((frameCount + j * 4 + i * 30) * 0.01) * 1000;

        let y = -tan((frameCount + i * 3) * 0.01) * 100;

        push();

        translate(i * 110, j * 130);

        image(buffer, 0, y, 100 + x, 100);

        pop();

      }

    }

    blendMode(BLEND);

  }

    if(ourMode == 0) {

    image(buffer2,0,0,mouseX,mouseY);

  } else if (ourMode == 1) {

    blendMode(DIFFERENCE);

    for (let i = 0; i < 20; i++) {

      for (let j = 0; j < 15; j++) {

        let x = sin((frameCount + j * 4 + i * 20) * 0.01) * 1000;

        let y = -tan((frameCount + i * 3) * 0.01) * 100;

        push();

        translate(i * 110, j * 130);

        image(buffer2, 0, y, 100 + x, 100);

        pop();

      }

    }

    blendMode(MULTIPLY);

  }

}

​

function mousePressed() {

  ourMode = ourMode == 1 ? 0:1;

}

​