@realsee/dnalogel 2.1.0-alpha.13 → 2.1.0-alpha.15

package/libs/src/PanoCursorRaycasterPlugin/index.js

@@ -0,0 +1,76 @@
+import { Group, Raycaster, Vector3 } from 'three';
+import createLine from '../shared-utils/createLine';
+/**
+ * 全景中对当前鼠标的位置进行碰撞监测
+ * @param five
+ * @return
+ */
+export const PanoCursorRaycasterPlugin = (five) => {
+    const state = {
+        intersection: null,
+        disposers: [],
+    };
+    const updateIntersection = (intersection) => {
+        state.intersection = intersection;
+    };
+    const clearIntersection = () => {
+        state.intersection = null;
+    };
+    five.on('modelLoaded', () => {
+        five.on('intersectionOnModelUpdate', updateIntersection);
+        five.on('intersectionHidden', clearIntersection);
+    });
+    five.on('dispose', () => {
+        five.off('intersectionOnModelUpdate', updateIntersection);
+        five.off('intersectionHidden', clearIntersection);
+    });
+    const pointAxesHelper = (point, length = 2, fixDistance = 0.1) => {
+        const halfLength = length / 2;
+        const helperCenterPoint = movePointTowardsCamera(point, fixDistance);
+        const p = helperCenterPoint;
+        const pointAxesHelperMesh = new Group();
+        pointAxesHelperMesh.add(createLine(new Vector3(p.x + halfLength, p.y, p.z), new Vector3(p.x - halfLength, p.y, p.z), new Vector3(1, 0, 0)), createLine(new Vector3(p.x, p.y + halfLength, p.z), new Vector3(p.x, p.y - halfLength, p.z), new Vector3(0, 1, 0)), createLine(new Vector3(p.x, p.y, p.z + halfLength), new Vector3(p.x, p.y, p.z - halfLength), new Vector3(0, 0, 1)));
+        five.scene.add(pointAxesHelperMesh);
+        five.needsRender = true;
+        // 清理函数
+        const clear = () => {
+            five.scene.remove(pointAxesHelperMesh);
+        };
+        state.disposers.push(clear);
+        return { clear, pointAxesHelperMesh };
+    };
+    const canSeePoint = (point, distanceError = 0) => {
+        var _a, _b;
+        const cameraPosition = (_a = five === null || five === void 0 ? void 0 : five.camera) === null || _a === void 0 ? void 0 : _a.position;
+        if (!cameraPosition)
+            return false;
+        const distance = point.distanceTo(cameraPosition);
+        const direction = point.sub(cameraPosition).normalize();
+        const raycaster = new Raycaster(cameraPosition, direction);
+        const intersection = (_b = five.model.intersectRaycaster(raycaster)) === null || _b === void 0 ? void 0 : _b[0];
+        return !(intersection && intersection.distance + distanceError < distance);
+    };
+    const intersection = () => {
+        return state.intersection;
+    };
+    const destroy = () => {
+        var _a, _b;
+        (_b = (_a = state.disposers) === null || _a === void 0 ? void 0 : _a.forEach) === null || _b === void 0 ? void 0 : _b.call(_a, (d) => d === null || d === void 0 ? void 0 : d());
+        five.off('intersectionOnModelUpdate', updateIntersection);
+        five.off('intersectionHidden', clearIntersection);
+    };
+    // 逐步取代 destroy ,向下兼容
+    const dispose = destroy;
+    const movePointTowardsCamera = (point, distance) => {
+        // 原点 position
+        const originPoint = point.clone();
+        // camera position
+        const cameraPosition = five.camera.position.clone();
+        // 移动的向量
+        const fixVector3 = cameraPosition.sub(originPoint).setLength(distance);
+        // 向量相加
+        return fixVector3.add(originPoint);
+    };
+    return { intersection, pointAxesHelper, movePointTowardsCamera, destroy, dispose, canSeePoint };
+};
+export default PanoCursorRaycasterPlugin;

package/libs/src/PanoDoorLabelPlugin/BaseController.d.ts

