class ColorPicker {
  int x,y,w,h;
  int coloredWidth;
  int coloredX;
  int typesWidth;
  int typesX;
  int greyWidth;
  int greyX;
  int alphaX;
  int spacing;
  PImage cpImage;
  PImage myGreen;
  PImage myRed;
  float H,S,B;
  color [] typeColor;
  int [] typeAlpha;
  float [] typeHue;
  float [] typeSaturation;
  float [] typeBrightness;
  int cNum;
  int currentType;
  int typesSize;
  String[] whichColor = {
    "Farbe  ", "Zweit  \nfarbe", "Kontur  ","Hinter-  \ngrund"                                                 };
  // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
  ColorPicker (int tx, int ty, int tw, int th) {
    x = tx;
    y=ty;
    w = tw;
    h = th;
    typesWidth = (int) (w*0.3);
    typesX = x;
    coloredWidth = (int) (w*0.60);
    coloredX = x+typesWidth;
    greyWidth = (int) (w*0.05);
    greyX = coloredX+coloredWidth;
    alphaX = greyX + greyWidth;
    cpImage = new PImage (w,h);
    H = 360;
    S = 100;
    B = 100;
    spacing = 5;
    cNum = 4;
    currentType = 0;
    typesSize = (typesWidth/cNum)-spacing;
    myGreen = createImage(w,h,ARGB);
    myGreen = loadImage("green.png");
    myRed = createImage(w,h,ARGB);
    myRed = loadImage("red.png");

    typeColor = new color[cNum];
    typeColor[0] = frontColor;
    typeColor[1] = secondColor;
    typeColor[2] = strokeColor;
    typeColor[3] = backColor;

    typeBrightness = new float[cNum];
    typeHue = new float[cNum];
    typeSaturation = new float[cNum];
    for (int i = 0;i<cNum;i++) {
      typeHue[i] = 360;
      typeSaturation[i] = 100;
      typeBrightness[i] = 100;
    }

    typeAlpha = new int[cNum];
    typeAlpha[0] = (frontColor >> 24) & 0xFF;
    typeAlpha[1] = (secondColor >> 24) & 0xFF;
    typeAlpha[2] = (strokeColor >> 24) & 0xFF;
    typeAlpha[3] = (backColor >> 24) & 0xFF;

    loadPixels();
    for (int i = 0; i < w*h; i++) {
      cpImage.pixels[i] = color (200,0,0,0);
    }
    updatePixels();

    colorMode (HSB,360,100,100);
    for(int i=0; i<coloredWidth; i++) {
      for(int j=0; j<h; j++) {
        H = map(i,0,coloredWidth,360,0);
        S = map(j,0,h,0,100);
        cpImage.set(i+typesWidth,j,color(H,S,B));
      }
    }
    colorMode (RGB,255);

    for( int j=0; j<h; j++ ) {
      int g = 255 - (int)(j/(float)(h-1) * 255 );
      setGreys( coloredWidth, j, greyWidth, 1, color( g, g, g ) );
    }

    for (int k = 0;k<h;k++) {
      int a = (int) map (k,0,h,0,255);
      setAlpha (coloredWidth+greyWidth, k, greyWidth, 1, color( 64,a,a, a));
    }        
  }
  // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
  private void setAlpha ( int rx, int ry, int rw, int rh, int rc ) {
    for(int i=rx; i<rx+rw; i++) {
      for(int j=ry; j<ry+rh; j++) {
        cpImage.set( i+typesWidth, j, rc);
      }
    }
  }
  // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
  private void setGreys ( int rx, int ry, int rw, int rh, int rc ) {
    for(int i=rx; i<rx+rw; i++) {
      for(int j=ry; j<ry+rh; j++) {
        cpImage.set( i+typesWidth, j, rc );
      }
    }
  }

  // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
  public void render ()
  {
    imageMode(CORNER);
    rectMode(CORNER);
    textAlign (LEFT);
    image( cpImage, x, y );
    fill(255);
    stroke(0);
    //rect (x-1,y-1,typesWidth+1-spacing,h+1); // Rect around Color Types

    noStroke();  // Color Types
    for (int i = 0; i<cNum; i++) {
      stroke(0);
      fill (255);
      rect (x+i*(typesSize+spacing),y,typesSize,h);
      fill (typeColor[i]);
      rect (x+i*(typesSize+spacing),y,typesSize,h); 



      textSize(12);
      textLeading(10);
      pushMatrix();
      translate (x+i*(typesSize+spacing),y+h);    
      rotate (-PI/2);
      colorMode (HSB,360,100,100);
      float br = brightness(typeColor[i]);
      colorMode (RGB,255);
      float al = alpha(typeColor[i]);
      if (br<65 && al>150) fill(255,192); 
      else fill(0,170);
      text (whichColor[i],2,10);
      fill (0,200,0,200);
      rect(h,0,UIContour,typesSize);
      if (currentType == i) image(myGreen,h,0,UIContour,typesSize); 
      else image(myRed,h,0,UIContour,typesSize);
      popMatrix();
    }


    stroke(0); // Rect around Color Pickers
    noFill();
    rect (coloredX-1,y-1,w+1-typesWidth,h+1);
    rect (greyX,y-1,greyWidth,h+1);

    pushMatrix();
    translate (x+typesWidth,y+h);    
    rotate (-PI/2);
    fill(255,170);
    text ("FARBE",2,10);
    text ("HELL",2,coloredWidth+10);
    text ("ALPHA",2,coloredWidth+greyWidth+10);
    popMatrix();

    fill (255,0,0); // indicators  for color, brightness and alpha
    stroke(255,0,0);
    float tempy = map(typeBrightness[currentType],100,0,y,y+h); 
    float tempx = greyX+greyWidth/2;
    line (greyX,tempy,alphaX,tempy);
    triangle(tempx,tempy-2,tempx-2,tempy-4,tempx+2,tempy-4);
    triangle(tempx,tempy+2,tempx-2,tempy+4,tempx+2,tempy+4);
    tempy = map(typeAlpha[currentType],0,255,y,y+h);
    tempx = alphaX+greyWidth/2;
    line (alphaX,tempy,x+w,tempy);
    triangle(tempx,tempy-2,tempx-2,tempy-4,tempx+2,tempy-4);
    triangle(tempx,tempy+2,tempx-2,tempy+4,tempx+2,tempy+4);
    tempx = map(typeHue[currentType],360,0,coloredX,coloredX+coloredWidth);
    tempy = map(typeSaturation[currentType],0,100,y,y+h);
    fill(255,32);
    ellipse (tempx,tempy,8,8);

    stroke(255,0,0);
    ellipse (tempx,tempy,10,10);
    noFill();
    stroke(0);
    ellipse (tempx,tempy,9,9);




    imageMode(CENTER);
    rectMode(CENTER);
  }
  // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
  void selectColor () {
    if (mouseX > greyX && mouseX < alphaX && mouseY > y && mouseY < y+h) {
      colorMode (HSB,360,100,100); // update Brightness
      typeBrightness[currentType] = constrain(map(mouseY-y,5,h-5,100,0),1,99);
      float h = hue(typeColor[currentType]);
      float s = saturation(typeColor[currentType]);
      typeColor[currentType] = color (h,s,typeBrightness[currentType]);
      colorMode (RGB,255);
      int r = (typeColor[currentType] >> 16) & 0xFF;
      int g = (typeColor[currentType] >> 8) & 0xFF;
      int b = typeColor[currentType] & 0xFF;
      typeColor[currentType] = color (r,g,b,typeAlpha[currentType]);
      //println (r + ", "+g + ", "+b + ", "+typeAlpha[currentType]);
    } 

    if (mouseX > coloredX && mouseX < greyX && mouseY > y && mouseY < y+h) {
      colorMode (HSB,360,100,100); // update Color (Hue, Saturation)
      typeHue[currentType] = map(mouseX-coloredX,0,coloredWidth,360,0);
      typeSaturation[currentType] = map(mouseY-y,0,h,0,100);
      typeColor[currentType] = color (typeHue[currentType],typeSaturation[currentType],typeBrightness[currentType]);
      colorMode (RGB,255);
      int r = (typeColor[currentType] >> 16) & 0xFF;
      int g = (typeColor[currentType] >> 8) & 0xFF;
      int b = typeColor[currentType] & 0xFF;
      typeColor[currentType] = color (r,g,b,typeAlpha[currentType]);
      //println (r + ", "+g + ", "+b + ", "+typeAlpha[currentType]);
    }    
    if (mouseX > alphaX && mouseX < x+w && mouseY > y && mouseY < y+h) {
      typeAlpha[currentType] = constrain((int)map(mouseY-y,5,h-5,0,255),0,255);  
      int r = (typeColor[currentType] >> 16) & 0xFF;
      int g = (typeColor[currentType] >> 8) & 0xFF;
      int b = typeColor[currentType] & 0xFF;
      typeColor[currentType] = color (r,g,b,typeAlpha[currentType]);
      //println (r + ", "+g + ", "+b + ", "+typeAlpha[currentType]);
    }         
  }
  // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
  void selectType () {
    if (mouseX > x && mouseX < x+typesWidth-spacing && mouseY > y && mouseY < y+h) {
      for (int i = 0; i < cNum; i ++) {
        if (mouseX>x+(i*(typesSize+spacing)) && mouseY < y +(i+1)*(typesSize+spacing)) currentType = i;         
      }                 
    }
  }
  // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
  void forwardColors () {
    frontColor = typeColor[0];
    secondColor = typeColor[1];
    strokeColor = typeColor[2];
    backColor = typeColor[3];
    g.updateTileColors();
  }
}  // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -