three-base 1.129.15 → 2.0.1

package/lib/FPScontrol.js

@@ -1,170 +0,0 @@
-/*
- * @Author: xiaosihan
- * @Date: 2022-05-04 23:01:36
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2022-06-06 13:32:08
- */
-import { Clock, EventDispatcher, Vector3 } from "three";
-import { Capsule } from "three/examples/jsm/math/Capsule";
-import { Octree } from "three/examples/jsm/math/Octree";
-import { clamp, degToRad } from "three/src/math/MathUtils";
-/**
- * 第一人称控制器
- *
- * @export
- * @class FPScontrol
- * @extends {EventDispatcher}
- */
-export default class FPScontrol extends EventDispatcher {
-    canvas;
-    constructor(camera, canvas) {
-        super();
-        // 相机对象
-        this.camera = camera;
-        this.camera.rotation.order = 'YXZ';
-        this.canvas = canvas;
-        this.init(canvas);
-    }
-    // 是否启用
-    enable = false;
-    GRAVITY = 30; // 重力
-    STEPS_PER_FRAME = 5; // 速度
-    camera;
-    // 世界八叉树对象
-    worldOctree = new Octree();
-    // 用户自己的碰撞体积
-    playerCollider = new Capsule(new Vector3(0, 0.35, 0), new Vector3(0, 1, 0), 0.35);
-    // 时钟对象
-    clock = new Clock();
-    playerVelocity = new Vector3();
-    playerDirection = new Vector3();
-    playerOnFloor = false;
-    mouseTime = 0;
-    isMousedown = false;
-    keyStates = {};
-    init(canvas) {
-        this.playerCollider.end.set(0, 1, 0);
-        document.addEventListener('keydown', this.keydown);
-        document.addEventListener('keyup', this.keyup);
-        canvas.addEventListener('pointerdown', this.mousedown);
-        document.addEventListener('pointerup', this.mouseup);
-        document.body.addEventListener('pointermove', this.mousemove);
-        this.enable = true;
-    }
-    keydown = (event) => {
-        this.keyStates[event.code] = true;
-    };
-    keyup = (event) => {
-        this.keyStates[event.code] = false;
-    };
-    mousedown = () => {
-        this.isMousedown = true;
-        this.mouseTime = performance.now();
-    };
-    mouseup = () => {
-        this.isMousedown = false;
-    };
-    mousemove = (event) => {
-        if (this.enable && this.isMousedown) {
-            this.camera.rotation.y -= event.movementX / 500;
-            this.camera.rotation.x -= event.movementY / 500;
-        }
-    };
-    // 设置 八叉树 节点
-    fromGraphNode(object3d) {
-        this.worldOctree.fromGraphNode(object3d);
-    }
-    // 获取前进的向量
-    getForwardVector = () => {
-        this.camera.getWorldDirection(this.playerDirection);
-        this.playerDirection.y = 0;
-        this.playerDirection.normalize();
-        return this.playerDirection;
-    };
-    // 获取 后退的向量
-    getSideVector = () => {
-        this.camera.getWorldDirection(this.playerDirection);
-        this.playerDirection.y = 0;
-        this.playerDirection.normalize();
-        this.playerDirection.cross(this.camera.up);
-        return this.playerDirection;
-    };
-    // 玩家移动控制器
-    controls = (deltaTime) => {
-        const speedDelta = deltaTime * (this.playerOnFloor ? 25 : 8);
-        if (this.keyStates['KeyW']) {
-            this.playerVelocity.add(this.getForwardVector().multiplyScalar(speedDelta));
-        }
-        if (this.keyStates['KeyS']) {
-            this.playerVelocity.add(this.getForwardVector().multiplyScalar(-speedDelta));
-        }
-        if (this.keyStates['KeyA']) {
-            this.playerVelocity.add(this.getSideVector().multiplyScalar(-speedDelta));
-        }
-        if (this.keyStates['KeyD']) {
-            this.playerVelocity.add(this.getSideVector().multiplyScalar(speedDelta));
-        }
-        if (this.playerOnFloor) {
-            if (this.keyStates['Space']) {
-                this.playerVelocity.y = 15;
-            }
-        }
-    };
-    // 更新玩家的位置
-    updatePlayer = (deltaTime) => {
-        let damping = Math.exp(-4 * deltaTime) - 1;
-        if (!this.playerOnFloor) {
-            this.playerVelocity.y -= this.GRAVITY * deltaTime;
-            damping *= 0.1;
-        }
-        this.playerVelocity.addScaledVector(this.playerVelocity, damping);
-        const deltaPosition = this.playerVelocity.clone().multiplyScalar(deltaTime);
-        this.playerCollider.translate(deltaPosition);
-        this.playerCollisions();
-        this.camera.position.copy(this.playerCollider.end);
-        this.camera.position.y += 1;
-        this.camera.rotation.x = clamp(this.camera.rotation.x, degToRad(-20), degToRad(20));
-    };
-    // 玩家的碰撞检测
-    playerCollisions() {
-        const result = this.worldOctree.capsuleIntersect(this.playerCollider);
-        this.playerOnFloor = false;
-        if (result) {
-            this.playerOnFloor = result.normal.y > 0;
-            if (!this.playerOnFloor) {
-                this.playerVelocity.addScaledVector(result.normal, -result.normal.dot(this.playerVelocity));
-            }
-            this.playerCollider.translate(result.normal.multiplyScalar(result.depth));
-        }
-    }
-    // 更新控制器的位置
-    teleportPlayerIfOob = () => {
-        if (this.camera.position.y <= -10) {
-            this.playerCollider.start.set(0, 0.35, 0);
-            this.playerCollider.end.set(0, 1, 10);
-            this.playerCollider.radius = 0.35;
-            this.camera.position.copy(this.playerCollider.end);
-            // this.camera.position.set(0, 3, 0);
-        }
-    };
-    // 更新
-    update() {
-        if (this.enable) {
-            const deltaTime = Math.min(0.05, this.clock.getDelta()) / this.STEPS_PER_FRAME;
-            for (let i = 0; i < this.STEPS_PER_FRAME; i++) {
-                this.controls(deltaTime);
-                this.updatePlayer(deltaTime);
-                this.teleportPlayerIfOob();
-            }
-        }
-    }
-    // 销毁事件
-    disposer() {
-        this.enable = false;
-        document.removeEventListener('keydown', this.keydown);
-        document.removeEventListener('keyup', this.keyup);
-        this.canvas.removeEventListener('pointerdown', this.mousedown);
-        document.removeEventListener('pointerup', this.mouseup);
-        document.body.removeEventListener('pointermove', this.mousemove);
-    }
-}

