@xviewer.js/core 1.0.4-alpha.6 → 1.0.4-alpha.8

package/dist/main.cjs

@@ -2586,6 +2586,60 @@ class Pressability {
     }
 }
 
+const PIXEL_STEP = 10;
+const LINE_HEIGHT = 40;
+const PAGE_HEIGHT = 800;
+function normalizeWheel(/*object*/ event) /*object*/ {
+    let sX = 0, sY = 0, pX = 0, pY = 0; // pixelX, pixelY
+    // Legacy
+    if ('detail' in event) {
+        sY = event.detail;
+    }
+    if ('wheelDelta' in event) {
+        sY = -event.wheelDelta / 120;
+    }
+    if ('wheelDeltaY' in event) {
+        sY = -event.wheelDeltaY / 120;
+    }
+    if ('wheelDeltaX' in event) {
+        sX = -event.wheelDeltaX / 120;
+    }
+    // side scrolling on FF with DOMMouseScroll
+    if ('axis' in event && event.axis === event.HORIZONTAL_AXIS) {
+        sX = sY;
+        sY = 0;
+    }
+    pX = sX * PIXEL_STEP;
+    pY = sY * PIXEL_STEP;
+    if ('deltaY' in event) {
+        pY = event.deltaY;
+    }
+    if ('deltaX' in event) {
+        pX = event.deltaX;
+    }
+    if ((pX || pY) && event.deltaMode) {
+        if (event.deltaMode == 1) {
+            pX *= LINE_HEIGHT;
+            pY *= LINE_HEIGHT;
+        } else {
+            pX *= PAGE_HEIGHT;
+            pY *= PAGE_HEIGHT;
+        }
+    }
+    // Fall-back if spin cannot be determined
+    if (pX && !sX) {
+        sX = pX < 1 ? -1 : 1;
+    }
+    if (pY && !sY) {
+        sY = pY < 1 ? -1 : 1;
+    }
+    return {
+        spinX: sX,
+        spinY: sY,
+        pixelX: pX,
+        pixelY: pY
+    };
+}
 class DeviceInput extends Component {
     get pointer() {
         return this._pointer;
@@ -2602,9 +2656,18 @@ class DeviceInput extends Component {
     get prePointerPixel() {
         return this._prePointerPixel;
     }
+    get preTouches() {
+        return this._preTouches;
+    }
     get mouseWheel() {
         return this._mouseWheel;
     }
+    get touchStart() {
+        return this._touchStart;
+    }
+    get touchMoving() {
+        return this._touchMoving;
+    }
     get touchCount() {
         return this._touchCount;
     }
@@ -2668,7 +2731,12 @@ class DeviceInput extends Component {
     lastUpdate(dt) {
         this._prePointer.copy(this._pointer);
         this._prePointerPixel.copy(this._pointerPixel);
+        for(let i = this._touchCount; i--;){
+            this._preTouches[i].id = this._touches[i].id;
+            this._preTouches[i].position.copy(this._touches[i].position);
+        }
         this._mouseWheel = 0;
+        this._touchStart = false;
     }
     connect(target, event) {
         switch(event){
@@ -2739,14 +2807,16 @@ class DeviceInput extends Component {
         const isDocument = target instanceof Document;
         const width = isDocument ? window.innerWidth : target.offsetWidth;
         const height = isDocument ? window.innerHeight : target.offsetHeight;
-        this._pointer.x = e.clientX / width * 2 - 1;
-        this._pointer.y = 1 - e.clientY / height * 2;
-        this._pointerPixel.set(e.clientX, e.clientY);
+        this._pointer.x = e.pageX / width * 2 - 1;
+        this._pointer.y = 1 - e.pageY / height * 2;
+        this._pointerPixel.set(e.pageX, e.pageY);
     }
     _onPointerDown(e) {
         e = this._remapPointer(e);
         this._pointerButton = e.button;
         this._computePointer(e);
+        this._prePointer.copy(this._pointer);
+        this._prePointerPixel.copy(this._pointerPixel);
         this._pressability.pointerDown(this._pointer, this.viewer.camera);
         this.viewer.emit(DeviceInput.POINTER_DOWN, e);
     }
@@ -2764,33 +2834,54 @@ class DeviceInput extends Component {
         this.viewer.emit(DeviceInput.POINTER_MOVE, e);
     }
     _onMouseWheel(e) {
-        this._mouseWheel = e.deltaY || e.wheelDelta;
+        this._mouseWheel = this._normalizeWheel(e).pixelY;
         this.viewer.emit(DeviceInput.MOUSE_WHEEL, e);
     }
     _onTouchStart(e) {
+        this._touchStart = true;
         e = this._remapTouch(e);
+        const curr = e.touches;
+        const touches = this._touches;
+        const preTouches = this._preTouches;
+        for(let i = curr.length; i--;){
+            if (touches[i] === undefined) {
+                touches[i] = {
+                    id: -1,
+                    position: new THREE.Vector2()
+                };
+            }
+            const touch = curr[i];
+            touches[i].id = touch.identifier;
+            touches[i].position.set(touch.pageX, touch.pageY);
+            if (preTouches[i] === undefined) {
+                preTouches[i] = {
+                    id: touches[i].id,
+                    position: touches[i].position.clone()
+                };
+            } else {
+                preTouches[i].id = touches[i].id;
+                preTouches[i].position.copy(touches[i].position);
+            }
+        }
+        this._touchCount = curr.length;
         this.viewer.emit(DeviceInput.TOUCH_START, e);
     }
     _onTouchEnd(e) {
+        this._touchMoving = false;
         e = this._remapTouch(e);
         this.viewer.emit(DeviceInput.TOUCH_END, e);
     }
     _onTouchMove(e) {
+        this._touchMoving = true;
         e = this._remapTouch(e);
-        const touches = e.touches;
-        const touchesTo = this._touches;
-        for(let i = touches.length; i--;){
-            if (touchesTo[i] == undefined) {
-                touchesTo[i] = {
-                    id: -1,
-                    position: new THREE.Vector2()
-                };
-            }
-            const touch = touches[i];
-            touchesTo[i].id = touch.identifier;
-            touchesTo[i].position.set(touch.pageX, touch.pageY);
-        }
-        this._touchCount = touches.length;
+        const curr = e.touches;
+        const touches = this._touches;
+        for(let i = curr.length; i--;){
+            const touch = curr[i];
+            touches[i].id = touch.identifier;
+            touches[i].position.set(touch.pageX, touch.pageY);
+        }
+        this._touchCount = curr.length;
         this.viewer.emit(DeviceInput.TOUCH_MOVE, e);
     }
     _onKeyDown(e) {
@@ -2805,9 +2896,10 @@ class DeviceInput extends Component {
         this._keys[e.key] = false;
         this.viewer.emit(DeviceInput.KEYUP, e);
     }
-    constructor(target){
-        super(), this._listeners = [], this._touches = [], this._touchCount = 0, this._pointer = new THREE.Vector2(), this._pointerPixel = new THREE.Vector2(), this._pointerButton = -1, this._prePointer = new THREE.Vector2(), this._prePointerPixel = new THREE.Vector2(), this._mouseWheel = 0, this._keys = {}, this._pressability = new Pressability();
-        this._target = target;
+    constructor(option){
+        super(), this._listeners = [], this._touches = [], this._touchCount = 0, this._touchStart = false, this._touchMoving = false, this._pointer = new THREE.Vector2(), this._pointerPixel = new THREE.Vector2(), this._pointerButton = -1, this._prePointer = new THREE.Vector2(), this._prePointerPixel = new THREE.Vector2(), this._preTouches = [], this._mouseWheel = 0, this._keys = {}, this._pressability = new Pressability();
+        this._target = option.source;
+        this._normalizeWheel = option.normalizeWheel || normalizeWheel;
     }
 }
 DeviceInput.CLICK = "click";
@@ -5059,7 +5151,9 @@ class Viewer extends EventEmitter {
         this._mount = applyProps(new THREE.Object3D(), {
             name: "Mount"
         });
-        this._input = this.add(new DeviceInput(input || this._canvas));
+        this._input = this.add(new DeviceInput(input || {
+            source: this._canvas
+        }));
         this.add(Renderer);
         this.addLoader(GLTFLoader);
         this.addLoader(HDRLoader);