let imgs = []; //load an array of images

let a = 10;

let b = 10;

let grid;

​

function preload() {

  //load images into an array called imgs

  for (let i = 0; i < 10; i++) {

    imgs[i] = loadImage("MoneySymbols/" + i + ".jpg"); //concatentate file name

  }

}

​

function setup() {

  createCanvas(600, 500);

  noStroke();

​

  // Create a rectangle to fill the entire screen

  // and a smaller rectangle on top

 generateGrid(a,b);

  //got through the arrage of imgs and extract the blues and reds into each blues and reds array

​

​

}

​

function draw() {

​

​

}

​

function mousePressed(){

        // columns.mult(a,10);

        //  rows.mult(b,10);

        generateGrid(100,100);

}

​

function generateGrid(a, b) {

  grid = new EasyGrid({

    x: 10,

    y: 10,

    width: width - 20,

    height: height - 20,

    gutter: 10,

    columns: a,

    rows: b,

  });

   for (let row = 1; row <= grid.state.rows; row++) {

    for (let col = 1; col <= grid.state.columns; col++) {

      let cell = grid.getModule(col, row);

      //to increase by 10= update the grid state rows every time you click

​

      //pick a random image and draw it on each color layer

      let z = floor(random(imgs.length));

​

​

      print(z);

      image(imgs[z], cell.x, cell.y, cell.width, cell.height);

    }

  }

}

​

​

​

​