let R = 0, G = 0, B = 0;

let targetR = 0, targetG = 0, targetB = 0;

​

function setup() {

  createCanvas(640, 480);

  capture = createCapture(VIDEO);

  capture.size(width, height);

  capture.hide();

  frameRate(30);

}

​

function draw() {

  background(50);

  // 내가 보이는 화면 

  image(capture, 0, 0, width/4, height/4);

  // 비디오에서 색 추출 하기 

  let centerColor = capture.get(width/2, height/2);

  // 타겟 컬러 업데이트 

  targetR = red(centerColor);

  targetG = green(centerColor);

  targetB = blue(centerColor);

  // 부드럽게 색 전환 

  R = lerp(R, targetR, 0.1);

  G = lerp(G, targetG, 0.1);

  B = lerp(B, targetB, 0.1);

  // 선택된 색 보여주기 

  fill(R, G, B);

  noStroke();

  rect(width/4, 0, width/4, height/4);

  // LED 표시 

  drawLEDs();

}

​

function drawLEDs() {

  let totalValue = R + G + B;

  let rPercentage = R / totalValue;

  let gPercentage = G / totalValue;

  let bPercentage = B / totalValue;

  drawColorLEDs(rPercentage, width/4, height*2/3, color(255,0,0));

  drawColorLEDs(gPercentage, width/2, height*2/3, color(0,255,0));

  drawColorLEDs(bPercentage, width*3/4, height*2/3, color(0,0,255));

}

​

function drawColorLEDs(percentage, x, y, col) {

  let ledCount = 10;

  let ledSize = 20;

  let spacing = 10;

  let totalWidth = ledCount * (ledSize + spacing) - spacing;

  let litLEDs = Math.round(percentage * ledCount);

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

    let ledX = x - totalWidth / 2 + i * (ledSize + spacing);

    if (i < litLEDs) {

      fill(col);

    } else {

      fill(100);

    }

    noStroke();

    ellipse(ledX, y, ledSize);

  }

  // 퍼센트 표시

  fill(255);

  textAlign(CENTER, CENTER);

  textSize(16);

  text(nf(percentage * 100, 0, 1) + "%", x, y + ledSize + 20);

}

​