@xeokit/xeokit-sdk 2.5.2-beta-13 → 2.5.2-beta-16

package/src/src/viewer/scene/CameraControl/lib/handlers/MousePickHandler.js

@@ -1,376 +0,0 @@
-import {math} from "../../../math/math.js";
-
-/**
- * @private
- */
-class MousePickHandler {
-
-    constructor(scene, controllers, configs, states, updates) {
-
-        this._scene = scene;
-
-        const pickController = controllers.pickController;
-        const pivotController = controllers.pivotController;
-        const cameraControl = controllers.cameraControl;
-
-        this._clicks = 0;
-        this._timeout = null;
-        this._lastPickedEntityId = null;
-
-        let leftDown = false;
-        let rightDown = false;
-
-        const canvas = this._scene.canvas.canvas;
-
-        const flyCameraTo = (pickResult) => {
-            let pos;
-            if (pickResult && pickResult.worldPos) {
-                pos = pickResult.worldPos
-            }
-            const aabb = pickResult && pickResult.entity ? 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({
-                    // look: pos,
-                    // eye: xeokit.math.addVec3(pos, diff, []),
-                    // up: camera.up,
-                    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
-                });
-            }
-        };
-
-        const tickifiedMouseMoveFn = scene.tickify (
-            this._canvasMouseMoveHandler = (e) => {
-                if (!(configs.active && configs.pointerEnabled)) {
-                    return;
-                }
-
-                if (leftDown || rightDown) {
-                    return;
-                }
-
-                const hoverSubs = cameraControl.hasSubs("hover");
-                const hoverEnterSubs = cameraControl.hasSubs("hoverEnter");
-                const hoverOutSubs = cameraControl.hasSubs("hoverOut");
-                const hoverOffSubs = cameraControl.hasSubs("hoverOff");
-                const hoverSurfaceSubs = cameraControl.hasSubs("hoverSurface");
-                const hoverSnapOrSurfaceSubs = cameraControl.hasSubs("hoverSnapOrSurface");
-
-                if (hoverSubs || hoverEnterSubs || hoverOutSubs || hoverOffSubs || hoverSurfaceSubs || hoverSnapOrSurfaceSubs) {
-
-                    pickController.pickCursorPos = states.pointerCanvasPos;
-                    pickController.schedulePickEntity = true;
-                    pickController.schedulePickSurface = hoverSurfaceSubs;
-                    pickController.scheduleSnapOrPick = hoverSnapOrSurfaceSubs
-
-                    pickController.update();
-
-                    if (pickController.pickResult) {
-
-                        if (pickController.pickResult.entity) {
-                            const pickedEntityId = pickController.pickResult.entity.id;
-
-                            if (this._lastPickedEntityId !== pickedEntityId) {
-
-                                if (this._lastPickedEntityId !== undefined) {
-
-                                    cameraControl.fire("hoverOut", { // Hovered off an entity
-                                        entity: scene.objects[this._lastPickedEntityId]
-                                    }, true);
-                                }
-
-                                cameraControl.fire("hoverEnter", pickController.pickResult, true); // Hovering over a new entity
-
-                                this._lastPickedEntityId = pickedEntityId;
-                            }
-                        }
-
-                        cameraControl.fire("hover", pickController.pickResult, true);
-
-                        if (pickController.pickResult.worldPos || pickController.pickResult.snappedWorldPos) { // Hovering the surface of an entity
-                            cameraControl.fire("hoverSurface", pickController.pickResult, true);
-                        }
-
-                    } else {
-
-                        if (this._lastPickedEntityId !== undefined) {
-
-                            cameraControl.fire("hoverOut", { // Hovered off an entity
-                                entity: scene.objects[this._lastPickedEntityId]
-                            }, true);
-
-                            this._lastPickedEntityId = undefined;
-                        }
-
-                        cameraControl.fire("hoverOff", { // Not hovering on any entity
-                            canvasPos: pickController.pickCursorPos
-                        }, true);
-                    }
-                }
-            }
-        );
-
-        canvas.addEventListener("mousemove", tickifiedMouseMoveFn);
-
-        canvas.addEventListener('mousedown', this._canvasMouseDownHandler = (e) => {
-
-            if (e.which === 1) {
-                leftDown = true;
-            }
-
-            if (e.which === 3) {
-                rightDown = true;
-            }
-
-            const leftButtonDown = (e.which === 1);
-
-            if (!leftButtonDown) {
-                return;
-            }
-
-            if (!(configs.active && configs.pointerEnabled)) {
-                return;
-            }
-
-            // Left mouse button down to start pivoting
-
-            states.mouseDownClientX = e.clientX;
-            states.mouseDownClientY = e.clientY;
-            states.mouseDownCursorX = states.pointerCanvasPos[0];
-            states.mouseDownCursorY = states.pointerCanvasPos[1];
-
-            if ((!configs.firstPerson) && configs.followPointer) {
-
-                pickController.pickCursorPos = states.pointerCanvasPos;
-                pickController.schedulePickSurface = true;
-
-                pickController.update();
-
-                if (e.which === 1) {// Left button
-                    const pickResult = pickController.pickResult;
-                    if (pickResult && pickResult.worldPos) {
-                        pivotController.setPivotPos(pickResult.worldPos);
-                        pivotController.startPivot();
-                    } else {
-                        if (configs.smartPivot) {
-                            pivotController.setCanvasPivotPos(states.pointerCanvasPos);
-                        } else {
-                            pivotController.setPivotPos(scene.camera.look);
-                        }
-                        pivotController.startPivot();
-                    }
-                }
-            }
-        });
-
-        document.addEventListener('mouseup', this._documentMouseUpHandler = (e) => {
-
-            if (e.which === 1) {
-                leftDown = false;
-            }
-
-            if (e.which === 3) {
-                rightDown = false;
-            }
-
-            if (pivotController.getPivoting()) {
-                pivotController.endPivot();
-            }
-        });
-
-        canvas.addEventListener('mouseup', this._canvasMouseUpHandler = (e) => {
-
-            if (!(configs.active && configs.pointerEnabled)) {
-                return;
-            }
-
-            const leftButtonUp = (e.which === 1);
-
-            if (!leftButtonUp) {
-                return;
-            }
-
-            // Left mouse button up to possibly pick or double-pick
-
-            pivotController.hidePivot();
-
-            if (Math.abs(e.clientX - states.mouseDownClientX) > 3 || Math.abs(e.clientY - states.mouseDownClientY) > 3) {
-                return;
-            }
-
-            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");
-
-            if ((!configs.doublePickFlyTo) &&
-                (!doublePickedSubs) &&
-                (!doublePickedSurfaceSubs) &&
-                (!doublePickedNothingSubs)) {
-
-                //  Avoid the single/double click differentiation timeout
-
-                if (pickedSubs || pickedNothingSubs || pickedSurfaceSubs) {
-
-                    pickController.pickCursorPos = states.pointerCanvasPos;
-                    pickController.schedulePickEntity = true;
-                    pickController.schedulePickSurface = pickedSurfaceSubs;
-                    pickController.update();
-
-                    if (pickController.pickResult) {
-
-                        cameraControl.fire("picked", pickController.pickResult, true);
-
-                        if (pickController.pickedSurface) {
-                            cameraControl.fire("pickedSurface", pickController.pickResult, true);
-                        }
-                    } else {
-                        cameraControl.fire("pickedNothing", {
-                            canvasPos: states.pointerCanvasPos
-                        }, true);
-                    }
-                }
-
-                this._clicks = 0;
-
-                return;
-            }
-
-            this._clicks++;
-
-            if (this._clicks === 1) { // First click
-
-                pickController.pickCursorPos = states.pointerCanvasPos;
-                pickController.schedulePickEntity = configs.doublePickFlyTo;
-                pickController.schedulePickSurface = pickedSurfaceSubs;
-                pickController.update();
-
-                const firstClickPickResult = pickController.pickResult;
-                const firstClickPickSurface = pickController.pickedSurface;
-
-                this._timeout = setTimeout(() => {
-
-                    if (firstClickPickResult) {
-
-                        cameraControl.fire("picked", firstClickPickResult, true);
-
-                        if (firstClickPickSurface) {
-
-                            cameraControl.fire("pickedSurface", firstClickPickResult, true);
-
-                            if ((!configs.firstPerson) && configs.followPointer) {
-                                controllers.pivotController.setPivotPos(firstClickPickResult.worldPos);
-                                if (controllers.pivotController.startPivot()) {
-                                    controllers.pivotController.showPivot();
-                                }
-                            }
-                        }
-                    } else {
-                        cameraControl.fire("pickedNothing", {
-                            canvasPos: states.pointerCanvasPos
-                        }, true);
-                    }
-
-                    this._clicks = 0;
-
-                }, configs.doubleClickTimeFrame);
-
-            } else { // Second click
-
-                if (this._timeout !== null) {
-                    window.clearTimeout(this._timeout);
-                    this._timeout = null;
-                }
-
-                pickController.pickCursorPos = states.pointerCanvasPos;
-                pickController.schedulePickEntity = configs.doublePickFlyTo || doublePickedSubs || doublePickedSurfaceSubs;
-                pickController.schedulePickSurface = pickController.schedulePickEntity && doublePickedSurfaceSubs;
-                pickController.update();
-
-                if (pickController.pickResult) {
-
-                    cameraControl.fire("doublePicked", pickController.pickResult, true);
-
-                    if (pickController.pickedSurface) {
-                        cameraControl.fire("doublePickedSurface", pickController.pickResult, true);
-                    }
-
-                    if (configs.doublePickFlyTo) {
-
-                        flyCameraTo(pickController.pickResult);
-
-                        if ((!configs.firstPerson) && configs.followPointer) {
-
-                            const pickedEntityAABB = pickController.pickResult.entity.aabb;
-                            const pickedEntityCenterPos = math.getAABB3Center(pickedEntityAABB);
-
-                            controllers.pivotController.setPivotPos(pickedEntityCenterPos);
-
-                            if (controllers.pivotController.startPivot()) {
-                                controllers.pivotController.showPivot();
-                            }
-                        }
-                    }
-
-                } else {
-
-                    cameraControl.fire("doublePickedNothing", {
-                        canvasPos: states.pointerCanvasPos
-                    }, true);
-
-                    if (configs.doublePickFlyTo) {
-
-                        flyCameraTo();
-
-                        if ((!configs.firstPerson) && configs.followPointer) {
-
-                            const sceneAABB = scene.aabb;
-                            const sceneCenterPos = math.getAABB3Center(sceneAABB);
-
-                            controllers.pivotController.setPivotPos(sceneCenterPos);
-
-                            if (controllers.pivotController.startPivot()) {
-                                controllers.pivotController.showPivot();
-                            }
-                        }
-                    }
-                }
-
-                this._clicks = 0;
-            }
-        }, false);
-    }
-
-    reset() {
-        this._clicks = 0;
-        this._lastPickedEntityId = null;
-        if (this._timeout) {
-            window.clearTimeout(this._timeout);
-            this._timeout = null;
-        }
-    }
-
-    destroy() {
-        const canvas = this._scene.canvas.canvas;
-        canvas.removeEventListener("mousemove", this._canvasMouseMoveHandler);
-        canvas.removeEventListener("mousedown", this._canvasMouseDownHandler);
-        document.removeEventListener("mouseup", this._documentMouseUpHandler);
-        canvas.removeEventListener("mouseup", this._canvasMouseUpHandler);
-        if (this._timeout) {
-            window.clearTimeout(this._timeout);
-            this._timeout = null;
-        }
-    }
-}
-
-
-
-export {MousePickHandler};

