Merge branch 'dev' into master

pixiv · Sep 17, 2020 · 50492d3 · 50492d3
2 parents b7a0915 + 5f8471b
commit 50492d3
Show file tree

Hide file tree

Showing 19 changed files with 116 additions and 247 deletions.
diff --git a/examples/animations.html b/examples/animations.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/basic.html b/examples/basic.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/blendshapes.html b/examples/blendshapes.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/bones.html b/examples/bones.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/debug.html b/examples/debug.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/dnd.html b/examples/dnd.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/encoding.html b/examples/encoding.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/envmap.html b/examples/envmap.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/firstperson.html b/examples/firstperson.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/lookat-advanced.html b/examples/lookat-advanced.html
@@ -21,9 +21,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			const _v3A = new THREE.Vector3();

diff --git a/examples/lookat.html b/examples/lookat.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/materials-debug.html b/examples/materials-debug.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/meta.html b/examples/meta.html
@@ -30,9 +30,9 @@
 	<body>
 		<span id="meta"></span>
 		<img id="thumbnail" alt="thumbnail" />
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/examples/mouse.html b/examples/mouse.html
@@ -19,9 +19,9 @@
 	</head>
 
 	<body>
-		<script src="https://unpkg.com/three@0.118.3/build/three.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/loaders/GLTFLoader.js"></script>
-		<script src="https://unpkg.com/three@0.118.3/examples/js/controls/OrbitControls.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/build/three.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/loaders/GLTFLoader.js"></script>
+		<script src="https://unpkg.com/three@0.120.1/examples/js/controls/OrbitControls.js"></script>
 		<script src="../lib/three-vrm.js"></script>
 		<script>
 			// renderer

diff --git a/package.json b/package.json
@@ -76,7 +76,7 @@
     "quicktype": "^15.0.199",
     "raw-loader": "^4.0.1",
     "rimraf": "^3.0.0",
-    "three": "^0.118.3",
+    "three": "^0.120.1",
     "ts-loader": "^6.1.0",
     "ts-node": "^8.4.1",
     "typedoc": "^0.17.7",
@@ -88,6 +88,6 @@
     "worker-loader": "^2.0.0"
   },
   "peerDependencies": {
-    "three": "^0.118.3"
+    "three": "^0.120.1"
   }
 }
diff --git a/src/vrm/springbone/VRMSpringBone.ts b/src/vrm/springbone/VRMSpringBone.ts
@@ -1,7 +1,7 @@
 import * as THREE from 'three';
 import { getWorldQuaternionLite } from '../utils/math';
+import { Matrix4InverseCache } from '../utils/Matrix4InverseCache';
 import { VRMSpringBoneColliderMesh } from './VRMSpringBoneColliderGroup';
-import { Matrix4WithInverseCache } from '../utils/Matrix4WithInverseCache';
 import { VRMSpringBoneParameters } from './VRMSpringBoneParameters';
 // based on
 // http://rocketjump.skr.jp/unity3d/109/
@@ -110,21 +110,20 @@ export class VRMSpringBone {
     this._prevTail.applyMatrix4(_matA);
     this._nextTail.applyMatrix4(_matA);
 
-    // change `matrixWorld` back to an ordinary Matrix4
-    if (this._center) {
-      const newMatrix = new THREE.Matrix4();
-      newMatrix.copy(this._center.matrixWorld);
-      this._center.matrixWorld = newMatrix;
+    // uninstall inverse cache
+    if (this._center?.userData.inverseCacheProxy) {
+      (this._center.userData.inverseCacheProxy as Matrix4InverseCache).revert();
+      delete this._center.userData.inverseCacheProxy;
     }
 
     // change the center
     this._center = center;
 
-    // HACK: replacing `matrixWorld` of the center with a Matrix4 that has a cache of inverse (wow)
+    // install inverse cache
     if (this._center) {
-      const newMatrix = new Matrix4WithInverseCache();
-      newMatrix.copy(this._center.matrixWorld);
-      this._center.matrixWorld = newMatrix;
+      if (!this._center.userData.inverseCacheProxy) {
+        this._center.userData.inverseCacheProxy = new Matrix4InverseCache(this._center.matrixWorld);
+      }
     }
 
     // convert tails to center space
@@ -372,7 +371,7 @@ export class VRMSpringBone {
    */
   private _getMatrixWorldToCenter(target: THREE.Matrix4): THREE.Matrix4 {
     if (this._center) {
-      target.copy((this._center.matrixWorld as Matrix4WithInverseCache).inverse);
+      target.copy((this._center.userData.inverseCacheProxy as Matrix4InverseCache).inverse);
     } else {
       target.identity();
     }

diff --git a/src/vrm/utils/Matrix4InverseCache.ts b/src/vrm/utils/Matrix4InverseCache.ts
@@ -0,0 +1,58 @@
+import * as THREE from 'three';
+
+export class Matrix4InverseCache {
+  /**
+   * The target matrix.
+   */
+  public readonly matrix: THREE.Matrix4;
+
+  /**
+   * A cache of inverse of current matrix.
+   */
+  private readonly _inverseCache = new THREE.Matrix4();
+
+  /**
+   * A flag that makes it want to recalculate its {@link _inverseCache}.
+   * Will be set `true` when `elements` are mutated and be used in `getInverse`.
+   */
+  private _shouldUpdateInverse = true;
+
+  /**
+   * The original of `matrix.elements`
+   */
+  private readonly _originalElements: number[];
+
+  /**
+   * Inverse of given matrix.
+   * Note that it will return its internal private instance.
+   * Make sure copying this before mutate this.
+   */
+  public get inverse(): THREE.Matrix4 {
+    if (this._shouldUpdateInverse) {
+      this._inverseCache.getInverse(this.matrix);
+      this._shouldUpdateInverse = false;
+    }
+
+    return this._inverseCache;
+  }
+
+  public constructor(matrix: THREE.Matrix4) {
+    this.matrix = matrix;
+
+    const handler: ProxyHandler<number[]> = {
+      set: (obj, prop: number, newVal) => {
+        this._shouldUpdateInverse = true;
+        obj[prop] = newVal;
+
+        return true;
+      },
+    };
+
+    this._originalElements = matrix.elements;
+    matrix.elements = new Proxy(matrix.elements, handler);
+  }
+
+  public revert(): void {
+    this.matrix.elements = this._originalElements;
+  }
+}