Genuary 21: Loop Picker - OpenProcessing

mySketch
xxxxxxxxxx
 
let fbo
let objects = []
let selected = null
let dirty = true
​
function setup() {
  createCanvas(windowWidth, windowHeight, WEBGL)
  fbo = createFramebuffer({ density: 1, antialias: false, format: FLOAT })
  
  colorMode(HSB, 100)
  for (let i = 0; i < 200; i++) {
    objects.push({
      x: random(-1, 1) * width,
      y: random(-1, 1) * height,
      z: random(-2, 0.5) * width,
      rx: random(TWO_PI),
      ry: random(TWO_PI),
      color: color(random(100), 100, 80),
      id: [floor(random(255)), floor(random(255)), floor(random(255))],
    })
  }
  colorMode(RGB, 255)
}
​
function drawScene(pick) {
  push()
  if (!pick) {
    lights()
    specularMaterial(255)
    shininess(200)
  }
  noStroke()
  
  for (const [i, obj] of objects.entries()) {
    push()
    fill(...(pick ? obj.id : [selected === obj ? 0 : obj.color]))
    if (!pick && selected === obj) {
      emissiveMaterial(255, 0, 255)
    }
    translate(obj.x, obj.y, obj.z)
    rotateX(obj.rx)
    rotateY(obj.ry)
    torus(100, 20)
    pop()
  }
  pop()
}
​
function mouseMoved() {
  dirty = true
}
​
function draw() {
  if (dirty) {
    fbo.draw(() => {
      push()
      background(0)
      drawScene(true)
      pop()
    })
    const selectedId = fbo.get(floor(mouseX), floor(mouseY)).map(i => round(i*255))
    selected = objects.find((obj) => {
      for (let i = 0; i < 3; i++) {
        if (selectedId[i] !== obj.id[i]) return false
      }
      return true
    })
    dirty = false
  }
  
  background(0)
  drawScene()
}