add PBR (metallic-roughness) materials

Increasing access

most 3d models people find online, and everything exported from blender or downloaded from sketchfab as gltf, describe their materials in pbr terms. without it those models can be loaded but not shown the way they were made. supporting it means someone can pull a model off the internet and have it look right, instead of having to understand phong and rebuild the material by hand.

Most appropriate sub-area of p5.js?

• WebGL

Feature request details

follow up from the texture map work in #9066, #9067 and #9089.

p5's lighting is phong: a diffuse colour, a specular colour, and a shininess exponent. gltf 2.0 instead uses metallic-roughness as its core material model, so supporting pbr is really the prerequisite for a gltf loader (#9093, filed separately).

there's already a foothold. the shader carries a metalness input, and the renderer has _useMetalness, so the idea isn't foreign to the codebase. what's missing is roughness as a first class material property, the metallic-roughness texture map, and a lighting model that actually uses them.

rough shape of the work:

• add roughness alongside the existing metalness, as both a material setting and a map
• implement a metallic-roughness brdf in the phong shader, kept behind the same shader variant approach the texture maps use so sketches that don't use pbr aren't affected
• mirror it in webgpu, the same way the maps were mirrored
• decide how pbr and the existing specularMaterial() / shininess() coexist, most likely one or the other is active rather than both

worth doing before a gltf loader so models have somewhere to land.

Start with the existing phong shader's metalness input, the renderer's _useMetalness, and the texture-map work in #9066, #9067, and #9089. The work is done when roughness is supported as a material setting and map, the metallic-roughness BRDF works in the phong shader and is mirrored in WebGPU, and the interaction with specularMaterial() and shininess() is decided and implemented.