csyjk 1.1.1 → 1.2.2

package/src/lib/gltf/assets/yjkkit-sdk/src/viewer/scene/CameraControl/lib/handlers/TouchPickHandler.js

@@ -0,0 +1,197 @@
+import {math} from "../../../math/math.js";
+
+const TAP_INTERVAL = 150;
+const DBL_TAP_INTERVAL = 325;
+const TAP_DISTANCE_THRESHOLD = 4;
+
+/**
+ * @private
+ */
+class TouchPickHandler {
+
+    constructor(scene, controllers, configs, states, updates, touchid) {
+
+        this._scene = scene;
+
+        const pickController = controllers.pickController;
+        const pivotController = controllers.pivotController;
+        const cameraControl = controllers.cameraControl;
+
+        let touchStartTime;
+        const activeTouches = [];
+        const tapStartPos = new Float32Array(2);
+        let tapStartTime = -1;
+        let lastTapTime = -1;
+
+        const canvas = this._scene.canvas.canvas;
+
+        const flyCameraTo = (pickResult) => {
+            let pos;
+            if (pickResult && pickResult.worldPos) {
+                pos = pickResult.worldPos
+            }
+            const aabb = pickResult ? pickResult.entity.aabb : scene.aabb;
+            if (pos) { // Fly to look at point, don't change eye->look dist
+                const camera = scene.camera;
+                const diff = math.subVec3(camera.eye, camera.look, []);
+                controllers.cameraFlight.flyTo({
+                    aabb: aabb
+                });
+                // TODO: Option to back off to fit AABB in view
+            } else {// Fly to fit target boundary in view
+                controllers.cameraFlight.flyTo({
+                    aabb: aabb
+                });
+            }
+        };
+
+        canvas.addEventListener("touchstart", this._canvasTouchStartHandler = (e) => {
+
+            if (!(configs.active && configs.pointerEnabled)) {
+                return;
+            }
+
+            const touches = e.touches;
+            const changedTouches = e.changedTouches;
+
+            touchStartTime = Date.now();
+
+            if (touches.length === 1 && changedTouches.length === 1) {
+                tapStartTime = touchStartTime;
+                tapStartPos[0] = touches[0].pageX;
+                tapStartPos[1] = touches[0].pageY;
+            } else {
+                tapStartTime = -1;
+            }
+
+            while (activeTouches.length < touches.length) {
+                activeTouches.push(new Float32Array(2))
+            }
+
+            for (let i = 0, len = touches.length; i < len; ++i) {
+                activeTouches[i][0] = touches[i].pageX;
+                activeTouches[i][1] = touches[i].pageY;
+            }
+
+            activeTouches.length = touches.length;
+
+            e.stopPropagation();
+
+        }, {passive: true});
+
+
+        canvas.addEventListener("touchend", this._canvasTouchEndHandler = (e) => {
+
+            if (!(configs.active && configs.pointerEnabled)) {
+                return;
+            }
+            const currentTime = Date.now();
+            const touches = e.touches;
+            const changedTouches = e.changedTouches;
+
+            const pickedSubs = cameraControl.hasSubs("picked");
+            const pickedNothingSubs = cameraControl.hasSubs("pickedNothing");
+            const pickedSurfaceSubs = cameraControl.hasSubs("pickedSurface");
+            const doublePickedSubs = cameraControl.hasSubs("doublePicked");
+            const doublePickedSurfaceSubs = cameraControl.hasSubs("doublePickedSurface");
+            const doublePickedNothingSubs = cameraControl.hasSubs("doublePickedNothing");
+
+            // process tap
+
+            if (touches.length === 0 && changedTouches.length === 1) {
+
+                if (tapStartTime > -1 && currentTime - tapStartTime < TAP_INTERVAL) {
+
+                    if (lastTapTime > -1 && tapStartTime - lastTapTime < DBL_TAP_INTERVAL) {
+
+                        // Double-tap
+
+                        pickController.pickCursorPos[0] = Math.round(changedTouches[0].clientX);
+                        pickController.pickCursorPos[1] = Math.round(changedTouches[0].clientY);
+                        pickController.schedulePickEntity = true;
+                        pickController.schedulePickSurface = pickedSurfaceSubs;
+
+                        pickController.update();
+
+                        if (pickController.pickResult) {
+
+                            cameraControl.fire("doublePicked", pickController.pickResult);
+
+                            if (pickController.pickedSurface) {
+                                cameraControl.fire("doublePickedSurface", pickController.pickResult);
+                            }
+
+                            if (configs.doublePickFlyTo) {
+                                flyCameraTo(pickController.pickResult);
+                                pickController.pickResult.entity.colorize = [60,179,113];
+                                touchid = pickController.pickResult.entity.id;
+                                // console.log('Result.entity',pickController.pickResult.entity,'手模了一下');
+                            }
+                        } else {
+                            cameraControl.fire("doublePickedNothing");
+                            if (configs.doublePickFlyTo) {
+                                flyCameraTo();
+                            }
+                        }
+
+                        lastTapTime = -1;
+
+                    } else if (math.distVec2(activeTouches[0], tapStartPos) < TAP_DISTANCE_THRESHOLD) {
+
+                        // Single-tap
+
+                        pickController.pickCursorPos[0] = Math.round(changedTouches[0].clientX);
+                        pickController.pickCursorPos[1] = Math.round(changedTouches[0].clientY);
+                        pickController.schedulePickEntity = true;
+                        pickController.schedulePickSurface = pickedSurfaceSubs;
+
+                        pickController.update();
+
+                        if (pickController.pickResult) {
+
+                            cameraControl.fire("picked", pickController.pickResult);
+
+                            if (pickController.pickedSurface) {
+                                cameraControl.fire("pickedSurface", pickController.pickResult);
+                            }
+
+                        } else {
+                            cameraControl.fire("pickedNothing");
+                        }
+
+                        lastTapTime = currentTime;
+                    }
+
+                    tapStartTime = -1
+                }
+            }
+
+            activeTouches.length = touches.length;
+
+            for (let i = 0, len = touches.length; i < len; ++i) {
+                activeTouches[i][0] = touches[i].pageX;
+                activeTouches[i][1] = touches[i].pageY;
+            }
+
+            e.stopPropagation();
+
+        }, {passive: true});
+
+    }
+
+    reset() {
+        // TODO
+         // tapStartTime = -1;
+         // lastTapTime = -1;
+
+    }
+
+    destroy() {
+        const canvas = this._scene.canvas.canvas;
+        canvas.removeEventListener("touchstart", this._canvasTouchStartHandler);
+        canvas.removeEventListener("touchend", this._canvasTouchEndHandler);
+    }
+}
+
+
+export {TouchPickHandler};

