final3

// MONITOR MICROPHONE INPUT & VISUALIZE WITH FULL SCREEN SOUND BARS, 3D AESTHETIC SHAPES, AND A SOUNDWAVE

var mic;

var micLev;

var micGain;

var prevBgColor;

​

var fft; // For frequency analysis

var barHeights = [];

​

function setup() {

  createCanvas(windowWidth, windowHeight, WEBGL); // Using WEBGL for 3D effects

  background(0, 0, 0);

​

  // Set additional gain for input data

  micGain = 2;

​

  // Initialize microphone

  mic = new p5.AudioIn();

  mic.start();

​

  // Initialize FFT (frequency analysis)

  fft = new p5.FFT();

  fft.setInput(mic);

​

  // Initialize bar heights array

  for (var i = 0; i < 120; i++) {

    barHeights[i] = 0; // Start all bars at height 0

  }

​

  // Initial fading background color

  prevBgColor = color(0, 0, 0);

}

​

function draw() {

  // Fade background with smooth transition based on mouseX position

  var fadeSpeed = 10;

  var bgColor = lerpColor(prevBgColor, color(mouseX / width * 255, mouseY / height * 255, 100), 0.02);

  background(bgColor);

  prevBgColor = bgColor;

​

  // Get microphone level and adjust for gain

  micLev = mic.getLevel() * micGain;

​

  // Frequency analysis

  var spectrum = fft.analyze();

  // Number of sound bars and spacing

  var numBars = 120; // Full screen coverage with more bars

  var barWidth = width / numBars;

​

  // Map micLev to a color value (from cool to warm colors)

  var waveColor = color(map(micLev, 0, 1, 0, 255), 0, map(micLev, 0, 1, 255, 0));

​

  // Draw soundbars with smooth animations

  noStroke();

  for (var i = 0; i < numBars; i++) {

    // Use a custom easing function for smoother transitions

    var targetHeight = micLev * height * 5 * sin(i * 0.1); // Vary each bar's response

    barHeights[i] = lerp(barHeights[i], targetHeight, 0.05); // Smooth transition

​

    var barX = (i - numBars / 2) * barWidth; // Center soundbars to the screen

    // Map the bar color based on its height

    var barColor = color(map(micLev, 0, 1, 100, 255), map(i, 0, numBars, 50, 255), map(micLev, 0, 1, 150, 255));

​

    fill(barColor);

    rect(barX, height - barHeights[i], barWidth - 2, barHeights[i]); // Soundbar position

  }

​

  // Switch to 3D mode for shapes

  push();

  translate(0, 0, -300); // Move the shapes back a bit

​

  // Dynamic lighting based on mic level

  pointLight(map(micLev, 0, 1, 255, 0), map(micLev, 0, 1, 0, 255), map(micLev, 0, 1, 255, 0), 0, 0, 500);

​

  // Draw rotating 3D shapes in the middle

  rotateX(frameCount * 0.01);

  rotateY(frameCount * 0.01);

​

  // Map micLev to color for shapes

  var shapeColor = color(map(micLev, 0, 1, 100, 255), map(micLev, 0, 1, 50, 150), map(micLev, 0, 1, 200, 255));

​

  // 3D Torus Shape that reacts to mic input

  push();

  rotateX(frameCount * 0.01);

  rotateY(frameCount * 0.02);

  var torusSize = micLev * 150 + 100; // Dynamic size based on sound input

  stroke(255, 255, 100);

  strokeWeight(2);

  noFill();

  torus(torusSize, torusSize / 3);

  pop();

​

  // 3D Pyramid that rotates and reacts to mic input

  push();

  rotateX(frameCount * 0.02);

  rotateY(frameCount * 0.03);

  var pyramidSize = micLev * 100 + 80;

  fill(shapeColor); // Use micLev to determine the color of the pyramid

  noStroke();

  beginShape();

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

    var angle = map(i, 0, 4, 0, TWO_PI);

    var x = cos(angle) * pyramidSize;

    var y = sin(angle) * pyramidSize;

    vertex(x, y, -pyramidSize / 2);

  }

  endShape(CLOSE);

  pop();

​

  // 3D Abstract Rotating Shape (a twisted cube-like structure)

  push();

  rotateX(frameCount * 0.01);

  rotateY(frameCount * 0.01);

  stroke(150, 255, 255, 200);

  noFill();

  var abstractSize = micLev * 120 + 80;

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

    push();

    rotateY(TWO_PI / 4 * i);

    rotateX(frameCount * 0.02);

    box(abstractSize);

    pop();

  }

  pop();

​

  // Draw a 3D polygon (dodecahedron-like) in the center

  push();

  rotateX(frameCount * 0.01);

  rotateY(frameCount * 0.01);

  stroke(255);

  noFill();

  beginShape();

  var points = [];

  for (var i = 0; i < 5; i++) {

    var angle = map(i, 0, 5, 0, TWO_PI);

    var x = cos(angle) * 100;

    var y = sin(angle) * 100;

    points.push(createVector(x, y, micLev * 100)); // Create 3D points based on micLev

  }

​

  // Connect the points to form a polygon shape

  for (var i = 0; i < points.length; i++) {

    var next = (i + 1) % points.length;

    line(points[i].x, points[i].y, points[i].z, points[next].x, points[next].y, points[next].z);

  }

  endShape(CLOSE);

  pop();

​

  // Add some more subtle 3D shapes (like rotating spheres)

  for (var i = 0; i < 3; i++) {

    push();

    var angle = map(i, 0, 3, 0, TWO_PI);

    var size = micLev * 100 + 50;

    var xOffset = cos(angle) * 300;

    var yOffset = sin(angle) * 300;

    var zOffset = cos(angle + PI / 2) * 300;

​

    translate(xOffset, yOffset, zOffset);

    fill(100, 200, 255, 150);

    noStroke();

    sphere(size); // 3D sphere

    pop();

  }

​

  // Draw the Soundwave in the center with dynamic color

  drawSoundwave(micLev, waveColor);

​

  pop(); // Restore original 2D canvas context

}

​

// Function to draw the soundwave

function drawSoundwave(level, waveColor) {

  push();

  translate(0, 0, 100); // Bring soundwave in front of the 3D objects

  stroke(waveColor);

  noFill();

  strokeWeight(3);

  var waveWidth = width * 0.8;

  var waveHeight = level * height * 2; // The height of the wave changes with mic input

  var waveSpeed = 0.05;

  beginShape();

  for (var x = -waveWidth / 2; x < waveWidth / 2; x++) {

    var y = sin(x * waveSpeed + frameCount * 0.05) * waveHeight;

    vertex(x, y);

  }

  endShape();

  pop();

}

​