COD207 WEEK 7 Assignment

​

// variables

let size = 50; // shape sizes

let gap = 10; // gap between each shape

let colors = ["#FF0000", "#00FF00", "#0000FF"]; // colors to choose from

let shapes = ["circle", "square", "triangle"]; // shapes to choose from

let pattern = []; // array to store the pattern

​

function setup() {

  createCanvas(400, 400);

  initPattern();

}

​

function draw() {

  background(220);

  drawPattern();

}

​

function initPattern() {

  // random shapes and colors

  // use nested for loop to iterate over the rows and columns

  for (let i = 0; i < height / (size + gap); i++) {

    let row = [];

    for (let j = 0; j < width / (size + gap); j++) {

      let shape = {

        type: random(shapes),

        color: random(colors)

      };

      row.push(shape);

    }

    pattern.push(row);

  }

}

​

function drawPattern() {

  for (let i = 0; i < pattern.length; i++) {

    let row = pattern[i];

    for (let j = 0; j < row.length; j++) {

      let shape = row[j];

    fill(shape.color);

   stroke(0);

      strokeWeight(2);

      // x and y coordinates of the shape

      let x = j * (size + gap) + size / 2;

      let y = i * (size + gap) + size / 2;

      switch (shape.type) {

        case "circle":

          circle(x, y, size);

          break;

        case "square":

​

          square(x - size / 2, y - size / 2, size);

          break;

        case "triangle":

          triangle(

            x,

            y - size / 2,

            x - size / 2,

            y + size / 2,

            x + size / 2,

            y + size / 2

          );

          break;

      }

    }

  }

}

​

function mousePressed() {

  // change the pattern when the mouse is pressed

  for (let i = 0; i < pattern.length; i++) {

    let row = pattern[i];

    for (let j = 0; j < row.length; j++) {

      let shape = row[j];

      // Change shape to a random shape

      shape.type = random(shapes);

      // Change color to a random color

      shape.color = random(colors);

    }

  }

}

​