three-base 1.129.17 → 2.0.1

package/lib/Transition.ts

@@ -1,268 +0,0 @@
-/*
- * @Author: xiaosihan
- * @Date: 2021-04-10 02:44:01
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2022-06-22 19:44:23
- */
-
-import threeUtils from "./threeUtils";
-
-function bezier(arr: [number, number, number, number], t: number) {
-    const ut = 1 - t;
-    const a1 = arr[1] * ut + arr[2] * t;
-    const result = ((arr[0] * ut + arr[1] * t) * ut + a1 * t) * ut + (a1 * ut + (arr[2] * ut + arr[3] * t) * t) * t;
-    return result;
-}
-
-interface TParam { [key: string]: number }
-
-// 过渡动画插件
-export default class Transition {
-
-    /**
-     *Creates an instance of transition.
-     * @param {{ [key: string]: number }} // 初始值
-     * @param {[0.8, 0, 0.2, 1]} // 贝塞尔曲线
-     * @param {number} [duration=1000]  // 过渡时间
-     * @memberof transition
-     */
-    constructor(
-        param: TParam = {},
-        bezier: [number, number, number, number] = [0.8, 0, 0.2, 1],
-        duration = 500
-    ) {
-
-        this.setDuration(duration);
-
-        this.setBezier(bezier);
-
-        this.reset(param);
-    }
-
-    // 所有的 key 的枚举
-    _keys: Array<string> = [];
-
-    // 贝塞尔曲线
-    _bezier: [number, number, number, number] = [0.8, 0, 0.2, 1];
-
-    // x轴贝塞尔
-    _Xbezier: [number, number, number, number] = [0, 0.8, 0.2, 1];
-
-    // y轴贝塞尔
-    _Ybezier: [number, number, number, number] = [0, 0, 1, 1];
-
-    setBezier(bezier: [number, number, number, number] = [0.8, 0, 0.2, 1]): this {
-        this._bezier = [...bezier];
-        this._Xbezier = [0, bezier[0], bezier[2], 1];
-        this._Ybezier = [0, bezier[1], bezier[3], 1];
-        return this;
-    }
-
-    // 当前时间戳
-    timeTemp = performance.now();
-
-    // 过渡时间
-    _duration = 0;
-
-    //延时
-    _delay = 0;
-
-    // 设置过渡时间
-    setDuration(duration = 500): this {
-        this._duration = duration;
-        return this;
-    }
-
-    // 设置延时
-    setDelay(delay = 0) {
-        this._delay = delay;
-        return this;
-    }
-
-    // 存储 每个参数的 起始位置 起始时间 终止位置  终止时间
-    _: { [key: string]: number } = {};
-
-    private onChangeCall = (josn: { [key: string]: number }) => { };
-
-    // 执行过度动画
-    run({ timeTemp }: any) {
-        this.timeTemp = timeTemp;
-        if (!this.onChangeCall || this.isDone()) {
-            threeUtils.removeEventListener("requestAnimationFrame", this.runbindThis);
-        } else {
-            this.onChangeCall(this.getJson());
-        }
-        return this;
-    }
-
-    runbindThis = this.run.bind(this);
-
-    // 设置动画对象的回调事件
-    onChange(onChangeCall: (josn: { [key: string]: number }) => void): this {
-        this.onChangeCall = onChangeCall;
-        this.onChangeCall(this.getJson());
-        return this;
-    }
-
-    // 计算当前 key 的值
-    get(key: string | number): number {
-
-        key = String(key);
-
-        if (this._keys.includes(key) && this.timeTemp < (this._[key + "_startTime"] + this._duration)) {
-
-            let start = this._[key + "_start"];
-
-            let end = this._[key + "_end"];
-
-            let timeProgress = Math.min(1, Math.max(0, (this.timeTemp - this._[key + "_startTime"]) / this._duration));
-
-            // 斜率
-            let t = 0;
-
-            // 微分法 求斜率t
-            while (bezier(this._Xbezier, t + 0.1) < timeProgress) {
-                t += 0.1;
-            }
-            while (bezier(this._Xbezier, t + 0.01) < timeProgress) {
-                t += 0.01;
-            }
-            while (bezier(this._Xbezier, t + 0.001) < timeProgress) {
-                t += 0.001;
-            }
-
-            t = Math.min(1, Math.max(0, t))  // 斜率最大为1
-
-            // 通过斜率求y值
-            return (bezier(this._Ybezier, t) * (end - start)) + start;
-
-        } else if (this._keys.includes(key) && this.timeTemp >= (this._[key + "_startTime"] + this._duration)) {
-
-            return this._[key + "_end"];
-        }
-
-        // `没有 ${key} 的值`;
-        return 0;
-    }
-
-    async set(param: TParam): Promise<this> {
-
-        let timetemp = performance.now() + this._delay;;
-
-        for (let key in param) {
-
-            // 有就赋值
-            if (this._keys.includes(key) && Math.abs(param[key] - this._[key + "_end"]) > 0.001) {
-
-                this._[key + "_start"] = this.get(key);
-
-                this._[key + "_end"] = param[key];
-                // 起始时间
-                this._[key + "_startTime"] = timetemp;
-
-                // 执行状态未完成
-                this._isDone = false;
-
-                // 没有就添加一个
-            } else if (!this._keys.includes(key)) {
-
-                this._[key + "_start"] = param[key];
-
-                this._[key + "_end"] = param[key];
-                // 起始时间
-                this._[key + "_startTime"] = timetemp - this._duration;
-
-                // 执行状态未完成
-                this._isDone = false;
-            }
-
-            if (!this._keys.includes(key)) {
-                this._keys.push(key);
-            }
-
-            // // 执行状态未完成
-            // this._isDone = false;
-
-        }
-
-        if (!this._isDone) {
-            threeUtils.removeEventListener("requestAnimationFrame", this.runbindThis);
-            threeUtils.addEventListener("requestAnimationFrame", this.runbindThis);
-            await new Promise(resolve => setTimeout(resolve, this._duration + 50));
-        }
-
-        return this;
-    }
-    // 重置起始和终止位置
-    reset(param: TParam): this {
-
-        for (let key in param) {
-
-            if (!this._keys.includes(key)) {
-                this._keys.push(key);
-            }
-
-            this._[key + "_start"] = param[key];
-            this._[key + "_end"] = param[key];
-            this._[key + "_startTime"] = -this._duration;
-        }
-
-        if (this.onChangeCall) {
-            this.onChangeCall(this.getJson());
-        }
-
-        this._isDone = true;
-        return this;
-    }
-
-    // 获取过渡对象上面的key
-    getKeys(): string[] {
-        return [...this._keys];
-    }
-
-    // 判断是否有这个参数
-    hasKey(key: string): boolean {
-        return this._keys.includes(key);
-    }
-
-    // 获取全部参数
-    getJson(): { [key: string]: number } {
-        let keys = this.getKeys();
-
-        let json: { [key: string]: number } = {};
-
-        keys.map(key => {
-            json[key] = this.get(key);
-        });
-        return json;
-    }
-
-    _isDone = false;
-
-    // 是否执行完成了
-    isDone(): boolean {
-
-        if (this._isDone) {
-            return true;
-        }
-
-        let isisDone = false;
-
-        for (let i in this._keys) {
-
-            isisDone = this._[this._keys[i] + "_startTime"] + this._duration < this.timeTemp;
-
-            // 只要有一个没有完成 都算没有完成 过渡
-            if (!isisDone) {
-                return false;
-            }
-        }
-
-        if (!this._isDone) {
-            this._isDone = true;
-            return false;
-        }
-
-        return true;
-    }
-}

