TkAstral3D/packages/sdk/lib/dxf/offScreenCanvas.worker.ts

import {EventDispatcher} from "three";
import * as DrawShare from "./drawShare";

function noop() {
}

class ElementProxyReceiver extends EventDispatcher {
    // @ts-ignore
    private style: {};
    // @ts-ignore
    private width: number;
    // @ts-ignore
    private height: number;
    // @ts-ignore
    private left: number;
    // @ts-ignore
    private top: number;

    constructor() {
        super();
        // 因为OrbitControls尝试设置style.touchAction;
        this.style = new Proxy({}, {
            set(target: {}, p: string | symbol, newValue: any): boolean {
                self.postMessage({
                    type: 'style',
                    data: {
                        key: p,
                        value: newValue
                    }
                });

                target[p] = newValue;

                return true;
            }
        });
    }

    get clientWidth() {
        return this.width;
    }

    get clientHeight() {
        return this.height;
    }

    get offsetLeft() {
        return this.left;
    }

    get offsetTop() {
        return this.top;
    }

    // r132 版本的 OrbitControls 会调用这两个函数，也许我们应该实现一下
    setPointerCapture() {
    }

    releasePointerCapture() {
    }

    getBoundingClientRect() {
        return {
            left: this.left,
            top: this.top,
            width: this.width,
            height: this.height,
            right: this.left + this.width,
            bottom: this.top + this.height,
        };
    }

    // 触发事件
    handleEvent(data) {
        if (data.type === 'size') {
            this.left = data.left;
            this.top = data.top;
            this.width = data.width;
            this.height = data.height;

            return;
        }

        data.preventDefault = noop;
        data.stopPropagation = noop;
        // @ts-ignore
        this.dispatchEvent(data);
    }

    focus() {
        // no-op
    }

    // ----------------------- 2024/04/12 r163 版本 OrbitControls 新增的函数调用 ------------------------------
    getRootNode(){
        return this;
    }
}

class ProxyManager {
    private readonly targets: {};

    constructor() {
        this.targets = {};
        this.handleEvent = this.handleEvent.bind(this);
    }

    /**
     * 通过一个id，可以生成一个响应对应id信息的 ElementProxyReceiver 对象。
     * @param data
     */
    makeProxy(data: { id: number }) {
        const {id} = data;
        this.targets[id] = new ElementProxyReceiver();
    }

    getProxy(id: number) {
        return this.targets[id];
    }

    handleEvent(data) {
        this.targets[data.id].handleEvent(data.data);
    }
}


/** ---------------- worker主体  ------------------ **/
const proxyManager = new ProxyManager();
const middleObject:any = new Proxy({}, {
    set(target: {}, p: string | symbol, newValue: any): boolean {
        self.postMessage({
            type: 'middle',
            data: {
                key: p,
                value: newValue
            }
        });

        target[p] = newValue;

        return true;
    }
});

function start(data: { canvasId: number, canvas: HTMLCanvasElement, data: any,options,middleObject }) {
    const proxy = proxyManager.getProxy(data.canvasId);

    middleObject.markList = JSON.parse(data.middleObject.markList);
    middleObject.selectedRectIndex = data.middleObject.selectedRectIndex;

    DrawShare.main({
        canvas: data.canvas,
        inputElement: proxy,
        data: data.data,
        options:data.options,
        onComplete: () => {
            self.postMessage({
                type: 'complete'
            });
        },
        signal: (args: { type: 'add' | 'remove' | 'dispatch', name: string, data?: any }) => {
            self.postMessage({
                type: 'signal',
                data: args
            });
        },
        middleObject
    });
}

function makeProxy(data: { id: number }) {
    proxyManager.makeProxy(data);
}

const handlers = {
    start,
    makeProxy,
    event: proxyManager.handleEvent,
};

self.onmessage = function ({data}) {
    const fn = handlers[data.type] || DrawShare[data.type];
    if (typeof fn !== 'function') {
        throw new Error(`没有 ${data.type} 类型的处理程序!`);
    }
    fn(data.data);
};