week 7 hw

let circleColors;

​

function setup() {

  createCanvas(800, 800);

  circleColors = Array.from({ length: 4 }, () => color(random(255), random(255), random(255)));

  noLoop();

}

​

function draw() {

  background(220);

/*repeating the pattern*/

  let rows = 2;

  let cols = 2;

  let cellWidth = width / cols;

  let cellHeight = height / rows;

​

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

    for (let j = 0; j < rows; j++) {

      push();

      translate(i * cellWidth, j * cellHeight);

      drawCell(cellWidth, cellHeight, circleColors);

      pop();

    }

  }

}

/*drawing the circles*/

function drawCell(cellWidth, cellHeight, colors) {

  let circleSpacing = 100;

  let circleRadius = 70;

​

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

    let angle = radians(i * 90);

    let x = cellWidth / 2 + cos(angle) * circleSpacing;

    let y = cellHeight / 2 + sin(angle) * circleSpacing;

    fill(colors[i]);

    ellipse(x, y, circleRadius * 2, circleRadius * 2); // Multiply by 2 to set the diameter

  }

/*drawing the squares*/

  let squareSize = 90;

  fill(255);

  rect(0, 0, squareSize, squareSize);

  rect(cellWidth - squareSize, 0, squareSize, squareSize);

  rect(0, cellHeight - squareSize, squareSize, squareSize);

  rect(cellWidth - squareSize, cellHeight - squareSize, squareSize, squareSize);

}

/*changing the color when mouse is pressed*/

function mousePressed() {

  circleColors = Array.from({ length: 4 }, () => color(random(255), random(255), random(255)));

  redraw();

}

​