package/lib/index.d.ts

@@ -1,22 +0,0 @@
-export { default } from "./lib/ThreeBase";
-export { default as EventMesh } from "./lib/EventMesh";
-export { default as ExtrudeMesh } from "./lib/ExtrudeMesh";
-export type { ExtrudePath } from "./lib/ExtrudeMesh";
-export type { ExtrudeMeshProps } from "./lib/ExtrudeMesh";
-export { default as KeyFrameAnimation } from "./lib/KeyFrameAnimation";
-export type { KeyframeAnimationProps } from "./lib/KeyFrameAnimation";
-export type { Keyframe } from "./lib/KeyFrameAnimation";
-export { default as InstancedGroupMesh } from "./lib/InstancedGroupMesh";
-export { default as PointLight } from "./lib/PointLight";
-export { default as Sky } from "./lib/Sky/Sky";
-export { default as keyContorls } from "./lib/keyContorls";
-export { default as Transition } from "./lib/Transition";
-export { default as threeUtils } from "./lib/threeUtils";
-export { default as threeLoader } from "./lib/threeLoader";
-export { default as FPScontrol } from "./lib/FPScontrol";
-export { default as PlaneText } from "./lib/PlaneText";
-export { default as SpriteText } from "three-spritetext";
-export { default as SpriteModal1 } from "./lib/spriteModal1/SpriteModal1";
-export { default as PlaneModal1 } from "./lib/planeModal1/PlaneModal1";
-export { default as Text3D } from "./lib/Text3D/Text3D";
-export type { Text3DProps } from "./lib/Text3D/Text3D";

