사운드와 인터랙션

let song;
let fft;
let amplitude;

function preload() {
  song = loadSound('music.mp3');
}

function setup() {
  createCanvas(800, 600);

  // FFT 분석기 (주파수 분석)
  fft = new p5.FFT(0.8, 128); // smoothing, bins

  // 진폭 분석기
  amplitude = new p5.Amplitude();
}

function draw() {
  background(10);

  // 주파수 스펙트럼 시각화
  let spectrum = fft.analyze();
  noStroke();

  for (let i = 0; i < spectrum.length; i++) {
    let x = map(i, 0, spectrum.length, 0, width);
    let h = map(spectrum[i], 0, 255, 0, height);

    colorMode(HSB, 360, 100, 100);
    fill(map(i, 0, spectrum.length, 0, 360), 80, 90);
    rect(x, height - h, width / spectrum.length, h);
  }

  // 전체 볼륨 표시
  let vol = amplitude.getLevel();
  fill(255);
  ellipse(width / 2, height / 2, vol * 500);
}

function mousePressed() {
  if (song.isPlaying()) {
    song.pause();
  } else {
    song.play();
  }
}

let mic;
let osc;

function setup() {
  createCanvas(800, 600);

  // 마이크 입력
  mic = new p5.AudioIn();
  mic.start();

  // 오실레이터 (사인파 생성)
  osc = new p5.Oscillator('sine');
  osc.freq(440); // 주파수 440Hz (라 음)
  osc.amp(0);    // 초기 볼륨 0
  osc.start();
}

function draw() {
  background(10, 20, 30);

  // 마이크 볼륨 시각화
  let vol = mic.getLevel();
  let size = map(vol, 0, 1, 10, 400);

  noStroke();
  fill(100, 200, 255, 200);
  ellipse(width / 2, height / 2, size);

  // 마이크 파형 시각화
  stroke(255, 100, 150);
  noFill();
  beginShape();
  let waveform = fft.waveform();
  for (let i = 0; i < waveform.length; i++) {
    let x = map(i, 0, waveform.length, 0, width);
    let y = map(waveform[i], -1, 1, 0, height);
    vertex(x, y);
  }
  endShape();
}

// 마우스 Y 위치로 오실레이터 주파수 제어
function mouseMoved() {
  let freq = map(mouseY, 0, height, 880, 110);
  osc.freq(freq);
}

function mousePressed() {
  osc.amp(0.3, 0.05); // 볼륨 올리기
}

function mouseReleased() {
  osc.amp(0, 0.5); // 볼륨 내리기
}