@@ -0,0 +1,60 @@
+import { Five } from '@realsee/five';
+import { BaseOptions, Controller, EventMap, State } from '../base/BasePlugin';
+/**
+ * pano plugin controller 基类
+ * @author kyleju
+ */
+export declare abstract class BasePanoPluginController<T extends State, E extends EventMap<T>> extends Controller<T, E> {
+    state: T;
+    container: Element;
+    enabled: boolean;
+    constructor(five: Five);
+    /**
+     * 启用组件
+     * @param options
+     */
+    enable(options?: BaseOptions): void;
+    /**
+     * 禁用组件
+     * @param options
+     */
+    disable(options?: BaseOptions): void;
+    /**
+     * 显示 UI
+     * @param options
+     * @returns
+     */
+    show(options?: BaseOptions): Promise<void>;
+    /**
+     * 隐藏 UI
+     * @param options
+     * @returns
+     */
+    hide(options: BaseOptions): Promise<void>;
+    /**
+     * 销毁对象
+     */
+    dispose(): void;
+    /**
+     * 设置状态
+     * @param state @T 状态
+     * @param options @BaseOptions 可选配置
+     * @returns
+     */
+    setState(state: Partial<T>, options?: BaseOptions): void;
+    get visible(): boolean;
+    appendTo(container: Element): void;
+    private updateState;
+    /**
+     * 组件 渲染
+     */
+    abstract render(): any;
+    /**
+     * State 初始化
+     */
+    abstract initState(): T;
+    /**
+     * State 改变回调
+     */
+    abstract stateChangedCallback(prevState: T, options?: BaseOptions): any;
+}

package/libs/src/PanoDoorLabelPlugin/BaseController.js

@@ -0,0 +1,103 @@
+import { Five } from '@realsee/five';
+import { Controller } from '../base/BasePlugin';
+/**
+ * pano plugin controller 基类
+ * @author kyleju
+ */
+export class BasePanoPluginController extends Controller {
+    constructor(five) {
+        super(five);
+        Object.defineProperty(this, "state", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "container", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "enabled", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.five = five;
+        this.five.once('dispose', this.dispose);
+        this.enabled = true;
+        this.state = this.initState();
+        console.log('base controller');
+    }
+    /**
+     * 启用组件
+     * @param options
+     */
+    enable(options) {
+        this.enabled = true;
+        this.updateState(Object.assign(Object.assign({}, options), { userAction: true }));
+    }
+    /**
+     * 禁用组件
+     * @param options
+     */
+    disable(options) {
+        this.enabled = false;
+        this.updateState(Object.assign(Object.assign({}, options), { userAction: true }));
+    }
+    /**
+     * 显示 UI
+     * @param options
+     * @returns
+     */
+    show(options) {
+        if (!this.state.enabled)
+            return;
+        this.setState(Object.assign(Object.assign({}, this.state), { visible: true }), options);
+        return Promise.resolve();
+    }
+    /**
+     * 隐藏 UI
+     * @param options
+     * @returns
+     */
+    hide(options) {
+        if (!this.state.enabled)
+            return;
+        this.setState(Object.assign(Object.assign({}, this.state), { visible: false }), options);
+        return Promise.resolve();
+    }
+    /**
+     * 销毁对象
+     */
+    dispose() {
+        this.container.remove();
+    }
+    /**
+     * 设置状态
+     * @param state @T 状态
+     * @param options @BaseOptions 可选配置
+     * @returns
+     */
+    setState(state, options) {
+        if (!this.enabled)
+            return;
+        const prevState = Object.assign({}, this.state);
+        this.state = Object.assign(Object.assign(Object.assign({}, this.state), state), options);
+        this.stateChangedCallback(prevState, options);
+    }
+    get visible() {
+        return this.five.state.mode === Five.Mode.Panorama;
+    }
+    appendTo(container) {
+        if (!this.enabled)
+            return;
+        this.container = container;
+        this.render();
+    }
+    updateState(options) {
+        this.setState(Object.assign(Object.assign({}, this.state), { enabled: this.enabled, visible: this.visible }), options);
+    }
+}

package/libs/src/PanoDoorLabelPlugin/Controller.d.ts

@@ -0,0 +1,37 @@
+import type { Five } from '@realsee/five';
+import type { BaseOptions, EventMap, State } from 'src/base/BasePlugin';
+import type { FloorplanServerData } from '../floorplan/typings/floorplanServerData';
+import { BasePanoPluginController } from './BaseController';
+import type { DoorLabelConfig } from './typings';
+/**
+ * 分间标签插件
+ * @author kyleju
+ */
+export declare class PanoDoorLabelPluginController extends BasePanoPluginController<State, EventMap<State>> {
+    private MinVisibledistance;
+    private MaxVisibledistance;
+    private OffsetHeight;
+    private rooms;
+    private floorplanServerData;
+    /** 标签项 */
+    private doorLabelItems;
+    /** 每个点位 visible 标签的缓存 */
+    private visibleLabelMap;
+    /** 标签项Prop值 */
+    private labelItems;
+    /** 数据 */
+    private doorLabels;
+    private roomObservers;
+    constructor(five: Five);
+    loadData: (floorplanServerData: FloorplanServerData, doorLabelConfig?: DoorLabelConfig) => void;
+    stateChangedCallback(prevState: State, options?: BaseOptions): void;
+    render(): void;
+    initState(): State;
+    dispose(): void;
+    private initRoomObservers;
+    private hideAllLabels;
+    private fixDoorVisibleAndPosition;
+    private fixDoorPosition;
+    private onClick;
+    private initData;
+}