package/lib/keyContorls.d.ts

@@ -1,25 +0,0 @@
-import { Event, EventDispatcher, Vector3 } from "three";
-/**
- * 键盘 使用 ↑↓←→ 控制 x z 方向, 小键盘 1 0 控制 y 方向
- *
- * @class KeyContorls
- * @extends {EventDispatcher}
- */
-declare class KeyContorls extends EventDispatcher {
-    constructor();
-    uuid: string;
-    direction: Vector3;
-    add(e: any): void;
-    delete(e: any): void;
-    enter(e: any): void;
-    keyDown: (e: any) => void;
-    _listeners?: {
-        [key: string]: Array<any>;
-    };
-    removeEvent: import("lodash").DebouncedFunc<(type: string) => void>;
-    addEventListener(type: string, listener: (event: Event) => void): void;
-    addEvent(): void;
-    dispose(): void;
-}
-declare const keyContorls: KeyContorls;
-export default keyContorls;

package/lib/keyContorls.js

@@ -1,98 +0,0 @@
-/*
- * @Author: xiaosihan
- * @Date: 2022-03-20 14:48:33
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2022-09-30 00:12:28
- */
-import { throttle } from "lodash";
-import { EventDispatcher, Vector3 } from "three";
-import { generateUUID } from "three/src/math/MathUtils";
-/**
- * 键盘 使用 ↑↓←→ 控制 x z 方向, 小键盘 1 0 控制 y 方向
- *
- * @class KeyContorls
- * @extends {EventDispatcher}
- */
-class KeyContorls extends EventDispatcher {
-    constructor() {
-        super();
-        this.addEvent();
-    }
-    uuid = generateUUID();
-    direction = new Vector3(0, 0, 0);
-    // 添加事件需要由外部实现
-    add(e) {
-        this.dispatchEvent({ ...e, type: "add" });
-    }
-    // 删除事件
-    delete(e) {
-        this.dispatchEvent({ ...e, type: "delete" });
-    }
-    // 回车按钮
-    enter(e) {
-        this.dispatchEvent({ ...e, type: "enter" });
-    }
-    keyDown = (e) => {
-        switch (e.keyCode) {
-            case 46: // 删除按钮
-                this.delete(e);
-                return;
-            case 13: // 回车按钮
-                this.enter(e);
-                return;
-            case 97: // 小键盘1
-                this.direction.set(0, 1, 0);
-                break;
-            case 96: // 小键盘0
-                this.direction.set(0, -1, 0);
-                break;
-            case 35: // 
-                this.direction.set(0, 0.001, 0);
-                break;
-            case 45:
-                this.direction.set(0, -0.001, 0);
-                break;
-            case 38: // 前
-                this.direction.set(0, 0, -1);
-                break;
-            case 37: // 后
-                this.direction.set(-1, 0, 0);
-                break;
-            case 40: // 左
-                this.direction.set(0, 0, 1);
-                break;
-            case 39: // 右
-                this.direction.set(1, 0, 0);
-                break;
-            default:
-                return;
-        }
-        if (e.shiftKey) {
-            this.direction.multiplyScalar(0.001);
-        }
-        if (e.ctrlKey) {
-            this.direction.multiplyScalar(0.1);
-        }
-        this.dispatchEvent({
-            type: "change",
-            direction: this.direction
-        });
-    };
-    _listeners;
-    // 节流 删除事件监听
-    removeEvent = throttle((type) => {
-        this._listeners = undefined;
-    }, 1000, { trailing: false });
-    addEventListener(type, listener) {
-        this.removeEvent(type);
-        super.addEventListener(type, listener);
-    }
-    addEvent() {
-        document.addEventListener("keydown", this.keyDown);
-    }
-    dispose() {
-        document.removeEventListener("keydown", this.keyDown);
-    }
-}
-const keyContorls = new KeyContorls();
-export default keyContorls;

