Pixel sorting (time and pixel increment)

Processing Coding Questions
1

Hi!
In this sketch by Kim Asendorf a pixel sorting is performed only once.

Is it possible to give movement to this pixel sorting?
And most importantly, how can you increase this pixel sorting?

int mode = 1;

PImage bg;
String imgFileName = "MyImage";
String fileType = "jpg";

// valori di soglia per determinare i pixel di inizio e fine
int blackValue = -20000000;
int brightnessValue = 20;
int whiteValue = -13000000;

int column = 1;

float Time;
int restart = 0;


void setup() {
  
  bg = loadImage("Tree.jpg");
  
  size(1200, 675);
  frameRate(60);
  // ridimensionamento alla schermata - aggiorna la superficie alle dimensioni dell'immagine
 // surface.setResizable(true);
 // surface.setSize(img.width, img.height);
  
  //  immagine aggiornata sulla superficie e ridimensionata per adattarla a larghezza e altezza del display
  image(bg, 0, 0, width, height);
}


void draw() {
  
  float sec = map(frameCount, 0, 60*60, 0,  TWO_PI);
  
  pushMatrix();
  
   if (sec >= random(0.1,0.12)){
     
  // sorting su colonne
  while(column < bg.width) {
    bg.loadPixels(); 
    sortColumn();
    column++;
    bg.updatePixels();
  }
  
}


  popMatrix(); 
  
  image(bg, 0, 0, width, height);
 
}


void sortColumn() {
  
  int x = column;
  
  // inizio sorting
  int y = 0;
  
  // fine sorting
  int yend = 0;
  
  while(yend < bg.height) {
    switch(mode) {
      case 0:
        y = getFirstNotBlackY(x, y);
        yend = getNextBlackY(x, y);
        break;
      case 1:
        y = getFirstBrightY(x, y);
        yend = getNextDarkY(x, y);
        break;
      case 2:
        y = getFirstNotWhiteY(x, y);
        yend = getNextWhiteY(x, y);
        break;
    }
    
    if(y < 0) break;
    
    int sortLength = yend-y;
    
    color[] unsorted = new color[sortLength];
    color[] sorted = new color[sortLength];
    
    for(int i=0; i<sortLength; i++) {
      unsorted[i] = bg.pixels[x + (y+i) * bg.width];
    }
    
    sorted = sort(unsorted);
    
    for(int i=0; i<sortLength; i++) {
      bg.pixels[x + (y+i) * bg.width] = sorted[i];
    }
    
    y = yend+1;
  }
}



// black y
int getFirstNotBlackY(int x, int y) {

  if(y < bg.height) {
    while(bg.pixels[x + y * bg.width] < blackValue) {
      y++;
      if(y >= bg.height)
        return -1;
    }
  }
  
  return y;
}

int getNextBlackY(int x, int y) {
  y++;

  if(y < bg.height) {
    while(bg.pixels[x + y * bg.width] > blackValue) {
      y++;
      if(y >= bg.height)
        return bg.height-1;
    }
  }
  
  return y-1;
}



// brightness y
int getFirstBrightY(int x, int y) {

  if(y < bg.height) {
    while(brightness(bg.pixels[x + y * bg.width]) < brightnessValue) {
      y++;
      if(y >= bg.height)
        return -1;
    }
  }
  
  return y;
}

int getNextDarkY(int x, int y) {
  y++;

  if(y < bg.height) {
    while(brightness(bg.pixels[x + y * bg.width]) > brightnessValue) {
      y++;
      if(y >= bg.height)
        return bg.height-1;
    }
  }
  return y-1;
}



// white y
int getFirstNotWhiteY(int x, int y) {

  if(y < bg.height) {
    while(bg.pixels[x + y * bg.width] > whiteValue) {
      y++;
      if(y >= bg.height)
        return -1;
    }
  }
  
  return y;
}

int getNextWhiteY(int x, int y) {
  y++;
  
  if(y < bg.height) {
    while(bg.pixels[x + y * bg.width] < whiteValue) {
      y++;
      if(y >= bg.height) 
        return bg.height-1;
    }
  }
  
  return y-1;
}
2

By “give movement” do you mean sort one column at a time, one each frame? There are many kinds of movement. Can you describe what you want to achieve, as carefully as possible?

Right now the sketch uses while(column < bg.width) { to keep increasing column until it is done sorting all of them – all in a single frame.

Instead, you could remove the while{}, unindent the contents, and replace it with a statement: if (column == bg.width) column = 1;. Then draw() will sort one column each frame, and keep sorting forever.

When you say “increase” what do you mean? I don’t understand.