three-stdlib 2.7.0 → 2.8.1

package/controls/ArcballControls.js

@@ -1,5 +1,5 @@
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import { Matrix4, EventDispatcher, EllipseCurve, BufferGeometry, Mesh, PerspectiveCamera, MathUtils, OrthographicCamera, Vector3, GridHelper, LineBasicMaterial, Line, Raycaster, Vector2, Quaternion, Group, Box3, Sphere } from 'three';
+import { Matrix4, EventDispatcher, EllipseCurve, BufferGeometry, MathUtils, Vector3, GridHelper, LineBasicMaterial, Line, Raycaster, Vector2, Quaternion, Group, Box3, Sphere } from 'three';
 
 //trackball state
 const STATE = {
@@ -44,13 +44,13 @@ const _endEvent = {
 };
 /**
  *
- * @param {Camera} camera Virtual camera used in the scene
- * @param {HTMLElement} domElement Renderer's dom element
- * @param {Scene} scene The scene to be rendered
+ * @param {CamOrthographicCamera | PerspectiveCameraera} camera Virtual camera used in the scene
+ * @param {HTMLElement=null} domElement Renderer's dom element
+ * @param {Scene=null} scene The scene to be rendered
  */
 
 class ArcballControls extends EventDispatcher {
-  constructor(_camera, domElement, scene = null) {
+  constructor(_camera, _domElement = null, scene = null) {
     super();
 
     _defineProperty(this, "camera", void 0);
@@ -143,8 +143,6 @@ class ArcballControls extends EventDispatcher {
 
     _defineProperty(this, "_downEvents", void 0);
 
-    _defineProperty(this, "_downStart", void 0);
-
     _defineProperty(this, "_clickStart", void 0);
 
     _defineProperty(this, "_maxDownTime", void 0);
@@ -215,8 +213,6 @@ class ArcballControls extends EventDispatcher {
 
     _defineProperty(this, "enableZoom", void 0);
 
-    _defineProperty(this, "enableGizmos", void 0);
-
     _defineProperty(this, "minDistance", void 0);
 
     _defineProperty(this, "maxDistance", void 0);
@@ -236,7 +232,7 @@ class ArcballControls extends EventDispatcher {
     _defineProperty(this, "onWindowResize", () => {
       const scale = (this._gizmos.scale.x + this._gizmos.scale.y + this._gizmos.scale.z) / 3;
 
-      if (this.camera !== null) {
+      if (this.camera) {
         const tbRadius = this.calculateTbRadius(this.camera);
 
         if (tbRadius !== undefined) {
@@ -252,10 +248,7 @@ class ArcballControls extends EventDispatcher {
 
       for (const gizmo in this._gizmos.children) {
         const child = this._gizmos.children[gizmo];
-
-        if (child instanceof Mesh) {
-          child.geometry = curveGeometry;
-        }
+        child.geometry = curveGeometry;
       }
 
       this.dispatchEvent(_changeEvent);
@@ -288,8 +281,6 @@ class ArcballControls extends EventDispatcher {
         this._downValid = true;
 
         this._downEvents.push(event);
-
-        this._downStart = performance.now();
       } else {
         this._downValid = false;
       }
@@ -334,7 +325,7 @@ class ArcballControls extends EventDispatcher {
 
         this._mouseOp = this.getOpFromAction(event.button, modifier);
 
-        if (this._mouseOp != null) {
+        if (this._mouseOp) {
           window.addEventListener('pointermove', this.onPointerMove);
           window.addEventListener('pointerup', this.onPointerUp); //singleStart
 
@@ -392,7 +383,7 @@ class ArcballControls extends EventDispatcher {
 
         const mouseOpState = this.getOpStateFromAction(this._button, modifier);
 
-        if (mouseOpState != null) {
+        if (mouseOpState) {
           this.onSinglePanMove(event, mouseOpState);
         }
       } //checkDistance
@@ -505,7 +496,9 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "onWheel", event => {
-      if (this.enabled && this.enableZoom) {
+      var _this$camera3;
+
+      if (this.enabled && this.enableZoom && this.domElement) {
         let modifier = null;
 
         if (event.ctrlKey || event.metaKey) {
@@ -516,7 +509,7 @@ class ArcballControls extends EventDispatcher {
 
         const mouseOp = this.getOpFromAction('WHEEL', modifier);
 
-        if (mouseOp != null) {
+        if (mouseOp) {
           event.preventDefault();
           this.dispatchEvent(_startEvent);
           const notchDeltaY = 125; //distance of one notch of mouse wheel
@@ -541,13 +534,17 @@ class ArcballControls extends EventDispatcher {
               }
 
               if (this.cursorZoom && this.enablePan) {
+                var _this$camera, _this$camera2;
+
                 let scalePoint;
 
-                if (this.camera instanceof OrthographicCamera && this.camera.isOrthographicCamera) {
+                if (((_this$camera = this.camera) === null || _this$camera === void 0 ? void 0 : _this$camera.type) === 'OrthographicCamera') {
                   var _this$unprojectOnTbPl;
 
                   scalePoint = (_this$unprojectOnTbPl = this.unprojectOnTbPlane(this.camera, event.clientX, event.clientY, this.domElement)) === null || _this$unprojectOnTbPl === void 0 ? void 0 : _this$unprojectOnTbPl.applyQuaternion(this.camera.quaternion).multiplyScalar(1 / this.camera.zoom).add(this._gizmos.position);
-                } else if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+                }
+
+                if (((_this$camera2 = this.camera) === null || _this$camera2 === void 0 ? void 0 : _this$camera2.type) === 'PerspectiveCamera') {
                   var _this$unprojectOnTbPl2;
 
                   scalePoint = (_this$unprojectOnTbPl2 = this.unprojectOnTbPlane(this.camera, event.clientX, event.clientY, this.domElement)) === null || _this$unprojectOnTbPl2 === void 0 ? void 0 : _this$unprojectOnTbPl2.applyQuaternion(this.camera.quaternion).add(this._gizmos.position);
@@ -558,7 +555,7 @@ class ArcballControls extends EventDispatcher {
                 this.applyTransformMatrix(this.applyScale(size, this._gizmos.position));
               }
 
-              if (this._grid != null) {
+              if (this._grid) {
                 this.disposeGrid();
                 this.drawGrid();
               }
@@ -569,7 +566,7 @@ class ArcballControls extends EventDispatcher {
               break;
 
             case 'FOV':
-              if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+              if (((_this$camera3 = this.camera) === null || _this$camera3 === void 0 ? void 0 : _this$camera3.type) === 'PerspectiveCamera') {
                 this.updateTbState(STATE.FOV, true); //Vertigo effect
                 //	  fov / 2
                 //		|\
@@ -617,7 +614,7 @@ class ArcballControls extends EventDispatcher {
                 this.applyTransformMatrix(this.applyScale(size, this._gizmos.position, false));
               }
 
-              if (this._grid != null) {
+              if (this._grid) {
                 this.disposeGrid();
                 this.drawGrid();
               }
@@ -631,28 +628,16 @@ class ArcballControls extends EventDispatcher {
       }
     });
 
-    _defineProperty(this, "onKeyDown", event => {
-      if (event.key == 'c') {
-        if (event.ctrlKey || event.metaKey) {
-          this.copyState();
-        }
-      } else if (event.key == 'v') {
-        if (event.ctrlKey || event.metaKey) {
-          this.pasteState();
-        }
-      }
-    });
-
     _defineProperty(this, "onSinglePanStart", (event, operation) => {
-      if (this.enabled) {
+      var _this$camera4;
+
+      if (this.enabled && this.domElement) {
         this.dispatchEvent(_startEvent);
         this.setCenter(event.clientX, event.clientY);
 
         switch (operation) {
           case 'PAN':
-            if (!this.enablePan) {
-              return;
-            }
+            if (!this.enablePan) return;
 
             if (this._animationId != -1) {
               cancelAnimationFrame(this._animationId);
@@ -662,7 +647,7 @@ class ArcballControls extends EventDispatcher {
               this.dispatchEvent(_changeEvent);
             }
 
-            if (this.camera !== null) {
+            if (this.camera) {
               this.updateTbState(STATE.PAN, true);
               const rayDir = this.unprojectOnTbPlane(this.camera, _center.x, _center.y, this.domElement);
 
@@ -679,9 +664,7 @@ class ArcballControls extends EventDispatcher {
             break;
 
           case 'ROTATE':
-            if (!this.enableRotate) {
-              return;
-            }
+            if (!this.enableRotate) return;
 
             if (this._animationId != -1) {
               cancelAnimationFrame(this._animationId);
@@ -689,7 +672,7 @@ class ArcballControls extends EventDispatcher {
               this._timeStart = -1;
             }
 
-            if (this.camera !== null) {
+            if (this.camera) {
               this.updateTbState(STATE.ROTATE, true);
               const rayDir = this.unprojectOnTbSurface(this.camera, _center.x, _center.y, this.domElement, this._tbRadius);
 
@@ -716,30 +699,28 @@ class ArcballControls extends EventDispatcher {
             break;
 
           case 'FOV':
-            if (!(this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) || !this.enableZoom) {
-              return;
-            }
+            if (!this.enableZoom) return;
 
-            if (this._animationId != -1) {
-              cancelAnimationFrame(this._animationId);
-              this._animationId = -1;
-              this._timeStart = -1;
-              this.activateGizmos(false);
-              this.dispatchEvent(_changeEvent);
-            }
+            if (((_this$camera4 = this.camera) === null || _this$camera4 === void 0 ? void 0 : _this$camera4.type) === 'PerspectiveCamera') {
+              if (this._animationId != -1) {
+                cancelAnimationFrame(this._animationId);
+                this._animationId = -1;
+                this._timeStart = -1;
+                this.activateGizmos(false);
+                this.dispatchEvent(_changeEvent);
+              }
 
-            this.updateTbState(STATE.FOV, true);
+              this.updateTbState(STATE.FOV, true);
 
-            this._startCursorPosition.setY(this.getCursorNDC(_center.x, _center.y, this.domElement).y * 0.5);
+              this._startCursorPosition.setY(this.getCursorNDC(_center.x, _center.y, this.domElement).y * 0.5);
 
-            this._currentCursorPosition.copy(this._startCursorPosition);
+              this._currentCursorPosition.copy(this._startCursorPosition);
+            }
 
             break;
 
           case 'ZOOM':
-            if (!this.enableZoom) {
-              return;
-            }
+            if (!this.enableZoom) return;
 
             if (this._animationId != -1) {
               cancelAnimationFrame(this._animationId);
@@ -761,13 +742,15 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "onSinglePanMove", (event, opState) => {
-      if (this.enabled) {
+      var _this$camera5;
+
+      if (this.enabled && this.domElement) {
         const restart = opState != this._state;
         this.setCenter(event.clientX, event.clientY);
 
         switch (opState) {
           case STATE.PAN:
-            if (this.enablePan && this.camera !== null) {
+            if (this.enablePan && this.camera) {
               if (restart) {
                 //switch to pan operation
                 this.dispatchEvent(_endEvent);
@@ -799,7 +782,7 @@ class ArcballControls extends EventDispatcher {
             break;
 
           case STATE.ROTATE:
-            if (this.enableRotate && this.camera !== null) {
+            if (this.enableRotate && this.camera) {
               if (restart) {
                 //switch to rotate operation
                 this.dispatchEvent(_endEvent);
@@ -889,7 +872,7 @@ class ArcballControls extends EventDispatcher {
             break;
 
           case STATE.FOV:
-            if (this.enableZoom && this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+            if (this.enableZoom && ((_this$camera5 = this.camera) === null || _this$camera5 === void 0 ? void 0 : _this$camera5.type) === 'PerspectiveCamera') {
               if (restart) {
                 //switch to fov operation
                 this.dispatchEvent(_endEvent);
@@ -998,12 +981,12 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "onDoubleTap", event => {
-      if (this.enabled && this.enablePan && this.scene != null && this.camera !== null) {
+      if (this.enabled && this.enablePan && this.scene && this.camera && this.domElement) {
         this.dispatchEvent(_startEvent);
         this.setCenter(event.clientX, event.clientY);
         const hitP = this.unprojectOnObj(this.getCursorNDC(_center.x, _center.y, this.domElement), this.camera);
 
-        if (hitP != null && this.enableAnimations) {
+        if (hitP && this.enableAnimations) {
           const self = this;
 
           if (this._animationId != -1) {
@@ -1015,7 +998,7 @@ class ArcballControls extends EventDispatcher {
             self.updateTbState(STATE.ANIMATION_FOCUS, true);
             self.onFocusAnim(t, hitP, self._cameraMatrixState, self._gizmoMatrixState);
           });
-        } else if (hitP != null && !this.enableAnimations) {
+        } else if (hitP && !this.enableAnimations) {
           this.updateTbState(STATE.FOCUS, true);
           this.focus(hitP, this.scaleFactor);
           this.updateTbState(STATE.IDLE, false);
@@ -1027,7 +1010,7 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "onDoublePanStart", () => {
-      if (this.enabled && this.enablePan && this.camera !== null) {
+      if (this.enabled && this.enablePan && this.camera && this.domElement) {
         this.dispatchEvent(_startEvent);
         this.updateTbState(STATE.PAN, true);
         this.setCenter((this._touchCurrent[0].clientX + this._touchCurrent[1].clientX) / 2, (this._touchCurrent[0].clientY + this._touchCurrent[1].clientY) / 2);
@@ -1044,7 +1027,7 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "onDoublePanMove", () => {
-      if (this.enabled && this.enablePan && this.camera !== null) {
+      if (this.enabled && this.enablePan && this.camera && this.domElement) {
         this.setCenter((this._touchCurrent[0].clientX + this._touchCurrent[1].clientX) / 2, (this._touchCurrent[0].clientY + this._touchCurrent[1].clientY) / 2);
 
         if (this._state != STATE.PAN) {
@@ -1067,14 +1050,14 @@ class ArcballControls extends EventDispatcher {
 
     _defineProperty(this, "onRotateStart", () => {
       if (this.enabled && this.enableRotate) {
-        var _this$camera;
+        var _this$camera6;
 
         this.dispatchEvent(_startEvent);
         this.updateTbState(STATE.ZROTATE, true); //this._startFingerRotation = event.rotation;
 
         this._startFingerRotation = this.getAngle(this._touchCurrent[1], this._touchCurrent[0]) + this.getAngle(this._touchStart[1], this._touchStart[0]);
         this._currentFingerRotation = this._startFingerRotation;
-        (_this$camera = this.camera) === null || _this$camera === void 0 ? void 0 : _this$camera.getWorldDirection(this._rotationAxis); //rotation axis
+        (_this$camera6 = this.camera) === null || _this$camera6 === void 0 ? void 0 : _this$camera6.getWorldDirection(this._rotationAxis); //rotation axis
 
         if (!this.enablePan && !this.enableZoom) {
           this.activateGizmos(true);
@@ -1083,7 +1066,7 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "onRotateMove", () => {
-      if (this.enabled && this.enableRotate && this.camera !== null) {
+      if (this.enabled && this.enableRotate && this.camera && this.domElement) {
         this.setCenter((this._touchCurrent[0].clientX + this._touchCurrent[1].clientX) / 2, (this._touchCurrent[0].clientY + this._touchCurrent[1].clientY) / 2);
         let rotationPoint;
 
@@ -1097,7 +1080,7 @@ class ArcballControls extends EventDispatcher {
 
         if (!this.enablePan) {
           rotationPoint = new Vector3().setFromMatrixPosition(this._gizmoMatrixState);
-        } else if (this.camera instanceof PerspectiveCamera || this.camera instanceof OrthographicCamera) {
+        } else if (this.camera) {
           var _this$unprojectOnTbPl3;
 
           this._v3_2.setFromMatrixPosition(this._gizmoMatrixState);
@@ -1132,7 +1115,7 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "onPinchMove", () => {
-      if (this.enabled && this.enableZoom) {
+      if (this.enabled && this.enableZoom && this.domElement) {
         this.setCenter((this._touchCurrent[0].clientX + this._touchCurrent[1].clientX) / 2, (this._touchCurrent[0].clientY + this._touchCurrent[1].clientY) / 2);
         const minDistance = 12; //minimum distance between fingers (in css pixels)
 
@@ -1148,11 +1131,13 @@ class ArcballControls extends EventDispatcher {
         if (!this.enablePan) {
           scalePoint = this._gizmos.position;
         } else {
-          if (this.camera instanceof OrthographicCamera && this.camera.isOrthographicCamera) {
+          var _this$camera7, _this$camera8;
+
+          if (((_this$camera7 = this.camera) === null || _this$camera7 === void 0 ? void 0 : _this$camera7.type) === 'OrthographicCamera') {
             var _this$unprojectOnTbPl4;
 
             scalePoint = (_this$unprojectOnTbPl4 = this.unprojectOnTbPlane(this.camera, _center.x, _center.y, this.domElement)) === null || _this$unprojectOnTbPl4 === void 0 ? void 0 : _this$unprojectOnTbPl4.applyQuaternion(this.camera.quaternion).multiplyScalar(1 / this.camera.zoom).add(this._gizmos.position);
-          } else if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+          } else if (((_this$camera8 = this.camera) === null || _this$camera8 === void 0 ? void 0 : _this$camera8.type) === 'PerspectiveCamera') {
             var _this$unprojectOnTbPl5;
 
             scalePoint = (_this$unprojectOnTbPl5 = this.unprojectOnTbPlane(this.camera, _center.x, _center.y, this.domElement)) === null || _this$unprojectOnTbPl5 === void 0 ? void 0 : _this$unprojectOnTbPl5.applyQuaternion(this.camera.quaternion).add(this._gizmos.position);
@@ -1173,7 +1158,7 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "onTriplePanStart", () => {
-      if (this.enabled && this.enableZoom) {
+      if (this.enabled && this.enableZoom && this.domElement) {
         this.dispatchEvent(_startEvent);
         this.updateTbState(STATE.SCALE, true); //const center = event.center;
 
@@ -1195,7 +1180,7 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "onTriplePanMove", () => {
-      if (this.enabled && this.enableZoom && this.camera !== null) {
+      if (this.enabled && this.enableZoom && this.camera && this.domElement) {
         //	  fov / 2
         //		|\
         //		| \
@@ -1278,18 +1263,6 @@ class ArcballControls extends EventDispatcher {
       this.setMouseAction('FOV', 1, 'SHIFT');
     });
 
-    _defineProperty(this, "compareMouseAction", (action1, action2) => {
-      if (action1.operation == action2.operation) {
-        if (action1.mouse == action2.mouse && action1.key == action2.key) {
-          return true;
-        } else {
-          return false;
-        }
-      } else {
-        return false;
-      }
-    });
-
     _defineProperty(this, "setMouseAction", (operation, mouse, key = null) => {
       const operationInput = ['PAN', 'ROTATE', 'ZOOM', 'FOV'];
       const mouseInput = [0, 1, 2, 'WHEEL'];
@@ -1344,17 +1317,6 @@ class ArcballControls extends EventDispatcher {
       return true;
     });
 
-    _defineProperty(this, "unsetMouseAction", (mouse, key = null) => {
-      for (let i = 0; i < this.mouseActions.length; i++) {
-        if (this.mouseActions[i].mouse == mouse && this.mouseActions[i].key == key) {
-          this.mouseActions.splice(i, 1);
-          return true;
-        }
-      }
-
-      return false;
-    });
-
     _defineProperty(this, "getOpFromAction", (mouse, key) => {
       let action;
 
@@ -1366,7 +1328,7 @@ class ArcballControls extends EventDispatcher {
         }
       }
 
-      if (key != null) {
+      if (key) {
         for (let i = 0; i < this.mouseActions.length; i++) {
           action = this.mouseActions[i];
 
@@ -1390,7 +1352,7 @@ class ArcballControls extends EventDispatcher {
         }
       }
 
-      if (key != null) {
+      if (key) {
         for (let i = 0; i < this.mouseActions.length; i++) {
           action = this.mouseActions[i];
 
@@ -1446,19 +1408,19 @@ class ArcballControls extends EventDispatcher {
       const factor = 0.67;
       const distance = camera.position.distanceTo(this._gizmos.position);
 
-      if (camera.type == 'PerspectiveCamera' && camera instanceof PerspectiveCamera) {
+      if (camera.type == 'PerspectiveCamera') {
         const halfFovV = MathUtils.DEG2RAD * camera.fov * 0.5; //vertical fov/2 in radians
 
         const halfFovH = Math.atan(camera.aspect * Math.tan(halfFovV)); //horizontal fov/2 in radians
 
         return Math.tan(Math.min(halfFovV, halfFovH)) * distance * factor;
-      } else if (camera.type == 'OrthographicCamera' && camera instanceof OrthographicCamera) {
+      } else if (camera.type == 'OrthographicCamera') {
         return Math.min(camera.top, camera.right) * factor;
       }
     });
 
     _defineProperty(this, "focus", (point, size, amount = 1) => {
-      if (this.camera !== null) {
+      if (this.camera) {
         const focusPoint = point.clone(); //move center of camera (along with gizmos) towards point of interest
 
         focusPoint.sub(this._gizmos.position).multiplyScalar(amount);
@@ -1489,19 +1451,21 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "drawGrid", () => {
-      if (this.scene != null) {
+      if (this.scene) {
+        var _this$camera9, _this$camera10;
+
         const color = 0x888888;
         const multiplier = 3;
         let size, divisions, maxLength, tick;
 
-        if (this.camera instanceof OrthographicCamera && this.camera.isOrthographicCamera) {
+        if (((_this$camera9 = this.camera) === null || _this$camera9 === void 0 ? void 0 : _this$camera9.type) === 'OrthographicCamera') {
           const width = this.camera.right - this.camera.left;
           const height = this.camera.bottom - this.camera.top;
           maxLength = Math.max(width, height);
           tick = maxLength / 20;
           size = maxLength / this.camera.zoom * multiplier;
           divisions = size / tick * this.camera.zoom;
-        } else if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+        } else if (((_this$camera10 = this.camera) === null || _this$camera10 === void 0 ? void 0 : _this$camera10.type) === 'PerspectiveCamera') {
           const distance = this.camera.position.distanceTo(this._gizmos.position);
           const halfFovV = MathUtils.DEG2RAD * this.camera.fov * 0.5;
           const halfFovH = Math.atan(this.camera.aspect * Math.tan(halfFovV));
@@ -1511,7 +1475,7 @@ class ArcballControls extends EventDispatcher {
           divisions = size / tick;
         }
 
-        if (this._grid == null && this.camera !== null) {
+        if (this._grid == null && this.camera) {
           this._grid = new GridHelper(size, divisions, color, color);
 
           this._grid.position.copy(this._gizmos.position);
@@ -1527,27 +1491,43 @@ class ArcballControls extends EventDispatcher {
       }
     });
 
+    _defineProperty(this, "connect", domElement => {
+      // https://github.com/mrdoob/three.js/issues/20575
+      if (domElement === document) {
+        console.error('THREE.ArcballControls: "document" should not be used as the target "domElement". Please use "renderer.domElement" instead.');
+      }
+
+      this.domElement = domElement; // disables touch scroll
+      // touch-action needs to be defined for pointer events to work on mobile
+      // https://stackoverflow.com/a/48254578
+
+      this.domElement.style.touchAction = 'none';
+      this.domElement.addEventListener('contextmenu', this.onContextMenu);
+      this.domElement.addEventListener('pointerdown', this.onPointerDown);
+      this.domElement.addEventListener('pointercancel', this.onPointerCancel);
+      this.domElement.addEventListener('wheel', this.onWheel);
+    });
+
     _defineProperty(this, "dispose", () => {
-      var _this$scene;
+      var _this$domElement, _this$domElement2, _this$domElement3, _this$domElement4, _this$scene;
 
       if (this._animationId != -1) {
         window.cancelAnimationFrame(this._animationId);
       }
 
-      this.domElement.removeEventListener('pointerdown', this.onPointerDown);
-      this.domElement.removeEventListener('pointercancel', this.onPointerCancel);
-      this.domElement.removeEventListener('wheel', this.onWheel);
-      this.domElement.removeEventListener('contextmenu', this.onContextMenu);
+      (_this$domElement = this.domElement) === null || _this$domElement === void 0 ? void 0 : _this$domElement.removeEventListener('pointerdown', this.onPointerDown);
+      (_this$domElement2 = this.domElement) === null || _this$domElement2 === void 0 ? void 0 : _this$domElement2.removeEventListener('pointercancel', this.onPointerCancel);
+      (_this$domElement3 = this.domElement) === null || _this$domElement3 === void 0 ? void 0 : _this$domElement3.removeEventListener('wheel', this.onWheel);
+      (_this$domElement4 = this.domElement) === null || _this$domElement4 === void 0 ? void 0 : _this$domElement4.removeEventListener('contextmenu', this.onContextMenu);
       window.removeEventListener('pointermove', this.onPointerMove);
       window.removeEventListener('pointerup', this.onPointerUp);
       window.removeEventListener('resize', this.onWindowResize);
-      window.addEventListener('keydown', this.onKeyDown);
       (_this$scene = this.scene) === null || _this$scene === void 0 ? void 0 : _this$scene.remove(this._gizmos);
       this.disposeGrid();
     });
 
     _defineProperty(this, "disposeGrid", () => {
-      if (this._grid != null && this.scene != null) {
+      if (this._grid && this.scene) {
         this.scene.remove(this._grid);
         this._grid = null;
       }
@@ -1558,29 +1538,9 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "activateGizmos", isActive => {
-      const gizmoX = this._gizmos.children[0];
-      const gizmoY = this._gizmos.children[1];
-      const gizmoZ = this._gizmos.children[2];
-
-      if (isActive) {
-        gizmoX.material.setValues({
-          opacity: 1
-        });
-        gizmoY.material.setValues({
-          opacity: 1
-        });
-        gizmoZ.material.setValues({
-          opacity: 1
-        });
-      } else {
-        gizmoX.material.setValues({
-          opacity: 0.6
-        });
-        gizmoY.material.setValues({
-          opacity: 0.6
-        });
-        gizmoZ.material.setValues({
-          opacity: 0.6
+      for (const gizmo of this._gizmos.children) {
+        gizmo.material.setValues({
+          opacity: isActive ? 1 : 0.6
         });
       }
     });
@@ -1596,9 +1556,11 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "getCursorPosition", (cursorX, cursorY, canvas) => {
+      var _this$camera11;
+
       this._v2_1.copy(this.getCursorNDC(cursorX, cursorY, canvas));
 
-      if (this.camera instanceof OrthographicCamera) {
+      if (((_this$camera11 = this.camera) === null || _this$camera11 === void 0 ? void 0 : _this$camera11.type) === 'OrthographicCamera') {
         this._v2_1.x *= (this.camera.right - this.camera.left) * 0.5;
         this._v2_1.y *= (this.camera.top - this.camera.bottom) * 0.5;
       }
@@ -1607,11 +1569,11 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "setCamera", camera => {
-      if (camera instanceof PerspectiveCamera || camera instanceof OrthographicCamera) {
+      if (camera) {
         camera.lookAt(this.target);
         camera.updateMatrix(); //setting state
 
-        if ((camera === null || camera === void 0 ? void 0 : camera.type) == 'PerspectiveCamera' && camera instanceof PerspectiveCamera) {
+        if ((camera === null || camera === void 0 ? void 0 : camera.type) == 'PerspectiveCamera') {
           this._fov0 = camera.fov;
           this._fovState = camera.fov;
         }
@@ -1636,11 +1598,7 @@ class ArcballControls extends EventDispatcher {
         this._upState.copy(camera.up);
 
         this.camera = camera;
-
-        if (this.camera instanceof PerspectiveCamera || this.camera instanceof OrthographicCamera) {
-          this.camera.updateProjectionMatrix();
-        } //making gizmos
-
+        this.camera.updateProjectionMatrix(); //making gizmos
 
         const tbRadius = this.calculateTbRadius(camera);
 
@@ -1689,7 +1647,7 @@ class ArcballControls extends EventDispatcher {
 
       this._gizmoMatrixState.copy(this._gizmoMatrixState0);
 
-      if ((this.camera instanceof PerspectiveCamera || this.camera instanceof OrthographicCamera) && this.camera.zoom != 1) {
+      if (this.camera && this.camera.zoom != 1) {
         //adapt gizmos size to camera zoom
         const size = 1 / this.camera.zoom;
 
@@ -1798,13 +1756,15 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "pan", (p0, p1, adjust = false) => {
-      if (this.camera !== null) {
+      if (this.camera) {
         const movement = p0.clone().sub(p1);
 
-        if (this.camera instanceof OrthographicCamera && this.camera.isOrthographicCamera) {
+        if (this.camera.type === 'OrthographicCamera') {
           //adjust movement amount
           movement.multiplyScalar(1 / this.camera.zoom);
-        } else if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera && adjust) {
+        }
+
+        if (this.camera.type === 'PerspectiveCamera' && adjust) {
           //adjust movement amount
           this._v3_1.setFromMatrixPosition(this._cameraMatrixState0); //camera's initial position
 
@@ -1827,10 +1787,10 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "reset", () => {
-      if (this.camera instanceof PerspectiveCamera || this.camera instanceof OrthographicCamera) {
+      if (this.camera) {
         this.camera.zoom = this._zoom0;
 
-        if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+        if (this.camera.type === 'PerspectiveCamera') {
           this.camera.fov = this._fov0;
         }
 
@@ -1883,10 +1843,10 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "copyState", () => {
-      let state;
+      if (this.camera) {
+        var _this$camera12;
 
-      if (this.camera instanceof OrthographicCamera && this.camera.isOrthographicCamera) {
-        state = JSON.stringify({
+        const state = JSON.stringify(((_this$camera12 = this.camera) === null || _this$camera12 === void 0 ? void 0 : _this$camera12.type) === 'OrthographicCamera' ? {
           arcballState: {
             cameraFar: this.camera.far,
             cameraMatrix: this.camera.matrix,
@@ -1895,9 +1855,7 @@ class ArcballControls extends EventDispatcher {
             cameraZoom: this.camera.zoom,
             gizmoMatrix: this._gizmos.matrix
           }
-        });
-      } else if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
-        state = JSON.stringify({
+        } : {
           arcballState: {
             cameraFar: this.camera.far,
             cameraFov: this.camera.fov,
@@ -1908,9 +1866,6 @@ class ArcballControls extends EventDispatcher {
             gizmoMatrix: this._gizmos.matrix
           }
         });
-      }
-
-      if (state !== undefined) {
         navigator.clipboard.writeText(state);
       }
     });
@@ -1923,28 +1878,29 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "saveState", () => {
-      if (this.camera instanceof PerspectiveCamera || this.camera instanceof OrthographicCamera) {
-        this._cameraMatrixState0.copy(this.camera.matrix);
+      if (!this.camera) return;
 
-        this._gizmoMatrixState0.copy(this._gizmos.matrix);
+      this._cameraMatrixState0.copy(this.camera.matrix);
 
-        this._nearPos = this.camera.near;
-        this._farPos = this.camera.far;
-        this._zoom0 = this.camera.zoom;
+      this._gizmoMatrixState0.copy(this._gizmos.matrix);
 
-        this._up0.copy(this.camera.up);
+      this._nearPos = this.camera.near;
+      this._farPos = this.camera.far;
+      this._zoom0 = this.camera.zoom;
 
-        if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
-          this._fov0 = this.camera.fov;
-        }
+      this._up0.copy(this.camera.up);
+
+      if (this.camera.type === 'PerspectiveCamera') {
+        this._fov0 = this.camera.fov;
       }
     });
 
     _defineProperty(this, "applyScale", (size, point, scaleGizmos = true) => {
+      if (!this.camera) return;
       const scalePoint = point.clone();
       let sizeInverse = 1 / size;
 
-      if (this.camera instanceof OrthographicCamera && this.camera.isOrthographicCamera) {
+      if (this.camera.type === 'OrthographicCamera') {
         //camera zoom
         this.camera.zoom = this._zoomState;
         this.camera.zoom *= size; //check min and max zoom
@@ -1982,7 +1938,9 @@ class ArcballControls extends EventDispatcher {
 
         this.setTransformationMatrices(this._m4_1, this._m4_2);
         return _transformation;
-      } else if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+      }
+
+      if (this.camera.type === 'PerspectiveCamera') {
         this._v3_1.setFromMatrixPosition(this._cameraMatrixState);
 
         this._v3_2.setFromMatrixPosition(this._gizmoMatrixState); //move camera
@@ -2035,14 +1993,16 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "setFov", value => {
-      if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+      var _this$camera13;
+
+      if (((_this$camera13 = this.camera) === null || _this$camera13 === void 0 ? void 0 : _this$camera13.type) === 'PerspectiveCamera') {
         this.camera.fov = MathUtils.clamp(value, this.minFov, this.maxFov);
         this.camera.updateProjectionMatrix();
       }
     });
 
     _defineProperty(this, "setTarget", (x, y, z) => {
-      if (this.camera !== null) {
+      if (this.camera) {
         this.target.set(x, y, z);
 
         this._gizmos.position.set(x, y, z); //for correct radius calculation
@@ -2085,17 +2045,16 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "unprojectOnObj", (cursor, camera) => {
-      if ((camera instanceof PerspectiveCamera || camera instanceof OrthographicCamera) && this.scene != null) {
-        const raycaster = new Raycaster();
-        raycaster.near = camera.near;
-        raycaster.far = camera.far;
-        raycaster.setFromCamera(cursor, camera);
-        const intersect = raycaster.intersectObjects(this.scene.children, true);
-
-        for (let i = 0; i < intersect.length; i++) {
-          if (intersect[i].object.uuid != this._gizmos.uuid && intersect[i].face != null) {
-            return intersect[i].point.clone();
-          }
+      if (!this.scene) return null;
+      const raycaster = new Raycaster();
+      raycaster.near = camera.near;
+      raycaster.far = camera.far;
+      raycaster.setFromCamera(cursor, camera);
+      const intersect = raycaster.intersectObjects(this.scene.children, true);
+
+      for (let i = 0; i < intersect.length; i++) {
+        if (intersect[i].object.uuid != this._gizmos.uuid && intersect[i].face) {
+          return intersect[i].point.clone();
         }
       }
 
@@ -2121,7 +2080,9 @@ class ArcballControls extends EventDispatcher {
         }
 
         return this._v3_1;
-      } else if (camera.type == 'PerspectiveCamera') {
+      }
+
+      if (camera.type == 'PerspectiveCamera') {
         //unproject cursor on the near plane
         this._v2_1.copy(this.getCursorNDC(cursorX, cursorY, canvas));
 
@@ -2216,7 +2177,9 @@ class ArcballControls extends EventDispatcher {
         this._v3_1.set(this._v2_1.x, this._v2_1.y, 0);
 
         return this._v3_1.clone();
-      } else if (camera.type == 'PerspectiveCamera') {
+      }
+
+      if (camera.type == 'PerspectiveCamera') {
         this._v2_1.copy(this.getCursorNDC(cursorX, cursorY, canvas)); //unproject cursor on the near plane
 
 
@@ -2271,20 +2234,21 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "updateMatrixState", () => {
-      if (this.camera !== null) {
-        //update camera and gizmos state
-        this._cameraMatrixState.copy(this.camera.matrix);
+      if (!this.camera) return; //update camera and gizmos state
 
-        this._gizmoMatrixState.copy(this._gizmos.matrix);
+      this._cameraMatrixState.copy(this.camera.matrix);
 
-        if (this.camera instanceof OrthographicCamera && this.camera.isOrthographicCamera) {
-          this._cameraProjectionState.copy(this.camera.projectionMatrix);
+      this._gizmoMatrixState.copy(this._gizmos.matrix);
 
-          this.camera.updateProjectionMatrix();
-          this._zoomState = this.camera.zoom;
-        } else if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
-          this._fovState = this.camera.fov;
-        }
+      if (this.camera.type === 'OrthographicCamera') {
+        this._cameraProjectionState.copy(this.camera.projectionMatrix);
+
+        this.camera.updateProjectionMatrix();
+        this._zoomState = this.camera.zoom;
+      }
+
+      if (this.camera.type === 'PerspectiveCamera') {
+        this._fovState = this.camera.fov;
       }
     });
 
@@ -2297,11 +2261,9 @@ class ArcballControls extends EventDispatcher {
     });
 
     _defineProperty(this, "update", () => {
-      var _this$camera2;
-
       const EPS = 0.000001; // Update target and gizmos state
 
-      if (!this.target.equals(this._currentTarget) && this.camera !== null) {
+      if (!this.target.equals(this._currentTarget) && this.camera) {
         this._gizmos.position.set(this.target.x, this.target.y, this.target.z); //for correct radius calculation
 
 
@@ -2314,16 +2276,19 @@ class ArcballControls extends EventDispatcher {
         this.makeGizmos(this.target, this._tbRadius);
 
         this._currentTarget.copy(this.target);
-      } //check min/max parameters
+      }
 
+      if (!this.camera) return; //check min/max parameters
 
-      if (this.camera instanceof OrthographicCamera && this.camera.isOrthographicCamera) {
+      if (this.camera.type === 'OrthographicCamera') {
         //check zoom
         if (this.camera.zoom > this.maxZoom || this.camera.zoom < this.minZoom) {
           const newZoom = MathUtils.clamp(this.camera.zoom, this.minZoom, this.maxZoom);
           this.applyTransformMatrix(this.applyScale(newZoom / this.camera.zoom, this._gizmos.position, true));
         }
-      } else if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+      }
+
+      if (this.camera.type === 'PerspectiveCamera') {
         //check distance
         const distance = this.camera.position.distanceTo(this._gizmos.position);
 
@@ -2356,21 +2321,18 @@ class ArcballControls extends EventDispatcher {
 
           for (const gizmo in this._gizmos.children) {
             const child = this._gizmos.children[gizmo];
-
-            if (child instanceof Mesh) {
-              child.geometry = curveGeometry;
-            }
+            child.geometry = curveGeometry;
           }
         }
       }
 
-      (_this$camera2 = this.camera) === null || _this$camera2 === void 0 ? void 0 : _this$camera2.lookAt(this._gizmos.position);
+      this.camera.lookAt(this._gizmos.position);
     });
 
     _defineProperty(this, "setStateFromJSON", json => {
       const state = JSON.parse(json);
 
-      if (state.arcballState != undefined && (this.camera instanceof PerspectiveCamera || this.camera instanceof OrthographicCamera)) {
+      if (state.arcballState && this.camera) {
         this._cameraMatrixState.fromArray(state.arcballState.cameraMatrix.elements);
 
         this._cameraMatrixState.decompose(this.camera.position, this.camera.quaternion, this.camera.scale);
@@ -2380,7 +2342,7 @@ class ArcballControls extends EventDispatcher {
         this.camera.far = state.arcballState.cameraFar;
         this.camera.zoom = state.arcballState.cameraZoom;
 
-        if (this.camera instanceof PerspectiveCamera && this.camera.isPerspectiveCamera) {
+        if (this.camera.type === 'PerspectiveCamera') {
           this.camera.fov = state.arcballState.cameraFov;
         }
 
@@ -2411,7 +2373,7 @@ class ArcballControls extends EventDispatcher {
     });
 
     this.camera = null;
-    this.domElement = domElement;
+    this.domElement = _domElement;
     this.scene = scene;
     this.mouseActions = [];
     this._mouseOp = null; //global vectors and matrices that are used in some operations to avoid creating new objects every time (e.g. every time cursor moves)
@@ -2469,8 +2431,6 @@ class ArcballControls extends EventDispatcher {
     this._downValid = true;
     this._nclicks = 0;
     this._downEvents = [];
-    this._downStart = 0; //pointerDown time
-
     this._clickStart = 0; //first click time
 
     this._maxDownTime = 250;
@@ -2530,7 +2490,6 @@ class ArcballControls extends EventDispatcher {
     this.enablePan = true;
     this.enableRotate = true;
     this.enableZoom = true;
-    this.enableGizmos = true;
     this.minDistance = 0;
     this.maxDistance = Infinity;
     this.minZoom = 0;
@@ -2543,18 +2502,13 @@ class ArcballControls extends EventDispatcher {
     this._state = STATE.IDLE;
     this.setCamera(_camera);
 
-    if (this.scene != null) {
+    if (this.scene) {
       this.scene.add(this._gizmos);
     }
 
-    this.domElement.style.touchAction = 'none';
     this._devPxRatio = window.devicePixelRatio;
     this.initializeMouseActions();
-    this.domElement.addEventListener('contextmenu', this.onContextMenu);
-    this.domElement.addEventListener('wheel', this.onWheel);
-    this.domElement.addEventListener('pointerdown', this.onPointerDown);
-    this.domElement.addEventListener('pointercancel', this.onPointerCancel);
-    window.addEventListener('keydown', this.onKeyDown);
+    if (this.domElement) this.connect(this.domElement);
     window.addEventListener('resize', this.onWindowResize);
   } //listeners
 
@@ -2564,7 +2518,7 @@ class ArcballControls extends EventDispatcher {
    * @param {Object} transformation Object containing matrices to apply to camera and gizmos
    */
   applyTransformMatrix(transformation) {
-    if ((transformation === null || transformation === void 0 ? void 0 : transformation.camera) != null && this.camera !== null) {
+    if (transformation !== null && transformation !== void 0 && transformation.camera && this.camera) {
       this._m4_1.copy(this._cameraMatrixState).premultiply(transformation.camera);
 
       this._m4_1.decompose(this.camera.position, this.camera.quaternion, this.camera.scale);
@@ -2576,7 +2530,7 @@ class ArcballControls extends EventDispatcher {
       }
     }
 
-    if ((transformation === null || transformation === void 0 ? void 0 : transformation.gizmos) != null) {
+    if (transformation !== null && transformation !== void 0 && transformation.gizmos) {
       this._m4_1.copy(this._gizmoMatrixState).premultiply(transformation.gizmos);
 
       this._m4_1.decompose(this._gizmos.position, this._gizmos.quaternion, this._gizmos.scale);
@@ -2584,7 +2538,7 @@ class ArcballControls extends EventDispatcher {
       this._gizmos.updateMatrix();
     }
 
-    if ((this._state == STATE.SCALE || this._state == STATE.FOCUS || this._state == STATE.ANIMATION_FOCUS) && (this.camera instanceof PerspectiveCamera || this.camera instanceof OrthographicCamera)) {
+    if ((this._state == STATE.SCALE || this._state == STATE.FOCUS || this._state == STATE.ANIMATION_FOCUS) && this.camera) {
       const tbRadius = this.calculateTbRadius(this.camera);
 
       if (tbRadius !== undefined) {
@@ -2655,8 +2609,8 @@ class ArcballControls extends EventDispatcher {
    * @param {Matrix4} gizmos Transformation to be applied to gizmos
    */
   setTransformationMatrices(camera = null, gizmos = null) {
-    if (camera != null) {
-      if (_transformation.camera != null) {
+    if (camera) {
+      if (_transformation.camera) {
         _transformation.camera.copy(camera);
       } else {
         _transformation.camera = camera.clone();
@@ -2665,8 +2619,8 @@ class ArcballControls extends EventDispatcher {
       _transformation.camera = null;
     }
 
-    if (gizmos != null) {
-      if (_transformation.gizmos != null) {
+    if (gizmos) {
+      if (_transformation.gizmos) {
         _transformation.gizmos.copy(gizmos);
       } else {
         _transformation.gizmos = gizmos.clone();