Add specular-glossiness workflow and some gui for tweaking values

[bghgary]

This change provides an example of the specular-glossiness workflow and make it easy to see how the shaders calculation differ between the two. It also adds dat.gui for tweaking some properties on the fly.

Changing between metallic-roughness and specular-glossiness workflow makes no difference to the rendered result. The difference is in the underlying parameters being passed to the shader and how the math is calculated.

The following parameters were added:
workflow (switches between specular-glossiness and metallic-roughness)
albedo
opacity
reflectivity (0.16 * reflectivity^2 = dielectric f0 value) (see mrdoob/three.js#8505 (comment))

The current PBR proposal does not include reflectivity, but this comment (KhronosGroup#696 (comment)) seems to indicate that we want to add this.

See here for a live view: https://bghgary.github.io/glTF/add-specular-glossiness-workflow/

[mlimper]

Thanks a lot for this PR!

The reflectivity, or in general a way to use different F0 values, is something that was already requested at some point. For now, I think it is awesome to have things like this in the example, so everybody can check what these values mean. The discussion will greatly benefit from this.

Just one question:

If a reflectivity value different than zero is used, the result changes between the two workflows. Is this intended?

[bghgary]

No, this is not intended. I will take a look.

Update: Found it. Thanks for catching this! 👍

[mlimper]

Thanks! :-)