feat: make boneMatrix 4x3 from 4x4

samples/test_e2e/GltfImporter-skinning-mat44/main.ts

@@ -5,7 +5,7 @@ declare const window: any;
 const p = document.createElement('p');
 document.body.appendChild(p);
 
-Rn.Config.boneDataType = Rn.BoneDataType.Mat44x1;
+Rn.Config.boneDataType = Rn.BoneDataType.Mat43x1;
 Rn.Config.maxSkeletalBoneNumber = 2;
 await Rn.System.init({
   approach: Rn.ProcessApproach.Uniform,

src/foundation/components/Skeletal/SkeletalComponent.ts

@@ -63,7 +63,7 @@ export class SkeletalComponent extends Component {
     }
 
     if (SkeletalComponent.__tookGlobalDataNum < Config.maxSkeletonNumber) {
-      if (Config.boneDataType === BoneDataType.Mat44x1) {
+      if (Config.boneDataType === BoneDataType.Mat43x1) {
         SkeletalComponent.__globalDataRepository.takeOne(ShaderSemantics.BoneMatrix);
       } else if (Config.boneDataType === BoneDataType.Vec4x2) {
         SkeletalComponent.__globalDataRepository.takeOne(ShaderSemantics.BoneTranslatePackedQuat);
@@ -101,7 +101,7 @@ export class SkeletalComponent extends Component {
     if (this.componentSID < Config.maxSkeletonNumber) {
       index = this.componentSID;
     }
-    if (Config.boneDataType === BoneDataType.Mat44x1) {
+    if (Config.boneDataType === BoneDataType.Mat43x1) {
       this.__matArray = SkeletalComponent.__globalDataRepository.getValue(
         ShaderSemantics.BoneMatrix,
         index
@@ -228,13 +228,13 @@ export class SkeletalComponent extends Component {
       this.__isWorldMatrixVanilla = false;
 
       if (
-        Config.boneDataType === BoneDataType.Mat44x1 ||
+        Config.boneDataType === BoneDataType.Mat43x1 ||
         Config.boneDataType === BoneDataType.Vec4x1
       ) {
         this.__copyToMatArray(m, i);
       }
 
-      if (Config.boneDataType !== BoneDataType.Mat44x1) {
+      if (Config.boneDataType !== BoneDataType.Mat43x1) {
         const scaleVec = SkeletalComponent.__tmpVec3_0.setComponents(
           Math.hypot(m.m00, m.m01, m.m02),
           Math.hypot(m.m10, m.m11, m.m12),
@@ -369,22 +369,23 @@ export class SkeletalComponent extends Component {
   }
 
   private __copyToMatArray(m: IMatrix44, i: Index) {
-    this.__matArray[i * 16 + 0] = m._v[0];
-    this.__matArray[i * 16 + 1] = m._v[1];
-    this.__matArray[i * 16 + 2] = m._v[2];
-    this.__matArray[i * 16 + 3] = m._v[3];
-    this.__matArray[i * 16 + 4] = m._v[4];
-    this.__matArray[i * 16 + 5] = m._v[5];
-    this.__matArray[i * 16 + 6] = m._v[6];
-    this.__matArray[i * 16 + 7] = m._v[7];
-    this.__matArray[i * 16 + 8] = m._v[8];
-    this.__matArray[i * 16 + 9] = m._v[9];
-    this.__matArray[i * 16 + 10] = m._v[10];
-    this.__matArray[i * 16 + 11] = m._v[11];
-    this.__matArray[i * 16 + 12] = m._v[12];
-    this.__matArray[i * 16 + 13] = m._v[13];
-    this.__matArray[i * 16 + 14] = m._v[14];
-    this.__matArray[i * 16 + 15] = m._v[15];
+    // 0  1  2  3
+    // 4  5  6  7
+    // 8  9  10 11
+    // 12 13 14 15
+
+    this.__matArray[i * 12 + 0] = m._v[0];
+    this.__matArray[i * 12 + 1] = m._v[1];
+    this.__matArray[i * 12 + 2] = m._v[2];
+    this.__matArray[i * 12 + 3] = m._v[4];
+    this.__matArray[i * 12 + 4] = m._v[5];
+    this.__matArray[i * 12 + 5] = m._v[6];
+    this.__matArray[i * 12 + 6] = m._v[8];
+    this.__matArray[i * 12 + 7] = m._v[9];
+    this.__matArray[i * 12 + 8] = m._v[10];
+    this.__matArray[i * 12 + 9] = m._v[12];
+    this.__matArray[i * 12 + 10] = m._v[13];
+    this.__matArray[i * 12 + 11] = m._v[14];
   }
 
   public getInverseBindMatricesAccessor(): Accessor | undefined {

src/foundation/core/Config.ts

@@ -15,7 +15,7 @@ let maxSkeletalBoneNumber = 300;
 let maxSkeletalBoneNumberForUniformMode = 50; // For Uniform Mode
 let dataTextureWidth = Math.pow(2, 12);
 let dataTextureHeight = Math.pow(2, 12);
-let boneDataType = BoneDataType.Mat44x1;
+let boneDataType = BoneDataType.Mat43x1;
 let noWebGLTex2DStateCache = false;
 let maxMorphTargetNumber = 4;
 let totalSizeOfGPUShaderDataStorageExceptMorphData = 0;

src/foundation/core/GlobalDataRepository.ts

@@ -111,7 +111,7 @@ export class GlobalDataRepository {
     // Skinning
     const boneMatrixInfo = {
       semantic: ShaderSemantics.BoneMatrix,
-      compositionType: CompositionType.Mat4Array,
+      compositionType: CompositionType.Mat4x3Array,
       arrayLength: maxSkeletalBoneNumber,
       componentType: ComponentType.Float,
       stage: ShaderType.VertexShader,
@@ -210,7 +210,7 @@ export class GlobalDataRepository {
       updateInterval: ShaderVariableUpdateInterval.EveryTime,
       initialValue: Scalar.fromCopyNumber(-1),
     };
-    if (Config.boneDataType === BoneDataType.Mat44x1) {
+    if (Config.boneDataType === BoneDataType.Mat43x1) {
       this.__registerProperty(boneMatrixInfo, Config.maxSkeletonNumber);
     } else if (Config.boneDataType === BoneDataType.Vec4x2) {
       this.__registerProperty(boneTranslatePackedQuatInfo, Config.maxSkeletonNumber);

src/foundation/definitions/BoneDataType.ts

@@ -8,9 +8,9 @@ class BoneDataTypeClass extends EnumClass implements BoneDataTypeEnum {
   }
 }
 
-const Mat44x1: BoneDataTypeEnum = new BoneDataTypeClass({
+const Mat43x1: BoneDataTypeEnum = new BoneDataTypeClass({
   index: 0,
-  str: 'Mat44x1',
+  str: 'Mat43x1',
 });
 const Vec4x2: BoneDataTypeEnum = new BoneDataTypeClass({
   index: 1,
@@ -25,7 +25,7 @@ const Vec4x1: BoneDataTypeEnum = new BoneDataTypeClass({
   str: 'Vec4x1',
 });
 
-const typeList = [Mat44x1, Vec4x2, Vec4x1];
+const typeList = [Mat43x1, Vec4x2, Vec4x1];
 
 function from(index: number): BoneDataTypeEnum {
   return _from({ typeList, index }) as BoneDataTypeEnum;
@@ -36,7 +36,7 @@ function fromString(str: string): BoneDataTypeEnum {
 }
 
 export const BoneDataType = Object.freeze({
-  Mat44x1,
+  Mat43x1,
   Vec4x2,
   Vec4x2Old,
   Vec4x1,

src/foundation/definitions/CompositionType.ts

@@ -304,6 +304,15 @@ const Texture2DRect: CompositionTypeEnum = new CompositionTypeClass({
   numberOfComponents: 1,
   vec4SizeOfProperty: 1,
 });
+const Mat4x3Array: CompositionTypeEnum = new CompositionTypeClass({
+  index: 18,
+  str: 'MAT4x3_ARRAY',
+  glslStr: 'mat4x3',
+  hlslStr: 'float4x3',
+  numberOfComponents: 12,
+  vec4SizeOfProperty: 3,
+  isArray: true,
+});
 
 const typeList = [
   Unknown,
@@ -325,6 +334,7 @@ const typeList = [
   Texture2DShadow,
   Texture2DRect,
   TextureCube,
+  Mat4x3Array,
 ];
 
 export type VectorCompositionTypes = typeof Scalar | typeof Vec2 | typeof Vec3 | typeof Vec4;
@@ -486,6 +496,7 @@ function isArray(compositionType: CompositionTypeEnum) {
     compositionType === Vec2Array ||
     compositionType === Vec3Array ||
     compositionType === Vec4Array ||
+    compositionType === Mat4x3Array ||
     compositionType === Mat4Array ||
     compositionType === Mat3Array ||
     compositionType === Mat2Array
@@ -529,6 +540,7 @@ export const CompositionType = Object.freeze({
   Texture2DShadow,
   TextureCube,
   Texture2DRect,
+  Mat4x3Array,
   from,
   fromString,
   vectorFrom,

src/foundation/definitions/ShaderSemantics.ts

@@ -652,6 +652,7 @@ const getShaderProperty: getShaderPropertyFunc = (
         `;
     }
   } else {
+    // is Not Array
     str += `return u_${variableName};`;
   }
 

src/foundation/materials/core/AbstractMaterialContent.ts

@@ -380,9 +380,9 @@ export abstract class AbstractMaterialContent extends RnObject {
     }
     if (skeletalComponent) {
       if (setUniform) {
-        if (Config.boneDataType === BoneDataType.Mat44x1) {
+        if (Config.boneDataType === BoneDataType.Mat43x1) {
           const jointMatricesArray = skeletalComponent.jointMatricesArray;
-          (shaderProgram as any)._gl.uniformMatrix4fv(
+          (shaderProgram as any)._gl.uniformMatrix4x3fv(
             (shaderProgram as any).boneMatrix,
             false,
             jointMatricesArray

src/foundation/materials/core/ShaderHandler.ts

@@ -192,7 +192,7 @@ export function _setupGlobalShaderDefinition(materialTypeName: string) {
   if (glw.isWebGL2 || glw.webgl1ExtDRV) {
     definitions += '#define RN_IS_SUPPORTING_STANDARD_DERIVATIVES\n';
   }
-  if (Config.boneDataType === BoneDataType.Mat44x1) {
+  if (Config.boneDataType === BoneDataType.Mat43x1) {
     definitions += '#define RN_BONE_DATA_TYPE_Mat44x1\n';
   } else if (Config.boneDataType === BoneDataType.Vec4x2) {
     definitions += '#define RN_BONE_DATA_TYPE_VEC4X2\n';

src/webgl/WebGLStrategyDataTexture.ts

@@ -322,6 +322,9 @@ ${returnType} get_${methodName}(highp float _instanceId, const int idxOfArray) {
         case CompositionType.Mat2Array:
           str += '        mat2 val = fetchMat2No16BytesAligned(scalar_idx);\n';
           break;
+        case CompositionType.Mat4x3Array:
+          str += '        mat4x3 val = fetchMat4x3(vec4_idx);\n';
+          break;
         default:
           // console.error('unknown composition type', info.compositionType.str, memberName);
           str += '';

src/webgl/shaderity_shaders/common/getSkinMatrix.glsl

@@ -69,10 +69,10 @@ highp vec4 unpackedVec2ToNormalizedVec4(highp vec2 vec_xy, highp float criteria)
 mat4 getSkinMatrix(float skeletalComponentSID) {
 
 #ifdef RN_BONE_DATA_TYPE_Mat44x1
-  mat4 skinMat = a_weight.x * get_boneMatrix(skeletalComponentSID, int(a_joint.x));
-  skinMat += a_weight.y * get_boneMatrix(skeletalComponentSID, int(a_joint.y));
-  skinMat += a_weight.z * get_boneMatrix(skeletalComponentSID, int(a_joint.z));
-  skinMat += a_weight.w * get_boneMatrix(skeletalComponentSID, int(a_joint.w));
+  mat4 skinMat = a_weight.x * mat4(get_boneMatrix(skeletalComponentSID, int(a_joint.x)));
+  skinMat += a_weight.y * mat4(get_boneMatrix(skeletalComponentSID, int(a_joint.y)));
+  skinMat += a_weight.z * mat4(get_boneMatrix(skeletalComponentSID, int(a_joint.z)));
+  skinMat += a_weight.w * mat4(get_boneMatrix(skeletalComponentSID, int(a_joint.w)));
 
 #elif defined(RN_BONE_DATA_TYPE_VEC4X2)
   vec2 criteria = vec2(4096.0, 4096.0);

src/webgl/shaderity_shaders/common/prerequisites.glsl

@@ -279,6 +279,18 @@ mat4 fetchMat4(int vec4_idx) {
   return val;
 }
 
+mat4x3 fetchMat4x3(int vec4_idx) {
+  vec4 col0 = fetchElement(vec4_idx);
+  vec4 col1 = fetchElement(vec4_idx + 1);
+  vec4 col2 = fetchElement(vec4_idx + 2);
+
+  mat4x3 val = mat4x3(
+    col0.x, col0.y, col0.z, col0.w,
+    col1.x, col1.y, col1.z, col1.w,
+    col2.x, col2.y, col2.z, col2.w);
+  return val;
+}
+
 float rand(const vec2 co){
   return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);
 }