int gridSize = 40;
int picGridSize = 20;
int numpics = 22;
PImage[] thumbArray;
PImage show;
float[][][] brightArray;
int whichPic = 0;
int whichX;
int whichY;

void setup(){
  size(800,640);
  brightArray = new float[numpics][gridSize][gridSize];
  for (int k = 0; k < numpics; k++){
    for (int i = 0; i < gridSize; i++){
      for (int j = 0 ; j < gridSize; j++){
        brightArray[k][i][j] = 255;
      }
    }
  }
  thumbArray = new PImage[numpics];
  for (int i = 0; i < numpics; i++){
    thumbArray[i] = loadImage(i+".jpg");
    println("loaded image "+i);
  }
  for (int k = 0; k < numpics; k++){
    PImage thisImage = thumbArray[k]; 
    int imageWidth = thumbArray[k].width;
    int imageHeight = thumbArray[k].height;
    for (int i = 0; i < gridSize; i++){
      for (int j = 0; j < gridSize; j++){
        brightArray[k][i][j] = brightness(thisImage.pixels[i*(imageWidth/gridSize)+imageWidth*j*(imageHeight/gridSize)]);
      }
    }
  }
}

void draw(){
  whichX = floor(mouseX/(width/picGridSize));
  whichY = floor(mouseY/(height/picGridSize));
  whichPic = (whichX%numpics + (whichY*20))%numpics;
  if (mousePressed){
    show = loadImage("show" + whichPic + ".jpg");
    tint(255);
    image(show, 0, 0, width, height);
  } 
  else{ 
    for (int i = 0; i < pow(picGridSize, 2); i++){
        image(thumbArray[i%numpics], (i%picGridSize)*(width/picGridSize), (i/picGridSize)*(height/picGridSize), width/picGridSize, height/picGridSize);
      }
    for (int i = 0; i < gridSize; i++){
      for (int j = 0; j < gridSize; j++){
        fill(0, 255 - brightArray[whichPic][i][j]);
        noStroke();
        rect(i*(width/gridSize), j*(height/gridSize), width/gridSize, height/gridSize);
      }
    }

    for (int i = 0; i < picGridSize; i++){
      stroke(20);
      line(i*width/picGridSize, 0, i*width/picGridSize, height);
      line(0, i*height/picGridSize, width, i*height/picGridSize);
    }
    stroke(255, 0, 0);
    line(whichX*width/picGridSize, whichY*height/picGridSize, whichX*width/picGridSize + width/picGridSize, whichY*height/picGridSize);
    line(whichX*width/picGridSize, whichY*height/picGridSize + height/picGridSize, whichX*width/picGridSize + width/picGridSize, whichY*height/picGridSize + height/picGridSize);
    line(whichX*width/picGridSize, whichY*height/picGridSize, whichX*width/picGridSize, whichY*height/picGridSize + height/picGridSize);
    line(whichX*width/picGridSize + width/picGridSize, whichY*height/picGridSize, whichX*width/picGridSize + width/picGridSize, whichY*height/picGridSize + height/picGridSize);
  }
}