package/src/lib/gltf/assets/yjkkit-sdk/src/viewer/scene/CameraControl/lib/handlers/mouspan.js

@@ -0,0 +1,498 @@
+/**
+ * @private
+ */
+import {math} from "../../../math/math.js";
+
+const canvasPos = math.vec2();
+
+const getCanvasPosFromEvent = function (event, canvasPos) {
+  if (!event) {
+    event = window.event;
+    canvasPos[0] = event.x;
+    canvasPos[1] = event.y;
+  } else {
+    let element = event.target;
+    let totalOffsetLeft = 0;
+    let totalOffsetTop = 0;
+    while (element.offsetParent) {
+      totalOffsetLeft += element.offsetLeft;
+      totalOffsetTop += element.offsetTop;
+      element = element.offsetParent;
+    }
+    canvasPos[0] = event.pageX - totalOffsetLeft;
+    canvasPos[1] = event.pageY - totalOffsetTop;
+  }
+  return canvasPos;
+};
+
+/**
+ * @private
+ */
+class MousePanRotateDollyHandler {
+
+  constructor(scene, controllers, configs, states, updates) {
+
+    this._scene = scene;
+
+    const pickController = controllers.pickController;
+
+    let lastX = 0;
+    let lastY = 0;
+    let lastXDown = 0;
+    let lastYDown = 0;
+    let xRotateDelta = 0;
+    let yRotateDelta = 0;
+
+    let mouseDownLeft;
+    let mouseDownMiddle;
+    let mouseDownRight;
+
+    let mouseDownPicked = false;
+    const pickedWorldPos = math.vec3();
+
+    let mouseMovedOnCanvasSinceLastWheel = true;
+
+    const canvas = this._scene.canvas.canvas;
+
+    const keyDown = [];
+
+    document.addEventListener("keydown", this._documentKeyDownHandler = (e) => {
+      if (!(configs.active && configs.pointerEnabled) || (!scene.input.keyboardEnabled)) {
+        return;
+      }
+      const keyCode = e.keyCode;
+      keyDown[keyCode] = true;
+    });
+
+    document.addEventListener("keyup", this._documentKeyUpHandler = (e) => {
+      if (!(configs.active && configs.pointerEnabled) || (!scene.input.keyboardEnabled)) {
+        return;
+      }
+      const keyCode = e.keyCode;
+      keyDown[keyCode] = false;
+    });
+
+    function setMousedownState(pick = true) {
+      canvas.style.cursor = "move";
+      setMousedownPositions();
+      if (pick) {
+        setMousedownPick();
+      }
+    }
+
+    function setMousedownPositions() {
+      xRotateDelta = 0;
+      yRotateDelta = 0;
+
+      lastX = states.pointerCanvasPos[0];
+      lastY = states.pointerCanvasPos[1];
+      lastXDown = states.pointerCanvasPos[0];
+      lastYDown = states.pointerCanvasPos[1];
+    }
+
+    function setMousedownPick() {
+      pickController.pickCursorPos = states.pointerCanvasPos;
+      pickController.schedulePickSurface = true;
+      pickController.update();
+
+      if (pickController.picked && pickController.pickedSurface && pickController.pickResult && pickController.pickResult.worldPos) {
+        mouseDownPicked = true;
+        pickedWorldPos.set(pickController.pickResult.worldPos);
+      } else {
+        mouseDownPicked = false;
+      }
+    }
+
+    canvas.addEventListener("mousedown", this._mouseDownHandler = (e) => {
+
+      if (!(configs.active && configs.pointerEnabled)) {
+        return;
+      }
+
+      this._down = true;
+      console.log('鼠标旋转参数传递',configs.yjkLeft);
+      if (configs.yjkLeft===1){
+        switch (e.which) {
+
+          case 1: // Left button
+
+            if (keyDown[scene.input.KEY_SHIFT] || configs.planView) {
+
+              canvas.style.cursor = "move";
+
+              xRotateDelta = 0;
+              yRotateDelta = 0;
+
+              lastX = states.mouseCanvasPos[0];
+              lastY = states.mouseCanvasPos[1];
+              lastXDown = states.mouseCanvasPos[0];
+              lastYDown = states.mouseCanvasPos[1];
+
+              pickController.pickCursorPos = states.mouseCanvasPos;
+              pickController.schedulePickSurface = true;
+              pickController.update();
+
+              if (pickController.picked && pickController.pickedSurface && pickController.pickResult) {
+                mouseDownPicked = true;
+                pickedWorldPos.set(pickController.pickResult.worldPos);
+              } else {
+                mouseDownPicked = false;
+              }
+
+            } else {
+
+              mouseDownLeft = true;
+              canvas.style.cursor = "move";
+
+              xRotateDelta = 0;
+              yRotateDelta = 0;
+
+              lastX = states.mouseCanvasPos[0];
+              lastY = states.mouseCanvasPos[1];
+              lastXDown = states.mouseCanvasPos[0];
+              lastYDown = states.mouseCanvasPos[1];
+            }
+
+            break;
+
+          case 2: // Middle/both buttons
+
+            mouseDownMiddle = true;
+
+            if (!configs.panRightClick) {
+
+              canvas.style.cursor = "move";
+
+              xRotateDelta = 0;
+              yRotateDelta = 0;
+
+              lastX = states.mouseCanvasPos[0];
+              lastY = states.mouseCanvasPos[1];
+              lastXDown = states.mouseCanvasPos[0];
+              lastYDown = states.mouseCanvasPos[1];
+            }
+
+            break;
+
+          case 3: // Right button
+
+            mouseDownRight = true;
+
+            if (configs.panRightClick) {
+
+              canvas.style.cursor = "move";
+
+              xRotateDelta = 0;
+              yRotateDelta = 0;
+
+              lastX = states.mouseCanvasPos[0];
+              lastY = states.mouseCanvasPos[1];
+              lastXDown = states.mouseCanvasPos[0];
+              lastYDown = states.mouseCanvasPos[1];
+
+              pickController.pickCursorPos = states.mouseCanvasPos;
+              pickController.schedulePickSurface = true;
+              pickController.update();
+
+              if (pickController.picked && pickController.pickedSurface && pickController.pickResult) {
+                mouseDownPicked = true;
+                pickedWorldPos.set(pickController.pickResult.worldPos);
+              } else {
+                mouseDownPicked = false;
+              }
+            }
+
+            break;
+
+          default:
+            break;
+        }
+
+      }else {
+        switch (e.which) {
+
+          case 3: // Left button
+
+            if (keyDown[scene.input.KEY_SHIFT] || configs.planView) {
+
+              canvas.style.cursor = "move";
+
+              xRotateDelta = 0;
+              yRotateDelta = 0;
+
+              lastX = states.mouseCanvasPos[0];
+              lastY = states.mouseCanvasPos[1];
+              lastXDown = states.mouseCanvasPos[0];
+              lastYDown = states.mouseCanvasPos[1];
+
+              pickController.pickCursorPos = states.mouseCanvasPos;
+              pickController.schedulePickSurface = true;
+              pickController.update();
+
+              if (pickController.picked && pickController.pickedSurface && pickController.pickResult) {
+                mouseDownPicked = true;
+                pickedWorldPos.set(pickController.pickResult.worldPos);
+              } else {
+                mouseDownPicked = false;
+              }
+
+            } else {
+
+              mouseDownLeft = true;
+              canvas.style.cursor = "move";
+
+              xRotateDelta = 0;
+              yRotateDelta = 0;
+
+              lastX = states.mouseCanvasPos[0];
+              lastY = states.mouseCanvasPos[1];
+              lastXDown = states.mouseCanvasPos[0];
+              lastYDown = states.mouseCanvasPos[1];
+            }
+
+            break;
+
+          case 2: // Middle/both buttons
+
+            mouseDownMiddle = true;
+
+            if (!configs.panRightClick) {
+
+              canvas.style.cursor = "move";
+
+              xRotateDelta = 0;
+              yRotateDelta = 0;
+
+              lastX = states.mouseCanvasPos[0];
+              lastY = states.mouseCanvasPos[1];
+              lastXDown = states.mouseCanvasPos[0];
+              lastYDown = states.mouseCanvasPos[1];
+            }
+
+            break;
+
+          case 1: // Right button
+
+            mouseDownRight = true;
+
+            if (configs.panRightClick) {
+
+              canvas.style.cursor = "move";
+
+              xRotateDelta = 0;
+              yRotateDelta = 0;
+
+              lastX = states.mouseCanvasPos[0];
+              lastY = states.mouseCanvasPos[1];
+              lastXDown = states.mouseCanvasPos[0];
+              lastYDown = states.mouseCanvasPos[1];
+
+              pickController.pickCursorPos = states.mouseCanvasPos;
+              pickController.schedulePickSurface = true;
+              pickController.update();
+
+              if (pickController.picked && pickController.pickedSurface && pickController.pickResult) {
+                mouseDownPicked = true;
+                pickedWorldPos.set(pickController.pickResult.worldPos);
+              } else {
+                mouseDownPicked = false;
+              }
+            }
+
+            break;
+
+          default:
+            break;
+        }
+      }
+
+
+
+    });
+
+    document.addEventListener("mousemove", this._documentMouseMoveHandler = () => {
+
+      if (!(configs.active && configs.pointerEnabled)) {
+        return;
+      }
+
+      if (!mouseDownLeft && !mouseDownMiddle && !mouseDownRight) {
+        return;
+      }
+
+      // Scaling drag-rotate to canvas boundary
+
+      const canvasBoundary = scene.canvas.boundary;
+      const canvasWidth = canvasBoundary[2] - canvasBoundary[0];
+      const canvasHeight = canvasBoundary[3] - canvasBoundary[1];
+      const x = states.pointerCanvasPos[0];
+      const y = states.pointerCanvasPos[1];
+
+      const panning = keyDown[scene.input.KEY_SHIFT] || configs.planView || (!configs.panRightClick && mouseDownMiddle) || (configs.panRightClick && mouseDownRight);
+
+      if (panning) {
+
+        const xPanDelta = (x - lastX);
+        const yPanDelta = (y - lastY);
+
+        const camera = scene.camera;
+
+        // We use only canvasHeight here so that aspect ratio does not distort speed
+
+        if (camera.projection === "perspective") {
+
+          const depth = Math.abs(mouseDownPicked ? math.lenVec3(math.subVec3(pickedWorldPos, scene.camera.eye, [])) : scene.camera.eyeLookDist);
+          const targetDistance = depth * Math.tan((camera.perspective.fov / 2) * Math.PI / 180.0);
+
+          updates.panDeltaX += (1.5 * xPanDelta * targetDistance / canvasHeight);
+          updates.panDeltaY += (1.5 * yPanDelta * targetDistance / canvasHeight);
+
+        } else {
+
+          updates.panDeltaX += 0.5 * camera.ortho.scale * (xPanDelta / canvasHeight);
+          updates.panDeltaY += 0.5 * camera.ortho.scale * (yPanDelta / canvasHeight);
+        }
+
+      } else if (mouseDownLeft && !mouseDownMiddle && !mouseDownRight) {
+
+        if (!configs.planView) { // No rotating in plan-view mode
+
+          if (configs.firstPerson) {
+            updates.rotateDeltaY -= ((x - lastX) / canvasWidth) * configs.dragRotationRate / 2;
+            updates.rotateDeltaX += ((y - lastY) / canvasHeight) * (configs.dragRotationRate / 4);
+
+          } else {
+            updates.rotateDeltaY -= ((x - lastX) / canvasWidth) * (configs.dragRotationRate * 1.5);
+            updates.rotateDeltaX += ((y - lastY) / canvasHeight) * (configs.dragRotationRate * 1.5);
+          }
+        }
+      }
+
+      lastX = x;
+      lastY = y;
+    });
+
+    canvas.addEventListener("mousemove", this._canvasMouseMoveHandler = (e) => {
+
+      if (!(configs.active && configs.pointerEnabled)) {
+        return;
+      }
+
+      if (!states.mouseover) {
+        return;
+      }
+
+      mouseMovedOnCanvasSinceLastWheel = true;
+    });
+
+    document.addEventListener("mouseup", this._documentMouseUpHandler = (e) => {
+      if (!(configs.active && configs.pointerEnabled)) {
+        return;
+      }
+      switch (e.which) {
+        case 1: // Left button
+          mouseDownLeft = false;
+          mouseDownMiddle = false;
+          mouseDownRight = false;
+          break;
+        case 2: // Middle/both buttons
+          mouseDownLeft = false;
+          mouseDownMiddle = false;
+          mouseDownRight = false;
+          break;
+        case 3: // Right button
+          mouseDownLeft = false;
+          mouseDownMiddle = false;
+          mouseDownRight = false;
+          break;
+        default:
+          break;
+      }
+      xRotateDelta = 0;
+      yRotateDelta = 0;
+    });
+
+    canvas.addEventListener("mouseup", this._mouseUpHandler = (e) => {
+      if (!(configs.active && configs.pointerEnabled)) {
+        return;
+      }
+      switch (e.which) {
+        case 3: // Right button
+          getCanvasPosFromEvent(e, canvasPos);
+          const x = canvasPos[0];
+          const y = canvasPos[1];
+          if (Math.abs(x - lastXDown) < 3 && Math.abs(y - lastYDown) < 3) {
+            controllers.cameraControl.fire("rightClick", { // For context menus
+              canvasPos: canvasPos,
+              event: e
+            }, true);
+          }
+          break;
+        default:
+          break;
+      }
+      canvas.style.removeProperty("cursor");
+    });
+
+    canvas.addEventListener("mouseenter", this._mouseEnterHandler = () => {
+      if (!(configs.active && configs.pointerEnabled)) {
+        return;
+      }
+      xRotateDelta = 0;
+      yRotateDelta = 0;
+    });
+
+    const maxElapsed = 1 / 20;
+    const minElapsed = 1 / 60;
+
+    let secsNowLast = null;
+
+    canvas.addEventListener("wheel", this._mouseWheelHandler = (e) => {
+      if (!(configs.active && configs.pointerEnabled)) {
+        return;
+      }
+      const secsNow = performance.now() / 1000.0;
+      var secsElapsed = (secsNowLast !== null) ? (secsNow - secsNowLast) : 0;
+      secsNowLast = secsNow;
+      if (secsElapsed > maxElapsed) {
+        secsElapsed = maxElapsed;
+      }
+      if (secsElapsed < minElapsed) {
+        secsElapsed = minElapsed;
+      }
+      const delta = Math.max(-1, Math.min(1, -e.deltaY * 40));
+      if (delta === 0) {
+        return;
+      }
+      const normalizedDelta = delta / Math.abs(delta);
+      updates.dollyDelta += -normalizedDelta * secsElapsed * configs.mouseWheelDollyRate;
+
+      if (mouseMovedOnCanvasSinceLastWheel) {
+        states.followPointerDirty = true;
+        mouseMovedOnCanvasSinceLastWheel = false;
+      }
+
+      e.preventDefault();
+    });
+  }
+
+  reset() {
+  }
+
+  destroy() {
+
+    const canvas = this._scene.canvas.canvas;
+
+    document.removeEventListener("keydown", this._documentKeyDownHandler);
+    document.removeEventListener("keyup", this._documentKeyUpHandler);
+    canvas.removeEventListener("mousedown", this._mouseDownHandler);
+    document.removeEventListener("mousemove", this._documentMouseMoveHandler);
+    canvas.removeEventListener("mousemove", this._canvasMouseMoveHandler);
+    document.removeEventListener("mouseup", this._documentMouseUpHandler);
+    canvas.removeEventListener("mouseup", this._mouseUpHandler);
+    canvas.removeEventListener("mouseenter", this._mouseEnterHandler);
+    canvas.removeEventListener("wheel", this._mouseWheelHandler);
+  }
+}
+
+export {MousePanRotateDollyHandler};