Random colours problem

For my tessellation project, I’m so near to finishing. I didn’t spot this problem until a friend of mine pointed it out. What I have I done is when I click anywhere within the small grid that will tessellate that onto the bigger grid, but the colour that is on the small grid is different to the colour on the big grid.

Model myModel;
Control myControl;

void setup() {
  size(1300, 600);
  background(255);
  myModel = new Model();
  myControl = new Control();
  myModel.myPattern();
}

void draw() {
  //myModel.myPattern();
}

void mousePressed() {
  myControl.onClick();
}

class Model {
  void myPattern() {
    mydraw(1, 1, 0);
    for (int i = 0; i<10; i++) {
      for (int j = 0; j<10; j++) {
        mydraw(i, j, 200);
      }
    }
  }  
  int [][] myData ={
    {0, 0, 0, 0, 0 }, 
    {0, 0, 0, 0, 0 }, 
    {0, 0, 0, 0, 0 }, 
    {0, 0, 0, 0, 0 }, 
    {0, 0, 0, 0, 0 } 
  };
  void mydraw(int x, int y, int offset) {
    for (int i = 0; i<myData.length; i++) {
      for (int j = 0; j<myData.length; j++) {
        if (myData[i][j] == 1)
          fill(random(0, 255), random(0, 255), random(0, 255));
        else
          fill(255);
        rect(i*12+(x*60)+offset, j*12+(y*60), 10, 10);
      }
    }
  }
  void toggle(int i, int j) {
    println( "model.toggle(): " + i + " " + j );
    if ( i >= 0 && i < 5 && j >= 0 && j < 5 ) {
      myData[i][j] += 1;
      myData[i][j] %= 2;
    }
  }
}

class Control {  
  void onClick() {

    update(mouseX, mouseY);
  }
  void update(int x, int y) {
    println( "control.update(): " + x + " " + y );
    int ax = x - 60;
    int ay = y - 60;
    if ( ax > 0 && ax < 60 && ay > 0 && ay < 60 ) {
      myModel.toggle( ax/12, ay/12 );
      myModel.myPattern();
    }
  }
}
1 Like

It is because you are never saving the color you are using anywhere. You always just take random colors.

Consider this quick fix:

Model myModel;
Control myControl;

void setup() {
  size(1300, 600);
  background(255);
  myModel = new Model();
  myControl = new Control();
  myModel.myPattern();
}

void draw() {
  //myModel.myPattern();
}

void mousePressed() {
  myControl.onClick();
}

class Model {
  color[][] templateColors; // Save the colors of your template


  // Initialize the colors of the template to white
  Model() {
    templateColors = new color[myData.length][myData.length];
    for (int i = 0; i < myData.length; i++) {
      for (int j = 0; j < myData.length; j++) {
        templateColors[i][j] = color(255);
      }
    }
  }

  void myPattern() {
    mydraw(1, 1, 0);
    for (int i = 0; i<10; i++) {
      for (int j = 0; j<10; j++) {
        mydraw(i, j, 200);
      }
    }
  } 

  int [][] myData ={
    {0, 0, 0, 0, 0 }, 
    {0, 0, 0, 0, 0 }, 
    {0, 0, 0, 0, 0 }, 
    {0, 0, 0, 0, 0 }, 
    {0, 0, 0, 0, 0 } 
  };

  void mydraw(int x, int y, int offset) {
    for (int i = 0; i<myData.length; i++) {
      for (int j = 0; j<myData.length; j++) {
        if (myData[i][j] == 1)
          fill(templateColors[i][j]); // Using the color of the template
        else
          fill(255);
        rect(i*12+(x*60)+offset, j*12+(y*60), 10, 10);
      }
    }
  }
  void toggle(int i, int j) {
    println( "model.toggle(): " + i + " " + j );
    if ( i >= 0 && i < 5 && j >= 0 && j < 5 ) {
      myData[i][j] += 1;
      myData[i][j] %= 2;
      templateColors[i][j] = color(random(255), random(255), random(255)); // selecting a new color
    }
  }
}

class Control {  
  void onClick() {

    update(mouseX, mouseY);
  }
  void update(int x, int y) {
    println( "control.update(): " + x + " " + y );
    int ax = x - 60;
    int ay = y - 60;
    if ( ax > 0 && ax < 60 && ay > 0 && ay < 60 ) {
      myModel.toggle( ax/12, ay/12 );
      myModel.myPattern();
    }
  }
}

2 Likes

Thank-you very much!!!