package/lib/keyContorls.ts

@@ -1,127 +0,0 @@
-/*
- * @Author: xiaosihan 
- * @Date: 2022-03-20 14:48:33 
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2022-09-30 00:12:28
- */
-
-import { throttle } from "lodash";
-import { Event, EventDispatcher, Vector3 } from "three";
-import { generateUUID } from "three/src/math/MathUtils";
-
-
-/**
- * 键盘 使用 ↑↓←→ 控制 x z 方向, 小键盘 1 0 控制 y 方向
- *
- * @class KeyContorls
- * @extends {EventDispatcher}
- */
-class KeyContorls extends EventDispatcher {
-
-    constructor() {
-        super();
-        this.addEvent();
-    }
-
-    uuid = generateUUID();
-
-    direction = new Vector3(0, 0, 0);
-
-    // 添加事件需要由外部实现
-    add(e: any) {
-        this.dispatchEvent({ ...e, type: "add" });
-    }
-
-    // 删除事件
-    delete(e: any) {
-        this.dispatchEvent({ ...e, type: "delete" });
-    }
-
-    // 回车按钮
-    enter(e: any) {
-        this.dispatchEvent({ ...e, type: "enter" });
-    }
-
-    keyDown = (e: any) => {
-
-        switch (e.keyCode) {
-
-            case 46: // 删除按钮
-                this.delete(e);
-                return;
-
-            case 13: // 回车按钮
-                this.enter(e);
-                return;
-
-            case 97: // 小键盘1
-                this.direction.set(0, 1, 0);
-                break;
-            case 96: // 小键盘0
-                this.direction.set(0, -1, 0);
-                break;
-
-            case 35: // 
-                this.direction.set(0, 0.001, 0);
-                break;
-            case 45:
-                this.direction.set(0, -0.001, 0);
-                break;
-
-            case 38: // 前
-                this.direction.set(0, 0, -1);
-                break;
-            case 37: // 后
-                this.direction.set(-1, 0, 0);
-                break;
-            case 40: // 左
-                this.direction.set(0, 0, 1);
-                break;
-            case 39: // 右
-                this.direction.set(1, 0, 0);
-                break;
-
-            default:
-                return;
-        }
-
-        if (e.shiftKey) {
-            this.direction.multiplyScalar(0.001);
-        }
-
-        if (e.ctrlKey) {
-            this.direction.multiplyScalar(0.1);
-        }
-
-        this.dispatchEvent({
-            type: "change",
-            direction: this.direction
-        });
-
-    }
-
-    _listeners?: { [key: string]: Array<any> };
-
-    // 节流 删除事件监听
-    removeEvent = throttle((type: string) => {
-        this._listeners = undefined;
-    }, 1000, { trailing: false });
-
-    addEventListener(type: string, listener: (event: Event) => void): void {
-        this.removeEvent(type);
-        super.addEventListener(type, listener);
-    }
-
-    addEvent() {
-        document.addEventListener("keydown", this.keyDown);
-    }
-
-    dispose() {
-        document.removeEventListener("keydown", this.keyDown);
-    }
-
-}
-
-const keyContorls = new KeyContorls();
-
-export default keyContorls;

package/lib/planeModal1/PlaneModal1.d.ts

@@ -1,31 +0,0 @@
-import { MeshBasicMaterial, Mesh, CanvasTexture, PlaneGeometry } from "three";
-export type PlaneModal1Config = {
-    size?: number;
-    title?: string;
-    titleColor?: string;
-    texts?: Array<{
-        text?: string;
-        color?: string;
-        size?: number;
-    }>;
-};
-export default class PlaneModal1 extends Mesh {
-    constructor(config?: PlaneModal1Config);
-    geometry: PlaneGeometry;
-    material: MeshBasicMaterial;
-    static img: HTMLImageElement;
-    canvas: HTMLCanvasElement;
-    context: CanvasRenderingContext2D;
-    texture: CanvasTexture;
-    _config: {
-        size: number;
-        title: string;
-        titleColor: string;
-        texts: Array<{
-            text: string;
-            color: string;
-            size: number;
-        }>;
-    };
-    updata(config: PlaneModal1Config): Promise<void>;
-}

