​

function preload() {

  img = loadImage("cindy-small.jpg");

}

​

function setup() {

  createCanvas(window.innerWidth, window.innerHeight);

  pixelDensity(1);

  image(img, 0, 0);

}

function draw() {}

​

function mouseClicked() {

 img.loadPixels();

  //loop through pixels of copy

​

  for (let x = 0; x < img.width; x++) {

    for (let y = 0; y < img.height; y++) {

      var index = (x + y * img.width) * 4;

​

      img.pixels[index + 0] = 255 - img.pixels[index + 0]; //rotkanal umkehren

      img.pixels[index + 2] = 255; //blaukanal voll

​

      if (y % 2 == 0) {

        img.pixels[index + 3] = 0; //transparenzkanal auf 0

      }

    }

  }

  img.updatePixels();

  image(img, 0 , 0 );

}

​