Reading / Writing HSB values

Processing Coding Questions
3

Hello,

This was my morning exercise.

I created 2 PG graphics to work through your code and copied from pg1 to pg2; different backgrounds and locations.

I tried to keep the “spirit” of your code so you could understand how I worked through this.

I did have to use colorMode(HSB) in the main sketch window to use HSB variables.

Code 
PGraphics pg1, pg2;
  
// Size for pg1 and pg2
int wid = 400;
int hei = 400;

void setup() 
  { 
  // Size for pg
  pg1 = createGraphics(200, 200);
  pg2 = createGraphics(200, 200);
  
  // size for display
  size(400, 400);
  
  //frameRate(60);
  
  pg1.beginDraw(); 
  pg1.colorMode(RGB);
  pg1.background(0);
  pg1.endDraw(); 
  
  //Test;
  //pg1.loadPixels(); 
  //pg1.updatePixels();
  //image(pg1, 0, 0);
    
  pg2.beginDraw(); 
  pg2.colorMode(RGB);
  pg2.background(255);
  pg2.endDraw(); 
  
  //Test;
  //pg2.loadPixels(); 
  //pg2.updatePixels();
  //image(pg2, 200, 200);
  //noLoop();
  }

void draw() 
  { 
  if (frameCount%30 == 0)
    {
    drawrect();    
    }
  
  image(pg1, 0, 0);
  image(pg2, 200, 200);
  }

void drawrect() 
  {
  int pixel;
  
  wid = 200;
  hei = 200;
  
  int x = int(random(wid));
  int y = int(random(hei));
  int w = int(random(50));
  int h = int(random(50));
 
  //pg1 graphic  
  pg1.beginDraw();
  pg1.loadPixels();
  pg1.colorMode(HSB, 100);
  
  colorMode(HSB, 100);     // I was using colors in the main graphics renderer
  float hue1 = random(100);
  float sat1 = 100;
  float bri1 = 100;
  
  for (int px = 0; px < w; px++) 
    { 
    for (int py = 0; py < h; py++) 
      { 
      pixel=(x+px) + ((y+py)*wid);
      if (pixel < wid*(hei-1))
        {                
        pg1.pixels[pixel] = color(hue1, sat1, bri1); //colorMode(HSB, 100);           
        }    
      }
    }
  pg1.updatePixels();  
  pg1.endDraw();   
  
// pg2 graphic  
  pg2.beginDraw();
  pg2.loadPixels();
  pg1.loadPixels();
  for (int px = 0; px < w; px++) 
    { 
    for (int py = 0; py < h; py++) 
      { 
      pixel=(x+px) + ((y+py)*wid);
      
      // get background HSB
      if (pixel < wid*(hei-1))
        {       
        float hue2 = hue(pg1.pixels[pixel]);
        float sat2 = saturation(pg1.pixels[pixel]);
        float bri2 = brightness(pg1.pixels[pixel]);         
        pg2.pixels[pixel] = color(hue2, sat2, bri2);           
        }    
      }
    }
  pg2.updatePixels();  
  pg2.endDraw();     
  }

image

It may still need work!

:)