let song;
let fft;

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

function setup() {
  createCanvas(400, 400);
  colorMode(HSB, 255); // 3주차 HSB 색상
  fft = new p5.FFT();
}

function draw() {
  background(0);

  let spectrum = fft.analyze(); // 배열 (길이 1024)

  noStroke();
  for (let i = 0; i < spectrum.length; i++) {
    // 인덱스 → x 위치
    let x = map(i, 0, spectrum.length, 0, width);
    // 값(0~255) → 막대 높이
    let h = map(spectrum[i], 0, 255, 0, height);
    // 인덱스 → 색상 (저주파=빨강, 고주파=보라)
    fill(map(i, 0, spectrum.length, 0, 255), 255, 255);
    rect(x, height - h, width / spectrum.length, h);
  }
}

function mousePressed() {
  userStartAudio();
  song.loop();
}

function draw() {
  colorMode(RGB, 255); // 앞선 HSB 예제와 이어 작성할 때 색상 기준 복귀
  background(0);
  fft.analyze(); // 반드시 먼저 호출!

  let bass = fft.getEnergy("bass");       // 저음 (0~255)
  let mid = fft.getEnergy("mid");         // 중음 (0~255)
  let treble = fft.getEnergy("treble");   // 고음 (0~255)

  // 저음 → 빨간 원
  let bassSize = map(bass, 0, 255, 10, 200);
  fill(255, 0, 0);
  noStroke();
  ellipse(100, height / 2, bassSize, bassSize);

  // 중음 → 초록 사각형
  let midSize = map(mid, 0, 255, 10, 150);
  fill(0, 255, 0);
  rectMode(CENTER);
  rect(200, height / 2, midSize, midSize);

  // 고음 → 파란 삼각형
  let trebleSize = map(treble, 0, 255, 10, 100);
  fill(0, 0, 255);
  triangle(
    300, height / 2 - trebleSize / 2,
    300 - trebleSize / 2, height / 2 + trebleSize / 2,
    300 + trebleSize / 2, height / 2 + trebleSize / 2
  );
}

let img;

function preload() {
  img = loadImage('assets/photo.jpg');
}

function setup() {
  createCanvas(400, 400);
}

function draw() {
  image(img, 0, 0, width, height);
}

function draw() {
  tint(255, 0, 0);     // 빨간 틴트
  image(img, 0, 0, width, height);
}

function draw() {
  tint(255, 128);      // 반투명 (알파값)
  image(img, 0, 0, width, height);
}

let song, amp, img;

function preload() {
  song = loadSound('assets/music.mp3');
  img = loadImage('assets/photo.jpg');
}

function setup() {
  createCanvas(400, 400);
  amp = new p5.Amplitude();
}

function draw() {
  background(0);

  let level = amp.getLevel();
  let s = map(level, 0, 1, 100, 400);
  let alpha = map(level, 0, 1, 100, 255);

  tint(255, alpha);
  image(img, width / 2 - s / 2, height / 2 - s / 2, s, s);
}

function mousePressed() {
  userStartAudio();
  song.loop();
}

let video;

function setup() {
  createCanvas(400, 400);
  video = createCapture(VIDEO);
  video.size(400, 400);
  video.hide(); // 캔버스 밑에 별도로 표시되는 HTML 요소 숨기기
}

function draw() {
  image(video, 0, 0, width, height);
}

function draw() {
  image(video, 0, 0, width, height);

  let level = amp.getLevel();
  let size = map(level, 0, 1, 0, 300);

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

class Emitter {
  // ... 13주차와 동일: constructor, addParticle ...

  // 13주차 run()에서 this.addParticle() 자동 호출만 제거
  run() {
    for (let i = this.particles.length - 1; i >= 0; i--) {
      this.particles[i].update();
      this.particles[i].display();
      if (this.particles[i].isDead()) {
        this.particles.splice(i, 1);
      }
    }
  }
}

let song, amp, emitter;

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

function setup() {
  createCanvas(640, 360);
  amp = new p5.Amplitude();
  emitter = new Emitter(width / 2, height / 2);
}

function draw() {
  background(0, 25); // 잔상 효과

  let level = amp.getLevel();
  let count = floor(map(level, 0, 0.5, 0, 10)); // 음량 비례 방출량

  for (let i = 0; i < count; i++) {
    emitter.addParticle();
  }

  emitter.run();
}

function mousePressed() {
  userStartAudio();
  song.loop();
}