/* built with Studio Sketchpad: 
 *   https://sketchpad.cc
 * 
 * observe the evolution of this sketch: 
 *   https://studio.sketchpad.cc/sp/pad/view/ro.og01GwSY6QK/rev.94
 * 
 * authors: 
 *   Fun Programming

 * license (unless otherwise specified): 
 *   creative commons attribution-share alike 3.0 license.
 *   https://creativecommons.org/licenses/by-sa/3.0/ 
 */ 



// This sketch builds on a prior work, "TouchTest", created by Ivar B
// http://studio.sketchpad.cc/sp/pad/view/ro.9USIi8Sbymapj/rev.1822

int amount = 16; 
int gridSize;
int colorBoxSize;

color[] colors = { #000000, #AEF022, #29B423, #1ED3C3, #2382B4, #FCF500, #FF9F03, #9F71B7, #FA8DC4 };

int activeColor;

void setup() {
    size(400, 500); 
    background(0);
    stroke(255);
    
    gridSize = width / amount;
    colorBoxSize = width / colors.length;

    drawGrid();    
    drawColorSelector(3);
}
void drawGrid() {
    for(int i = 0; i <= amount; i++) {
      line(i * gridSize, 0, i * gridSize, width);
      line(0, i*gridSize, width, i*gridSize);
    }
}
void drawColorSelector(int desiredColor) {
    activeColor = int(desiredColor);
    fill(255);
    rect(0, amount*gridSize, width, height);
    
    for(int i = 0; i < colors.length; i++) {
      fill(colors[i]);
      int h = colorBoxSize + (i == activeColor ? 10 : 0);
      rect(i * colorBoxSize, height - h, colorBoxSize, h);
    }
    fill(colors[activeColor]);
}

void draw() {
  if(mousePressed && mouseY < width) {
    int x = int(mouseX / gridSize);
    int y = int(mouseY / gridSize);
    rect(x*gridSize, y*gridSize, gridSize, gridSize);
  }
}
void mouseReleased() {
  if(mouseY > (height - colorBoxSize)) {
    drawColorSelector(mouseX / colorBoxSize);
  }
}