NoisyCrossesShapedPixelsGlitch

NoisyCrossesShapedPixelsGlitch

// Create a symmetrical diamond shaped (sideways square) "snowflake".
// This can be rotated 45° to make a square.
// Create 1/8th of the shape and reflect that for the remaining 7/8ths.
// Make it a repeatable function with a parameter for the center XY.
// New pattern generated on key press.
// Animated GIF generated and saved on form unload.
// ToDo: Store as class? Then it would be copyable...


// Keys:
// R - Redraw to get a new random pattern.
// S - Save the current pattern as a frame in the output GIF.
//     (The GIF will finalise and save when the program is closed.)


// Save as animated GIF
// Requires gifAnimation Processing Library
// http://www.extrapixel.ch/processing/gifAnimation/
import gifAnimation.*;
GifMaker gifExport;
boolean saveToGif = true;

// The time between GIF frames
int frameDelay = 1000;

// Rotation. 0 and 45 work best for symmetry.
int rotationInDegrees = 45;

// No of cells between the centre and edge DIAGONALLY
// It's kind of confusing, but it makes sense in the code
// Works nicely between 4 to 6
int triangleRadius = 4;
//int triangleDiameter = (triangleRadius*4) - 1;

// This specifies how much the shape should resemble a "star"
//   == 1 makes a cross
//   == 2 makes a square (or diamond)
//   >= 2 makes a star
float starness = 2;

// Cell will be drawn if the RNG is below 1
// So a value of 3 will draw about 1/3 of the cells
float randomUpperLimit = 1.8;

// The dimensions of each cell
int cellW = 32;
int cellH = cellW;

// The ideal pixel size for the canvas
int yPixelIdeal = 256*2;
int xPixelIdeal = int(yPixelIdeal * 1);

// Has to be an odd number to make sure we have a central cell
int xCells = (xPixelIdeal / cellW) + 1;
int yCells = (yPixelIdeal / cellH) + 1;

// Find central cell
int centreCellX = (xCells - 1) / 2;
int centreCellY = (yCells - 1) / 2;

//////////////////////////////////////////////////////////////////////

void setup(){
  size(xCells*cellW,yCells*cellH);
  background(0);
  newPattern(centreCellX , centreCellY);
  if (saveToGif) {
    gifExport = new GifMaker(this, System.currentTimeMillis() + ".gif");
    gifExport.setRepeat(0);
  }
}

//////////////////////////////////////////////////////////////////////

void draw() {}

void keyPressed(){
  println("pressed " + int(key) );
  switch( int(key) ) {
    case 114: background(0); newPattern(centreCellX , centreCellY);; break; //  _R_andomise
    case 115: addToGif(); break; //  _S_ave
  }
}

void stop() {
  if (saveToGif) {
    gifExport.setDelay(frameDelay);
    gifExport.finish();
  }
}

//////////////////////////////////////////////////////////////////////

void addToGif() {
  if (saveToGif) {
    gifExport.setDelay(frameDelay);
    gifExport.addFrame();
  }
}

//////////////////////////////////////////////////////////////////////