package/lib/FPScontrol.ts

@@ -1,209 +0,0 @@
-/*
- * @Author: xiaosihan 
- * @Date: 2022-05-04 23:01:36 
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2022-06-06 13:32:08
- */
-
-import { Camera, Clock, EventDispatcher, Object3D, Vector3 } from "three";
-import { Capsule } from "three/examples/jsm/math/Capsule";
-import { Octree } from "three/examples/jsm/math/Octree";
-import { clamp, degToRad } from "three/src/math/MathUtils";
-
-
-/**
- * 第一人称控制器
- *
- * @export
- * @class FPScontrol
- * @extends {EventDispatcher}
- */
-export default class FPScontrol extends EventDispatcher {
-
-    canvas!: HTMLCanvasElement
-
-    constructor(camera: Camera, canvas: HTMLCanvasElement) {
-        super();
-
-        // 相机对象
-        this.camera = camera;
-
-        this.camera.rotation.order = 'YXZ';
-
-        this.canvas = canvas;
-
-        this.init(canvas);
-    }
-
-    // 是否启用
-    enable = false;
-
-    GRAVITY = 30; // 重力
-    STEPS_PER_FRAME = 5; // 速度
-
-    camera!: Camera;
-
-    // 世界八叉树对象
-    worldOctree = new Octree();
-
-    // 用户自己的碰撞体积
-    playerCollider = new Capsule(new Vector3(0, 0.35, 0), new Vector3(0, 1, 0), 0.35);
-
-    // 时钟对象
-    clock = new Clock();
-
-    playerVelocity = new Vector3();
-    playerDirection = new Vector3();
-
-    playerOnFloor = false;
-    mouseTime = 0;
-    isMousedown = false;
-    keyStates: { [key: string]: boolean } = {};
-
-
-    init(canvas: HTMLCanvasElement) {
-        this.playerCollider.end.set(0, 1, 0);
-        document.addEventListener('keydown', this.keydown);
-        document.addEventListener('keyup', this.keyup);
-        canvas.addEventListener('pointerdown', this.mousedown);
-        document.addEventListener('pointerup', this.mouseup);
-        document.body.addEventListener('pointermove', this.mousemove);
-        this.enable = true;
-    }
-
-
-    keydown = (event: KeyboardEvent) => {
-        this.keyStates[event.code] = true;
-    }
-
-    keyup = (event: KeyboardEvent) => {
-        this.keyStates[event.code] = false;
-    }
-
-    mousedown = () => {
-        this.isMousedown = true;
-        this.mouseTime = performance.now();
-    }
-
-    mouseup = () => {
-        this.isMousedown = false;
-    }
-
-    mousemove = (event: MouseEvent) => {
-        if (this.enable && this.isMousedown) {
-            this.camera.rotation.y -= event.movementX / 500;
-            this.camera.rotation.x -= event.movementY / 500;
-
-        }
-    }
-
-    // 设置 八叉树 节点
-    fromGraphNode(object3d: Object3D) {
-        this.worldOctree.fromGraphNode(object3d);
-    }
-
-    // 获取前进的向量
-    getForwardVector = () => {
-        this.camera.getWorldDirection(this.playerDirection);
-        this.playerDirection.y = 0;
-        this.playerDirection.normalize();
-        return this.playerDirection;
-    }
-
-    // 获取 后退的向量
-    getSideVector = () => {
-        this.camera.getWorldDirection(this.playerDirection);
-        this.playerDirection.y = 0;
-        this.playerDirection.normalize();
-        this.playerDirection.cross(this.camera.up);
-        return this.playerDirection;
-    }
-
-    // 玩家移动控制器
-    controls = (deltaTime: number) => {
-        const speedDelta = deltaTime * (this.playerOnFloor ? 25 : 8);
-        if (this.keyStates['KeyW']) {
-            this.playerVelocity.add(this.getForwardVector().multiplyScalar(speedDelta));
-        }
-        if (this.keyStates['KeyS']) {
-            this.playerVelocity.add(this.getForwardVector().multiplyScalar(-speedDelta));
-        }
-        if (this.keyStates['KeyA']) {
-            this.playerVelocity.add(this.getSideVector().multiplyScalar(-speedDelta));
-        }
-        if (this.keyStates['KeyD']) {
-            this.playerVelocity.add(this.getSideVector().multiplyScalar(speedDelta));
-        }
-
-        if (this.playerOnFloor) {
-            if (this.keyStates['Space']) {
-                this.playerVelocity.y = 15;
-            }
-        }
-
-    }
-
-    // 更新玩家的位置
-    updatePlayer = (deltaTime: number) => {
-        let damping = Math.exp(-4 * deltaTime) - 1;
-        if (!this.playerOnFloor) {
-            this.playerVelocity.y -= this.GRAVITY * deltaTime;
-            damping *= 0.1;
-        }
-        this.playerVelocity.addScaledVector(this.playerVelocity, damping);
-        const deltaPosition = this.playerVelocity.clone().multiplyScalar(deltaTime);
-        this.playerCollider.translate(deltaPosition);
-        this.playerCollisions();
-        this.camera.position.copy(this.playerCollider.end);
-        this.camera.position.y += 1;
-        this.camera.rotation.x = clamp(this.camera.rotation.x, degToRad(-20), degToRad(20));
-    }
-
-    // 玩家的碰撞检测
-    playerCollisions() {
-        const result = this.worldOctree.capsuleIntersect(this.playerCollider);
-        this.playerOnFloor = false;
-        if (result) {
-            this.playerOnFloor = result.normal.y > 0;
-            if (!this.playerOnFloor) {
-                this.playerVelocity.addScaledVector(result.normal, -result.normal.dot(this.playerVelocity));
-
-            }
-            this.playerCollider.translate(result.normal.multiplyScalar(result.depth));
-        }
-    }
-    // 更新控制器的位置
-    teleportPlayerIfOob = () => {
-        if (this.camera.position.y <= -10) {
-            this.playerCollider.start.set(0, 0.35, 0);
-            this.playerCollider.end.set(0, 1, 10);
-            this.playerCollider.radius = 0.35;
-            this.camera.position.copy(this.playerCollider.end);
-            // this.camera.position.set(0, 3, 0);
-        }
-    }
-
-    // 更新
-    update() {
-        if (this.enable) {
-            const deltaTime = Math.min(0.05, this.clock.getDelta()) / this.STEPS_PER_FRAME;
-            for (let i = 0; i < this.STEPS_PER_FRAME; i++) {
-                this.controls(deltaTime);
-                this.updatePlayer(deltaTime);
-                this.teleportPlayerIfOob();
-            }
-        }
-    }
-
-    // 销毁事件
-    disposer() {
-        this.enable = false;
-        document.removeEventListener('keydown', this.keydown);
-        document.removeEventListener('keyup', this.keyup);
-        this.canvas.removeEventListener('pointerdown', this.mousedown);
-        document.removeEventListener('pointerup', this.mouseup);
-        document.body.removeEventListener('pointermove', this.mousemove);
-    }
-
-
-}

