Add a uvs array property to SceneJS.Geometry to accept an array of UV arrays, so that we can have an unlimited number of UV layers.

API Changes

Deprecate uv, uv2 and uv3 properties and their accessors.
Add setUVs and getUVs accessors.

See constructor config changes in example below. Note that SceneJS.Texture nodes can still use the same applyTo values of uv, uv2, uv3 etc, where those will reference uvs sub-arrays.

When uv, uv2 or uv3 are supplied, the Geometry will internally convert those into a uvs property, which will be accessible via getUVs.

The existing getUV, getUV2, getUV3, setUV, setUV2 and setUV3 accessors will internally access subarrays of the uvs property.

UV attributes in shaders will be named SCENEJS_aUVCoord0, SCENEJS_aUVCoord1, SCENEJS_aUVCoord<n> for UV layers 0...n.

Example

{
  type: "texture",
  src: "textures/general-zod.jpg",

  nodes: [

    // Second texture layer is a color map that maps to the geometry's second UV array
    {
      type: "texture",
      src: "textures/general-zod.jpg",
      applyFrom: "uv2", // Apply to second set of UVs
      blendFactor: 0.5,
      wrapS: "repeat",
      wrapT: "repeat",
      blendMode: "add",

      nodes: [

        // Third texture layer is a color map that maps to the geometry's third UV array
        {
          type: "texture",
          src: "textures/general-zod.jpg",
          applyFrom: "uv3", // Apply to third set of UVs
          blendFactor: 0.3,
          wrapS: "repeat",
          wrapT: "repeat",
          blendMode: "add",

          nodes: [

            // Custom box geometry with two arrays of UV coordinates
            {
              type: "geometry",
              id: "myGeometry",
              primitive: "triangles",
              positions: [
                5, 5, 5, -5, 5, 5, -5, -5, 5, 5, -5, 5,
                5, 5, 5, 5, -5, 5, 5, -5, -5, 5, 5, -5,
                5, 5, 5, 5, 5, -5, -5, 5, -5, -5, 5, 5,
                -5, 5, 5, -5, 5, -5, -5, -5, -5, -5, -5, 5,
                -5, -5, -5, 5, -5, -5, 5, -5, 5, -5, -5, 5,
                5, -5, -5, -5, -5, -5, -5, 5, -5, 5, 5, -5
              ],

              normals: [
                0, 0, 1, 0, 0, 1, 0, 0, 1, 0, 0, 1,
                1, 0, 0, 1, 0, 0, 1, 0, 0, 1, 0, 0,
                0, 1, 0, 0, 1, 0, 0, 1, 0, 0, 1, 0,
                -1, 0, 0, -1, 0, 0, -1, 0, 0, -1, 0, 0,
                0, -1, 0, 0, -1, 0, 0, -1, 0, 0, -1, 0,
                0, 0, -1, 0, 0, -1, 0, 0, -1, 0, 0, -1
              ],

              uvs: [
                  // First UV array for first UV layer
                  [
                    1, 1, 0, 1, 0, 0, 1, 0, 0, 1, 0, 0, 1, 0, 1, 1,
                    1, 0, 1, 1, 0, 1, 0, 0, 1, 1, 0, 1, 0, 0, 1, 0,
                    0, 0, 1, 0, 1, 1, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1
                  ],

                  // Second UV array for second UV layer
                  [
                    3, 3, 0, 3, 0, 0, 3, 0, 0, 3, 0, 0, 3, 0, 3, 3,
                    3, 0, 3, 3, 0, 3, 0, 0, 3, 3, 0, 3, 0, 0, 3, 0,
                    0, 0, 3, 0, 3, 3, 0, 3, 0, 0, 3, 0, 3, 3, 0, 3
                  ],

                  // Third UV array for third UV layer
                  [
                    2, 2, 0, 2, 0, 0, 2, 0, 0, 2, 0, 0, 2, 0, 2, 2,
                    2, 0, 2, 2, 0, 2, 0, 0, 2, 2, 0, 2, 0, 0, 2, 0,
                    0, 0, 2, 0, 2, 2, 0, 2, 0, 0, 2, 0, 2, 2, 0, 2
                  ]
              ],

Accessor changes:

var uvs = geometry.getUVs(); // Returns 3D array
//...

geometry.setUVs([  // Sets a 3D array
       [.....], // Layer 1
       [.....], // Layer 2
       [.....], // Layer 3
       //....etc
]);

Internal changes

Add uvs property to Geometry render states.
Handle inheritance of UV layers within nested Geometry nodes in the scene node hierarchy (ie. for vertex sharing).
Shader composition in programSourceFactory will need to loop over uvs to create shader UV code blocks.
Shader composition also needs to be generalized here to allow unlimited UV layer indexing by Texture applyFrom.
Extend triangle picking logic to return an interpolated UV coordinate from each layer. For efficiency, possibly need to pass in a mask when picking to specify whether we want the UVs in the result, but then that would need to be applied for all pick result components, and changes API, so that needs discussion.
Change validation of SceneJS.Texture applyFrom to allow more UV indices than just uv, uv2, uv3 etc.

xeolabs / scenejs

Support unlimited number of UV layers #449

API Changes

Example

Internal changes