let n = 50; // Modulus for quadratic residues

​

let gif;

let isRecording = false;

​

function setup() {

  createCanvas(600, 600);

  calculateQuadraticResidues(n);

  shuffle(residues, true); // Shuffle the residues array

  noLoop();

}

function keyPressed() {

  if (key === 's') {

    saveCanvas('myCanvas', 'gif'); // Saves the canvas as a PNG file

  }

}

function draw() {

  background(255); // White background

  noFill(); // No fill color

  stroke(0); // Stroke color

  //strokeWeight(1);

  // Center coordinates

  let centerX = width / 2;

  let centerY = height / 2;

​

  // Draw overlapping squares based on shuffled quadratic residues

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

    // Calculate size based on quadratic residue

    let size = residues[i] * 5; // Scale the size for visibility

​

    // Randomly position squares around the center

    let offsetX = random(-10, 10);

    let offsetY = random(-10, 10);

    let Strok_Weight = (random(0.3,1));

    strokeWeight(Strok_Weight);

​

    // Draw the square centered at the modified position

    rect(centerX + offsetX - size / 2, centerY + offsetY - size / 2, size, size);

​

    // Print the size and corresponding spacing value

    console.log(`Residue: ${residues[i]}, Size: ${size},Length = : ${residues.length}`);

  }

}

​

function calculateQuadraticResidues(n) {

  let seen = new Set();

  for (let x = 0; x < n; x++) {

    let residue = (x * x) % n;

    if (!seen.has(residue)) {

      residues.push(residue);

      seen.add(residue);

    }

  }

}

​