package/lib/InstancedGroupMesh.d.ts

@@ -1,10 +0,0 @@
-import * as THREE from 'three';
-export default class InstancedGroupMesh extends THREE.Mesh {
-    isInstancedGroupMesh: boolean;
-    count: number;
-    meshCollect: Record<string, THREE.Mesh[]>;
-    instanceCollect: Record<string, THREE.InstancedMesh>;
-    static matrix: THREE.Matrix4;
-    constructor(group: THREE.Group, count: number);
-    setMatrixAt(index: number, matrix: THREE.Matrix4): void;
-}

package/lib/InstancedGroupMesh.js

@@ -1,63 +0,0 @@
-/*
- * @Author: xiaosihan
- * @Date: 2023-02-21 09:55:52
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2023-02-26 14:42:21
- */
-import * as THREE from 'three';
-// 模型组转成 实例对象
-export default class InstancedGroupMesh extends THREE.Mesh {
-    isInstancedGroupMesh = true;
-    count = 0;
-    meshCollect = {};
-    instanceCollect = {};
-    static matrix = new THREE.Matrix4();
-    constructor(group, count) {
-        super();
-        this.count = count;
-        const { meshCollect, instanceCollect } = this;
-        group.updateMatrixWorld(true);
-        // collect all mesh counts, in case there are more than one copy of the same mesh in this group
-        group.traverse((obj) => {
-            const mesh = obj;
-            if (mesh.isMesh) {
-                mesh.matrixWorld.decompose(mesh.position, mesh.quaternion, mesh.scale);
-                mesh.rotation.setFromQuaternion(mesh.quaternion);
-                mesh.updateMatrix();
-                // same geometry and same material consider as the same mesh
-                const uuid = mesh.geometry.uuid + '/' + mesh.material.uuid;
-                if (meshCollect[uuid]) {
-                    meshCollect[uuid].push(mesh);
-                }
-                else {
-                    meshCollect[uuid] = [mesh];
-                }
-            }
-            else {
-                obj.position.set(0, 0, 0);
-                obj.scale.set(1, 1, 1);
-                obj.rotation.set(0, 0, 0);
-            }
-        });
-        // create all instances
-        Object.keys(meshCollect).forEach(uuid => {
-            const meshes = meshCollect[uuid];
-            const mesh = meshes[0];
-            const instancedMesh = new THREE.InstancedMesh(mesh.geometry, mesh.material, meshes.length * count);
-            instanceCollect[uuid] = instancedMesh;
-            this.add(instancedMesh);
-        });
-    }
-    setMatrixAt(index, matrix) {
-        Object.keys(this.meshCollect).forEach(uuid => {
-            const instancedMesh = this.instanceCollect[uuid];
-            const collect = this.meshCollect[uuid];
-            collect.forEach((mesh, i) => {
-                InstancedGroupMesh.matrix.copy(mesh.matrix);
-                InstancedGroupMesh.matrix.premultiply(matrix);
-                instancedMesh.setMatrixAt(collect.length * index + i, InstancedGroupMesh.matrix);
-                instancedMesh.instanceMatrix.needsUpdate = true;
-            });
-        });
-    }
-}

