let refract
let bg
let amount
function setup() {
  createCanvas(windowWidth, windowHeight, WEBGL)
  amount = createSlider(0, 100, 50, 0.1)
  bg = createFramebuffer()
  refract = buildMaterialShader(() => {
    const bgTex =
      uniformTexture(() => bg)
    const bgSize =
      uniformVec2(() => [bg.width, bg.height])
    const refractDist =
      uniformFloat(() => amount.value() / 800)
    let position = sharedVec3()
    let normal = sharedVec3()
    
    cameraInputs.begin()
    position = cameraInputs.position
    normal = cameraInputs.normal
    cameraInputs.end()
    
    finalColor.begin()
    let toSurface = -normalize(position)
    let reflected = reflect(
      toSurface,
      normalize(normal)
    )
    let coord = position.xy / bgSize + 0.5
    coord += reflected.xy * refractDist
    finalColor.set(getTexture(bgTex, coord))
    finalColor.end()
  })
}
function draw() {
  clear()
  bg.draw(() => {
    clear()
    drawParentToCanvas()
  })
  push()
  noStroke()
  shader(refract)
  sphere(min(width, height) * 0.45)
  pop()
}