package/lib/planeModal1/PlaneModal1.js

@@ -1,104 +0,0 @@
-/*
- * @Author: xiaosihan
- * @Date: 2023-03-09 18:51:11
- * @Last Modified by: xiaosihan
- * @Last Modified time: 2023-03-09 19:15:35
- */
-import { MeshBasicMaterial, Mesh, DoubleSide, CanvasTexture, Vector2, PlaneGeometry } from "three";
-import planeModalPNG from "./planeModal.png";
-// 平面模型弹窗
-export default class PlaneModal1 extends Mesh {
-    constructor(config = {}) {
-        super();
-        this.updata(config);
-        this.material.map = this.texture;
-        this.scale.set(10, 10, 10);
-    }
-    geometry = new PlaneGeometry(1 * 0.65, 0.728 * 0.65, 1, 1);
-    material = new MeshBasicMaterial({
-        side: DoubleSide,
-        transparent: true,
-        alphaTest: 0.01
-    });
-    // 背景图
-    static img = (() => {
-        const img = new Image();
-        img.src = planeModalPNG;
-        return img;
-    })();
-    canvas = (() => {
-        const canvas = document.createElement("canvas");
-        canvas.width = 660;
-        canvas.height = 481;
-        return canvas;
-    })();
-    context = this.canvas.getContext("2d");
-    texture = new CanvasTexture(this.canvas);
-    // 配置
-    _config = {
-        size: 10,
-        title: "PlaneModal1",
-        titleColor: "#ffffff",
-        texts: []
-        // [
-        //     {
-        //         text: "1",
-        //         color: "#ffff00",
-        //         size: 40
-        //     },
-        //     {
-        //         text: "2",
-        //         color: "#ff00ff",
-        //         size: 40
-        //     },
-        // ]
-    };
-    async updata(config) {
-        Object.assign(this._config, config);
-        //绘制背景
-        this.context.clearRect(0, 0, 660, 481);
-        while (!PlaneModal1.img.complete) {
-            await new Promise(resolve => setTimeout(resolve, 100));
-        }
-        // 设置大小
-        this.scale.set(this._config.size, this._config.size, this._config.size);
-        // this.context.fillStyle = "#00000088";
-        // this.context.fillRect(0, 0, 660, 481);
-        //绘制背景
-        this.context.drawImage(PlaneModal1.img, 0, 0);
-        // 绘制标题
-        this.context.fillStyle = this._config.titleColor;
-        this.context.font = '40px serif'; // 设置字体大小
-        this.context.textAlign = "left";
-        this.context.textBaseline = "top";
-        this.context.fillText(this._config.title, 60, 72);
-        let textPos = new Vector2(60, 150);
-        let maxWidth = 530;
-        // 绘制内容
-        this._config.texts.map(({ text = "text", color = "#ffffff", size = 40 }) => {
-            this.context.fillStyle = color;
-            this.context.font = `${size}px serif`; // 设置字体大小
-            this.context.textAlign = "left";
-            this.context.textBaseline = "top";
-            // 字符分隔为数组
-            var arrText = text.split('');
-            var line = '';
-            for (var n = 0; n < arrText.length; n++) {
-                var metrics = this.context.measureText(line + arrText[n]);
-                var testWidth = metrics.width;
-                if ((testWidth > maxWidth && n > 0) || arrText[n] === "\n") {
-                    this.context.fillText(line, textPos.x, textPos.y);
-                    line = "";
-                    textPos.y += size;
-                }
-                else {
-                    line += arrText[n];
-                }
-            }
-            this.context.fillText(line, textPos.x, textPos.y);
-            textPos.y += size;
-        });
-        this.texture.needsUpdate = true;
-        this.dispatchEvent({ type: "loaded" });
-    }
-}