package/lib/InstancedGroupMesh.ts

@@ -1,80 +0,0 @@
-/*
- * @Author: xiaosihan 
- * @Date: 2023-02-21 09:55:52 
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2023-02-26 14:42:21
- */
-
-import * as THREE from 'three'
-
-// 模型组转成 实例对象
-export default class InstancedGroupMesh extends THREE.Mesh {
-    isInstancedGroupMesh = true
-
-    count: number = 0
-
-    meshCollect: Record<string, THREE.Mesh[]> = {}
-
-    instanceCollect: Record<string, THREE.InstancedMesh> = {}
-
-    static matrix = new THREE.Matrix4()
-
-    constructor(group: THREE.Group, count: number) {
-        super()
-
-        this.count = count
-
-        const { meshCollect, instanceCollect } = this
-
-        group.updateMatrixWorld(true);
-
-        // collect all mesh counts, in case there are more than one copy of the same mesh in this group
-        group.traverse((obj) => {
-            const mesh = obj as THREE.Mesh
-            if (mesh.isMesh) {
-
-                mesh.matrixWorld.decompose(mesh.position, mesh.quaternion, mesh.scale);
-                mesh.rotation.setFromQuaternion(mesh.quaternion);
-                mesh.updateMatrix();
-
-                // same geometry and same material consider as the same mesh
-                const uuid = mesh.geometry.uuid + '/' + (mesh.material as THREE.Material).uuid
-
-                if (meshCollect[uuid]) {
-                    meshCollect[uuid].push(mesh)
-                } else {
-                    meshCollect[uuid] = [mesh]
-                }
-            } else {
-                obj.position.set(0, 0, 0);
-                obj.scale.set(1, 1, 1);
-                obj.rotation.set(0, 0, 0);
-            }
-
-        })
-
-        // create all instances
-        Object.keys(meshCollect).forEach(uuid => {
-            const meshes = meshCollect[uuid]
-            const mesh = meshes[0]
-
-            const instancedMesh = new THREE.InstancedMesh(mesh.geometry, mesh.material, meshes.length * count)
-            instanceCollect[uuid] = instancedMesh
-            this.add(instancedMesh)
-        })
-    }
-
-    setMatrixAt(index: number, matrix: THREE.Matrix4) {
-        Object.keys(this.meshCollect).forEach(uuid => {
-            const instancedMesh = this.instanceCollect[uuid]
-            const collect = this.meshCollect[uuid]
-            collect.forEach((mesh: THREE.Mesh, i: number) => {
-                InstancedGroupMesh.matrix.copy(mesh.matrix)
-                InstancedGroupMesh.matrix.premultiply(matrix)
-
-                instancedMesh.setMatrixAt(collect.length * index + i, InstancedGroupMesh.matrix);
-                instancedMesh.instanceMatrix.needsUpdate = true;
-            })
-        })
-    }
-}

