⬆️(orbit-controls): update to work with latest aframe 1.4.1

supermedium · Mar 23, 2023 · cca1a0e · cca1a0e
1 parent aa53e5e
commit cca1a0e
Show file tree

Hide file tree

Showing 7 changed files with 29 additions and 19 deletions.
diff --git a/components/orbit-controls/README.md b/components/orbit-controls/README.md
@@ -60,15 +60,25 @@ Install and use by directly including the [browser files](dist):
 ```html
 <head>
   <title>My A-Frame Scene</title>
-  <script src="https://aframe.io/releases/0.9.0/aframe.min.js"></script>
-  <script src="https://unpkg.com/[email protected]/dist/aframe-orbit-controls.min.js"></script>
-  <script src="https://unpkg.com/[email protected]/dist/aframe-supercraft-loader.js"></script>
+  <script src="https://aframe.io/releases/1.4.1/aframe.min.js"></script>
+  <script src="https://unpkg.com/aframe-orbit-controls/dist/aframe-orbit-controls.min.js"></script>
 </head>
 
 <body>
   <a-scene>
-    <a-entity supercraft-loader="name: icky-snake"></a-entity>
-    <a-entity camera look-controls orbit-controls="target: 0 1.6 -0.5; minDistance: 0.5; maxDistance: 180; initialPosition: 0 5 15"></a-entity>
+    <a-torus-knot
+      color="#B84A39"
+      arc="180"
+      p="2"
+      q="7"
+      radius="5"
+      radius-tubular="0.1"
+    ></a-torus-knot>
+    <a-entity
+      camera
+      look-controls
+      orbit-controls="target: 0 1.6 -0.5; minDistance: 0.5; maxDistance: 180; initialPosition: 0 5 15"
+    ></a-entity>
   </a-scene>
 </body>
 ```

diff --git a/components/orbit-controls/dist/aframe-orbit-controls.js b/components/orbit-controls/dist/aframe-orbit-controls.js
@@ -198,7 +198,7 @@ THREE.OrbitControls = function ( object, domElement ) {
 
 		// so camera.up is the orbit axis
 		var quat = new THREE.Quaternion().setFromUnitVectors( object.up, new THREE.Vector3( 0, 1, 0 ) );
-		var quatInverse = quat.clone().inverse();
+		var quatInverse = quat.clone().invert();
 
 		var lastPosition = new THREE.Vector3();
 		var lastQuaternion = new THREE.Quaternion();
@@ -1229,12 +1229,12 @@ AFRAME.registerComponent('orbit-controls', {
     controls.enableRotate = data.enableRotate;
     controls.enableZoom = data.enableZoom;
     controls.keyPanSpeed = data.keyPanSpeed;
-    controls.maxPolarAngle = THREE.Math.degToRad(data.maxPolarAngle);
-    controls.maxAzimuthAngle = THREE.Math.degToRad(data.maxAzimuthAngle);
+    controls.maxPolarAngle = THREE.MathUtils.degToRad(data.maxPolarAngle);
+    controls.maxAzimuthAngle = THREE.MathUtils.degToRad(data.maxAzimuthAngle);
     controls.maxDistance = data.maxDistance;
     controls.minDistance = data.minDistance;
-    controls.minPolarAngle = THREE.Math.degToRad(data.minPolarAngle);
-    controls.minAzimuthAngle = THREE.Math.degToRad(data.minAzimuthAngle);
+    controls.minPolarAngle = THREE.MathUtils.degToRad(data.minPolarAngle);
+    controls.minAzimuthAngle = THREE.MathUtils.degToRad(data.minAzimuthAngle);
     controls.minZoom = data.minZoom;
     controls.panSpeed = data.panSpeed;
     controls.rotateSpeed = data.rotateSpeed;

diff --git a/components/orbit-controls/dist/aframe-orbit-controls.min.js b/components/orbit-controls/dist/aframe-orbit-controls.min.js
diff --git a/components/orbit-controls/examples/basic/index.html b/components/orbit-controls/examples/basic/index.html
@@ -4,13 +4,13 @@
     <meta charset="utf-8">
     <title>A-Frame Orbit Controls Component - Basic</title>
     <meta name="description" content="Basic example for A-Frame Orbit Controls component."></meta>
-    <script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
+    <script src="https://aframe.io/releases/1.4.1/aframe.min.js"></script>
     <script src="../../dist/aframe-orbit-controls.min.js"></script>
     <script src="https://unpkg.com/[email protected]/dist/aframe-supercraft-loader.js"></script>
   </head>
   <body>
     <a-scene>
-      <a-entity supercraft-loader="name: icky-snake"></a-entity>
+      <a-torus-knot color="#B84A39" arc="180" p="2" q="7" radius="5" radius-tubular="0.1"></a-torus-knot>
       <a-entity camera look-controls="enabled: false" orbit-controls="target: 0 1.6 -0.5; minDistance: 0.5; maxDistance: 180; initialPosition: 0 15 20"></a-entity>
     </a-scene>
 

diff --git a/components/orbit-controls/index.js b/components/orbit-controls/index.js
@@ -110,12 +110,12 @@ AFRAME.registerComponent('orbit-controls', {
     controls.enableRotate = data.enableRotate;
     controls.enableZoom = data.enableZoom;
     controls.keyPanSpeed = data.keyPanSpeed;
-    controls.maxPolarAngle = THREE.Math.degToRad(data.maxPolarAngle);
-    controls.maxAzimuthAngle = THREE.Math.degToRad(data.maxAzimuthAngle);
+    controls.maxPolarAngle = THREE.MathUtils.degToRad(data.maxPolarAngle);
+    controls.maxAzimuthAngle = THREE.MathUtils.degToRad(data.maxAzimuthAngle);
     controls.maxDistance = data.maxDistance;
     controls.minDistance = data.minDistance;
-    controls.minPolarAngle = THREE.Math.degToRad(data.minPolarAngle);
-    controls.minAzimuthAngle = THREE.Math.degToRad(data.minAzimuthAngle);
+    controls.minPolarAngle = THREE.MathUtils.degToRad(data.minPolarAngle);
+    controls.minAzimuthAngle = THREE.MathUtils.degToRad(data.minAzimuthAngle);
     controls.minZoom = data.minZoom;
     controls.panSpeed = data.panSpeed;
     controls.rotateSpeed = data.rotateSpeed;

diff --git a/components/orbit-controls/lib/OrbitControls.js b/components/orbit-controls/lib/OrbitControls.js
@@ -126,7 +126,7 @@ THREE.OrbitControls = function ( object, domElement ) {
 
 		// so camera.up is the orbit axis
 		var quat = new THREE.Quaternion().setFromUnitVectors( object.up, new THREE.Vector3( 0, 1, 0 ) );
-		var quatInverse = quat.clone().inverse();
+		var quatInverse = quat.clone().invert();
 
 		var lastPosition = new THREE.Vector3();
 		var lastQuaternion = new THREE.Quaternion();

diff --git a/components/orbit-controls/package.json b/components/orbit-controls/package.json
@@ -1,6 +1,6 @@
 {
   "name": "aframe-orbit-controls",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "description": "Orbit controls for A-Frame.",
   "main": "index.js",
   "unpkg": "dist/aframe-orbit-controls.min.js",