let squares = [];

let numSquares = 18;

let colors = ['#000000', '#000000', '#01FF01', '#FFFFFF',' #0012FF', '#FFFFFF', '#FFFFFF', '#000000'];

let button; // Добавляем переменную для кнопки

​

function setup() {

  createCanvas(1024, 1024);

  mic = new p5.AudioIn();

  mic.start();

  fft = new p5.FFT();

  fft.setInput(mic);

​

  // Создаем квадратики с более высокой начальной скоростью

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

    squares.push({

      x: random(width),

      y: random(height),

      size: random(5, 180),

      color: random(colors),

      xSpeed: randomGaussian(-2, 2), // Увеличенная скорость по оси X

      ySpeed: random(-1, 1) // Увеличенная скорость по оси Y

    });

  }

​

  // Создаем кнопку для сохранения

  button = createButton('Save');

  button.position(0, height - 18); // Позиционируем кнопку внизу слева

  button.size(50, 18);

  button.mousePressed(saveCanvasAsImage); // Функция, вызываемая при нажатии

}

​

function draw() {

  let spectrum = fft.analyze();

​

  // Обновление и отрисовка квадратиков

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

    let s = squares[i];

    let specValue = spectrum[i % spectrum.length]; // Используем значение из спектра для каждого квадрата

    let newSize = map(specValue*3, 0, 255, 5, s.size); // Используем size из массива squares

​

    fill(s.color);

    square(s.x, s.y, newSize);

​

    // Обновляем позицию квадратика

    s.x += s.xSpeed;

    s.y += s.ySpeed;

​

    // Отражение квадратиков от краев холста

    if (s.x <= 0 || s.x >= width - newSize) s.xSpeed *= -1;

    if (s.y <= 0 || s.y >= height - newSize) s.ySpeed *= -1;

  }

}

​

// Функция для сохранения канваса

function saveCanvasAsImage() {

  save('CUBE.png');

}

​