package/src/src/viewer/scene/CameraControl/lib/handlers/TouchPanRotateAndDollyHandler.js

@@ -1,288 +0,0 @@
-import {math} from "../../../math/math.js";
-
-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 TouchPanRotateAndDollyHandler {
-
-    constructor(scene, controllers, configs, states, updates) {
-
-        this._scene = scene;
-
-        const pickController = controllers.pickController;
-        const pivotController = controllers.pivotController;
-
-        const tapStartCanvasPos = math.vec2();
-        const tapCanvasPos0 = math.vec2();
-        const tapCanvasPos1 = math.vec2();
-        const touch0Vec = math.vec2();
-
-        const lastCanvasTouchPosList = [];
-        const canvas = this._scene.canvas.canvas;
-
-        let numTouches = 0;
-        let tapStartTime = -1;
-        let waitForTick = false;
-
-        this._onTick = scene.on("tick", () => {
-            waitForTick = false;
-        });
-
-        let firstDragDeltaX = 0;
-        let firstDragDeltaY = 1;
-        let absorbTinyFirstDrag = false;
-
-        canvas.addEventListener("touchstart", this._canvasTouchStartHandler = (event) => {
-
-            if (!(configs.active && configs.pointerEnabled)) {
-                return;
-            }
-
-            event.preventDefault();
-
-            const touches = event.touches;
-            const changedTouches = event.changedTouches;
-
-            states.touchStartTime = Date.now();
-
-            if (touches.length === 1 && changedTouches.length === 1) {
-
-                tapStartTime = states.touchStartTime;
-
-                getCanvasPosFromEvent(touches[0], tapStartCanvasPos);
-
-                if (configs.followPointer) {
-
-                    pickController.pickCursorPos = tapStartCanvasPos;
-                    pickController.schedulePickSurface = true;
-                    pickController.update();
-
-                    if (!configs.planView) {
-
-                        if (pickController.picked && pickController.pickedSurface && pickController.pickResult && pickController.pickResult.worldPos) {
-
-                            pivotController.setPivotPos(pickController.pickResult.worldPos);
-
-                            if (!configs.firstPerson && pivotController.startPivot()) {
-                                pivotController.showPivot();
-                            }
-
-                        } else {
-
-                            if (configs.smartPivot) {
-                                pivotController.setCanvasPivotPos(states.pointerCanvasPos);
-                            } else {
-                                pivotController.setPivotPos(scene.camera.look);
-                            }
-
-                            if (!configs.firstPerson && pivotController.startPivot()) {
-                                pivotController.showPivot();
-                            }
-                        }
-                    }
-                }
-
-            } else {
-                tapStartTime = -1;
-            }
-
-            while (lastCanvasTouchPosList.length < touches.length) {
-                lastCanvasTouchPosList.push(math.vec2());
-            }
-
-            for (let i = 0, len = touches.length; i < len; ++i) {
-                getCanvasPosFromEvent(touches[i], lastCanvasTouchPosList[i]);
-            }
-
-            numTouches = touches.length;
-        });
-
-        canvas.addEventListener("touchend", this._canvasTouchEndHandler = () => {
-            if (pivotController.getPivoting()) {
-                pivotController.endPivot()
-            }
-            firstDragDeltaX = 0;
-            firstDragDeltaY = 0;
-            absorbTinyFirstDrag = true;
-        })
-
-        canvas.addEventListener("touchmove", this._canvasTouchMoveHandler = (event) => {
-
-            if (!(configs.active && configs.pointerEnabled)) {
-                return;
-            }
-
-            event.stopPropagation();
-            event.preventDefault();
-
-            if (waitForTick) {
-                // Limit changes detection to one per frame
-                return;
-            }
-
-            waitForTick = true;
-
-            // Scaling drag-rotate to canvas boundary
-
-            const canvasBoundary = scene.canvas.boundary;
-            const canvasWidth = canvasBoundary[2];
-            const canvasHeight = canvasBoundary[3];
-
-            const touches = event.touches;
-
-            if (event.touches.length !== numTouches) {
-                // Two fingers were pressed, then one of them is removed
-                // We don't want to rotate in this case (weird behavior)
-                return;
-            }
-
-            if (numTouches === 1) {
-
-                getCanvasPosFromEvent(touches[0], tapCanvasPos0);
-
-                //-----------------------------------------------------------------------------------------------
-                // Drag rotation
-                //-----------------------------------------------------------------------------------------------
-
-                math.subVec2(tapCanvasPos0, lastCanvasTouchPosList[0], touch0Vec);
-
-                const xPanDelta = touch0Vec[0];
-                const yPanDelta = touch0Vec[1];
-
-                if (states.longTouchTimeout !== null && (Math.abs(xPanDelta) > configs.longTapRadius || Math.abs(yPanDelta) > configs.longTapRadius)) {
-                    clearTimeout(states.longTouchTimeout);
-                    states.longTouchTimeout = null;
-                }
-
-                if (configs.planView) { // No rotating in plan-view mode
-
-                    const camera = scene.camera;
-
-                    // We use only canvasHeight here so that aspect ratio does not distort speed
-
-                    if (camera.projection === "perspective") {
-
-                        const touchPicked = false;
-                        const pickedWorldPos = [0, 0, 0];
-
-                        const depth = Math.abs(touchPicked ? 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 += (xPanDelta * targetDistance / canvasHeight) * configs.touchPanRate;
-                        updates.panDeltaY += (yPanDelta * targetDistance / canvasHeight) * configs.touchPanRate;
-
-                    } else {
-
-                        updates.panDeltaX += 0.5 * camera.ortho.scale * (xPanDelta / canvasHeight) * configs.touchPanRate;
-                        updates.panDeltaY += 0.5 * camera.ortho.scale * (yPanDelta / canvasHeight) * configs.touchPanRate;
-                    }
-
-                } else {
-                  //  if (!absorbTinyFirstDrag) {
-                        updates.rotateDeltaY -= (xPanDelta / canvasWidth) * (configs.dragRotationRate * 1.0); // Full horizontal rotation
-                        updates.rotateDeltaX += (yPanDelta / canvasHeight) * (configs.dragRotationRate * 1.5); // Half vertical rotation
-                    // } else {
-                    //     firstDragDeltaY -= (xPanDelta / canvasWidth) * (configs.dragRotationRate * 1.0); // Full horizontal rotation
-                    //     firstDragDeltaX += (yPanDelta / canvasHeight) * (configs.dragRotationRate * 1.5); // Half vertical rotation
-                    //     if (Math.abs(firstDragDeltaX) > 5 || Math.abs(firstDragDeltaY) > 5) {
-                    //         updates.rotateDeltaX += firstDragDeltaX;
-                    //         updates.rotateDeltaY += firstDragDeltaY;
-                    //         firstDragDeltaX = 0;
-                    //         firstDragDeltaY = 0;
-                    //         absorbTinyFirstDrag = false;
-                    //     }
-                    // }
-                }
-
-            } else if (numTouches === 2) {
-
-                const touch0 = touches[0];
-                const touch1 = touches[1];
-
-                getCanvasPosFromEvent(touch0, tapCanvasPos0);
-                getCanvasPosFromEvent(touch1, tapCanvasPos1);
-
-                const lastMiddleTouch = math.geometricMeanVec2(lastCanvasTouchPosList[0], lastCanvasTouchPosList[1]);
-                const currentMiddleTouch = math.geometricMeanVec2(tapCanvasPos0, tapCanvasPos1);
-
-                const touchDelta = math.vec2();
-
-                math.subVec2(lastMiddleTouch, currentMiddleTouch, touchDelta);
-
-                const xPanDelta = touchDelta[0];
-                const yPanDelta = touchDelta[1];
-
-                const camera = scene.camera;
-
-                // Dollying
-
-                const d1 = math.distVec2([touch0.pageX, touch0.pageY], [touch1.pageX, touch1.pageY]);
-                const d2 = math.distVec2(lastCanvasTouchPosList[0], lastCanvasTouchPosList[1]);
-
-                const dollyDelta = (d2 - d1) * configs.touchDollyRate;
-
-                updates.dollyDelta = dollyDelta;
-
-                if (Math.abs(dollyDelta) < 1.0) {
-
-                    // We use only canvasHeight here so that aspect ratio does not distort speed
-
-                    if (camera.projection === "perspective") {
-                        const pickedWorldPos = pickController.pickResult ? pickController.pickResult.worldPos : scene.center;
-
-                        const depth = Math.abs(math.lenVec3(math.subVec3(pickedWorldPos, scene.camera.eye, [])));
-                        const targetDistance = depth * Math.tan((camera.perspective.fov / 2) * Math.PI / 180.0);
-
-                        updates.panDeltaX -= (xPanDelta * targetDistance / canvasHeight) * configs.touchPanRate;
-                        updates.panDeltaY -= (yPanDelta * targetDistance / canvasHeight) * configs.touchPanRate;
-
-                    } else {
-
-                        updates.panDeltaX -= 0.5 * camera.ortho.scale * (xPanDelta / canvasHeight) * configs.touchPanRate;
-                        updates.panDeltaY -= 0.5 * camera.ortho.scale * (yPanDelta / canvasHeight) * configs.touchPanRate;
-                    }
-                }
-
-
-                states.pointerCanvasPos = currentMiddleTouch;
-            }
-
-            for (let i = 0; i < numTouches; ++i) {
-                getCanvasPosFromEvent(touches[i], lastCanvasTouchPosList[i]);
-            }
-        });
-    }
-
-    reset() {
-    }
-
-    destroy() {
-        const canvas = this._scene.canvas.canvas;
-        canvas.removeEventListener("touchstart", this._canvasTouchStartHandler);
-        canvas.removeEventListener("touchend", this._canvasTouchEndHandler);
-        canvas.removeEventListener("touchmove", this._canvasTouchMoveHandler);
-        this._scene.off(this._onTick);
-    }
-}
-
-export {TouchPanRotateAndDollyHandler};