void newPattern(int centreCellX, int centreCellY) {
  stroke(0);
  color fillColour;
  
  // Rotate 45°
  if (rotationInDegrees != 0) {
    translate(width/2, height/2);
    rotate(radians(rotationInDegrees));
    translate(-width/2, -height/2);
  }
  
  for(int i=0;i<triangleRadius;i++){
    for(int j=0;j<( (triangleRadius*2) - (starness*i) );j++){
      
      //// Colours /////////////////////////////////
      // White
      //   fillColour = color(255);
      // Grey
      //   fillColour = color(255-i*60, 255-i*60, 255-i*60);
      // Dark red
      //   fillColour = color(210-(150/triangleRadius)*i, 20, 0);
      // Cross red (makes a more pronounced "cross" effect)
      //   fillColour = color(220-(220/triangleRadius)*i, 0, 0);
      // Red cross
      //   fillColour = color(255-i*60, 0, 0);
      // Dark blue
      //   fillColour = color(0, 0, 255-(255/triangleRadius)*i );
      // Lighter blue
      //   fillColour = color(0, 0, random(100,255));
      // Blue cross
      //   fillColour = color(0, 0, 255-i*60);
      // Green cross
      //   fillColour = color(0, 255-i*60, 0);
      // Yellow cross
      //   fillColour = color(255-i*60, 255-i*60, 0);
      // Pink
      /*   int[] ratioRGB = {239, 48, 36};
           fillColour = color(ratioRGB[0]-(ratioRGB[0]/triangleRadius)*i,
                              ratioRGB[1]-(ratioRGB[1]/triangleRadius)*i,
                              ratioRGB[2]-(ratioRGB[2]/triangleRadius)*i );
      */
      // Completely random (stained glass window / rag rug effect)
      //   fillColour = color(random(255), random(255), random(255));
           fillColour = color(random(255), random(255), random(255), 110+(100/triangleRadius)*i);
      //   fillColour = color(random(255)-i*60, random(255)-i*60, random(255)-i*60);
      //////////////////////////////////////////////
        
      // Split the square into eighths, and have each square in each eighth behave the same
      if (random(randomUpperLimit)<1) {
        drawRandomQuadBugged( (centreCellX+i)*cellW, (centreCellY+j+i)*cellH, fillColour);
        drawRandomQuadBugged( (centreCellX-i)*cellW, (centreCellY+j+i)*cellH, fillColour);
        drawRandomQuadBugged( (centreCellX+i)*cellW, (centreCellY-j-i)*cellH, fillColour);
        drawRandomQuadBugged( (centreCellX-i)*cellW, (centreCellY-j-i)*cellH, fillColour);
        drawRandomQuadBugged( (centreCellX+j+i)*cellW, (centreCellY+i)*cellH, fillColour);
        drawRandomQuadBugged( (centreCellX-j-i)*cellW, (centreCellY+i)*cellH, fillColour);
        drawRandomQuadBugged( (centreCellX+j+i)*cellW, (centreCellY-i)*cellH, fillColour);
        drawRandomQuadBugged( (centreCellX-j-i)*cellW, (centreCellY-i)*cellH, fillColour);
      }
    }
  }
}

//////////////////////////////////////////////////////////////////////

void drawRandomQuadBugged(float TopLeftX, float TopLeftY, color fillColour) {
  
  // I NEED TO FIND OUT HOW VECTORS WORK.
  float TopRightX = TopLeftX+cellW;
  float TopRightY = TopLeftY;
  float BottomLeftX = TopLeftX;
  float BottomLeftY = TopLeftY+cellH;
  float BottomRightX = BottomLeftX+cellW;
  float BottomRightY = BottomLeftY;
  
  // Select a random point along each side.
  float TopPointX = random(TopLeftX,TopRightX);
  float BottomPointX = random(BottomLeftX,BottomRightX);
  
  // This code produces the glitch.
  float LeftPointY = random(TopLeftX,BottomLeftX);
  float RightPointY = random(TopRightX,BottomRightX);
  
  // This was what I MEANT to type. (I flipped the Xs & Ys)
  //float LeftPointY = random(TopLeftY,BottomLeftY);
  //float RightPointY = random(TopRightY,BottomRightY);
  
  // Cool stuff happens if you change the stroke.
  stroke(0,0,0,123);
  //strokeWeight( cellW/2 );
  //strokeWeight( 2 );
  strokeWeight( random(2,cellW/2) );
  
  // Create the quad
  fill(fillColour);
  beginShape();
  vertex(TopPointX,TopLeftY);       //Top
  vertex(TopRightX,RightPointY);    //Right
  vertex(BottomPointX,BottomLeftY); //Bottom
  vertex(TopLeftX,LeftPointY);      //Left
  endShape();
  
  // Create the circle
  ellipseMode(CORNER);
  //stroke(64);
  ellipse(TopLeftX, TopLeftY, cellW, cellH);
}

//////////////////////////////////////////////////////////////////////