package/lib/KeyFrameAnimation.d.ts

@@ -1,25 +0,0 @@
-import { Euler, Line, LineBasicMaterial, Object3D, Vector3 } from "three";
-export type Keyframe = {
-    position: Vector3;
-    scale: Vector3;
-    rotation: Euler;
-    timeTemp: number;
-};
-export type KeyframeAnimationProps = {
-    speedScale?: number;
-    object3d: Object3D;
-    keyframes: Array<Keyframe>;
-};
-export default class KeyframeAnimation extends Object3D {
-    constructor(props: KeyframeAnimationProps);
-    speedScale: number;
-    object3d: Object3D;
-    halperLine: Line<any, LineBasicMaterial>;
-    keyframes: Array<Keyframe>;
-    setObject3D(object3d: Object3D): void;
-    getKeyframe(i: number): Keyframe;
-    setKeyframe(i: number, keyframe: Keyframe): void;
-    setKeyframes(keyframes: Array<Keyframe>): void;
-    update(): void;
-    updateMatrix(): void;
-}

package/lib/KeyFrameAnimation.js

@@ -1,78 +0,0 @@
-/*
- * @Author: xiaosihan
- * @Date: 2023-02-16 00:22:31
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2023-02-16 19:08:55
- */
-import { last } from "lodash";
-import { BufferAttribute, Line, LineBasicMaterial, Object3D } from "three";
-import threeUtils from "./threeUtils";
-// 关键帧动画对象
-export default class KeyframeAnimation extends Object3D {
-    constructor(props) {
-        super();
-        // 速度调整
-        this.speedScale = props.speedScale || 1;
-        // 设置关键帧对象数组
-        this.setKeyframes(props.keyframes);
-        // 设置对象
-        this.setObject3D(props.object3d);
-    }
-    // 速度调整
-    speedScale = 1;
-    // 需要需要移动的对象
-    object3d;
-    //路径辅助线
-    halperLine = new Line(undefined, new LineBasicMaterial({ color: "#f00" }));
-    // 关键帧数组
-    keyframes = [];
-    // 设置需要移动的对象
-    setObject3D(object3d) {
-        this.object3d = object3d;
-        if (threeUtils.isDev) {
-            this.children = [object3d, this.halperLine];
-        }
-        else {
-            this.children = [object3d];
-        }
-    }
-    // 获取单个关键帧
-    getKeyframe(i) {
-        return this.keyframes[i];
-    }
-    // 设置单个关键帧
-    setKeyframe(i, keyframe) {
-        this.keyframes[i] = keyframe;
-        this.setKeyframes(this.keyframes);
-    }
-    //设置全部关键帧
-    setKeyframes(keyframes) {
-        this.keyframes = keyframes;
-        const position = [];
-        keyframes.map(k => {
-            position.push(k.position.x);
-            position.push(k.position.y);
-            position.push(k.position.z);
-        });
-        this.halperLine.geometry.setAttribute("position", new BufferAttribute(new Float32Array(position), 3, false));
-    }
-    // 更具关键帧的信息更新 对象的位置
-    update() {
-        const { _timeTemp } = threeUtils;
-        const maxtimetemp = last(this.keyframes).timeTemp;
-        const currentTime = _timeTemp % maxtimetemp;
-        const currentKeyframeIndex = this.keyframes.findIndex(k => currentTime < k.timeTemp);
-        const startKeyframe = this.keyframes[currentKeyframeIndex - 1];
-        const endKeyframe = this.keyframes[currentKeyframeIndex];
-        const progress = (currentTime - startKeyframe.timeTemp) / (endKeyframe.timeTemp - startKeyframe.timeTemp);
-        this.object3d.position.copy(endKeyframe.position).sub(startKeyframe.position).multiplyScalar(progress).add(startKeyframe.position);
-        this.object3d.scale.copy(endKeyframe.scale).sub(startKeyframe.scale).multiplyScalar(progress).add(startKeyframe.scale);
-        this.object3d.rotation.set((endKeyframe.rotation.x - startKeyframe.rotation.x) * progress + startKeyframe.rotation.x, (endKeyframe.rotation.y - startKeyframe.rotation.y) * progress + startKeyframe.rotation.y, (endKeyframe.rotation.z - startKeyframe.rotation.z) * progress + startKeyframe.rotation.z);
-        this.dispatchEvent({ type: "update" });
-    }
-    //更新关键帧的实例矩阵
-    updateMatrix() {
-        this.update();
-        super.updateMatrix();
-    }
-}