@realsee/dnalogel 2.0.0-alpha.2 → 2.0.0-alpha.3

package/libs/PanoCompassPlugin/index.d.ts

@@ -0,0 +1,25 @@
+import type { Five, FivePlugin } from '@realsee/five';
+export interface PanoCompassPluginParameterType {
+    compassImageUrl?: string;
+}
+export interface PanoCompassPluginData {
+    north_rad: number;
+}
+export declare type PanoCompassPluginExportType = PanoCompassController;
+export declare const PanoCompassPlugin: FivePlugin<PanoCompassPluginParameterType | undefined, PanoCompassController>;
+export default PanoCompassPlugin;
+declare class PanoCompassController {
+    five: Five;
+    data?: PanoCompassPluginData;
+    config?: PanoCompassPluginParameterType;
+    private compassMeshTween?;
+    private compassMesh?;
+    constructor(five: Five, config?: PanoCompassPluginParameterType);
+    load(data: PanoCompassPluginData): void;
+    dispose: () => void;
+    private loadCompassMesh;
+    private onFivePanoWillArrive;
+    private onFivePanoArrived;
+    private fixPosition;
+    private fixRotation;
+}

package/libs/PanoCompassPlugin/index.js

@@ -0,0 +1,89 @@
+import * as THREE from 'three';
+import { loadTexture } from '../shared-utils/three/loadTexture';
+import { tweenProgress } from '../shared-utils/animationFrame/BetterTween';
+export const PanoCompassPlugin = function (five, config) {
+    return new PanoCompassController(five, config);
+};
+export default PanoCompassPlugin;
+class PanoCompassController {
+    five;
+    data;
+    config;
+    compassMeshTween;
+    compassMesh;
+    constructor(five, config) {
+        this.five = five;
+        this.config = config;
+        five.once('panoLoaded', this.loadCompassMesh);
+        five.once('dispose', this.dispose);
+        this.five.on('panoArrived', this.onFivePanoArrived);
+        this.five.on('panoWillArrive', this.onFivePanoWillArrive);
+    }
+    load(data) {
+        this.data = data;
+        if (this.compassMesh && !this.five.scene.children.includes(this.compassMesh)) {
+            // 模型已经加载好了，才加载数据
+            this.fixRotation(data.north_rad);
+            this.fixPosition(this.five.panoIndex || 0);
+            this.five.scene.add(this.compassMesh);
+        }
+    }
+    dispose = () => {
+        this.five.off('panoArrived', this.onFivePanoArrived);
+        this.five.off('panoWillArrive', this.onFivePanoWillArrive);
+        this.five.off();
+    };
+    loadCompassMesh = async () => {
+        const compassImageUrl = this.config?.compassImageUrl || '//vrlab-image4.ljcdn.com/release/web/v3/north-point-circle.96498e69.png';
+        const texture = await loadTexture(compassImageUrl);
+        const compassGeometry = new THREE.CircleGeometry(0.7, 32);
+        const compassMaterial = new THREE.MeshBasicMaterial({
+            map: texture,
+            transparent: true,
+            opacity: 1,
+            depthTest: false,
+        });
+        const compassMesh = new THREE.Mesh(compassGeometry, compassMaterial);
+        compassMesh.rotateX(-Math.PI / 2);
+        compassMesh.name = 'pano-compass-mesh';
+        this.compassMesh = compassMesh;
+        this.fixPosition(this.five.panoIndex || 0);
+        if (!this.data)
+            return;
+        this.fixRotation(this.data.north_rad);
+        this.five.scene.add(compassMesh);
+    };
+    onFivePanoWillArrive = (panoIndex) => {
+        if (panoIndex === this.five.panoIndex)
+            return;
+        this.compassMeshTween?.dispose();
+        this.compassMesh?.material.setValues({ opacity: 0 });
+    };
+    onFivePanoArrived = (panoIndex) => {
+        if (this.compassMesh?.material.opacity !== 0)
+            return;
+        this.fixPosition(panoIndex);
+        this.compassMeshTween?.dispose();
+        this.compassMeshTween = tweenProgress(1000)
+            .onUpdate(({ progress }) => {
+            this.compassMesh?.material.setValues({ opacity: progress });
+            this.five.needsRender = true;
+        })
+            .play();
+    };
+    fixPosition(panoIndex) {
+        if (!this.compassMesh)
+            return;
+        const standingPosition = this.five.work.observers[panoIndex].standingPosition;
+        // 指南针上移 0.01m，防止与地板重合
+        const compassPosition = standingPosition.clone().add(new THREE.Vector3(0, 0.01, 0));
+        this.compassMesh.position.copy(compassPosition);
+        this.five.needsRender = true;
+    }
+    fixRotation(northRad) {
+        if (!this.compassMesh)
+            return;
+        this.compassMesh.rotateZ(northRad - Math.PI / 2);
+        this.five.needsRender = true;
+    }
+}

package/libs/index.d.ts

@@ -1,17 +1,19 @@
-export { default as ModelViewPlugin } from "./ModelViewPlugin";
-export { default as CSS3DRenderPlugin } from "./CSS3DRenderPlugin";
+export { default as ModelViewPlugin } from './ModelViewPlugin';
+export { default as CSS3DRenderPlugin } from './CSS3DRenderPlugin';
 export type { PanoCursorRaycasterPluginExportType } from './PanoCursorRaycasterPlugin';
-export { default as PanoCursorRaycasterPlugin } from "./PanoCursorRaycasterPlugin";
-export type { ModelRoomLabelController, ModelRoomLabelPluginData, RoomLabel, ModelRoomLabelPluginReturnType, ModelRoomLabelPluginParameters } from './ModelRoomLabelPlugin';
+export { default as PanoCursorRaycasterPlugin } from './PanoCursorRaycasterPlugin';
+export type { ModelRoomLabelController, ModelRoomLabelPluginData, RoomLabel, ModelRoomLabelPluginReturnType, ModelRoomLabelPluginParameters, } from './ModelRoomLabelPlugin';
 export { default as ModelRoomLabelPlugin } from './ModelRoomLabelPlugin';
-export type { TopviewFloorplanPluginReturnType, TopviewFloorplanPluginParameterType } from './floorplan/TopviewFloorplanPlugin';
+export type { TopviewFloorplanPluginReturnType, TopviewFloorplanPluginParameterType, } from './floorplan/TopviewFloorplanPlugin';
 export { default as TopviewFloorplanPlugin } from './floorplan/TopviewFloorplanPlugin';
-export type { PanoFloorplanRadarPluginReturnType, PanoFloorplanRadarPluginParameterType } from './floorplan/PanoFloorplanRadarPlugin';
+export type { PanoFloorplanRadarPluginReturnType, PanoFloorplanRadarPluginParameterType, } from './floorplan/PanoFloorplanRadarPlugin';
 export { default as PanoFloorplanRadarPlugin } from './floorplan/PanoFloorplanRadarPlugin';
-export type { ModelFloorplanParameterType, ModelFloorplanPluginReturnType, ModelFloorplanErrorType, ModelFloorplanPluginsConfigs, ModelFloorplanEventHandlers, ModelFloorplanViewEvent } from './floorplan/ModelFloorplanPlugin';
+export type { ModelFloorplanParameterType, ModelFloorplanPluginReturnType, ModelFloorplanErrorType, ModelFloorplanPluginsConfigs, ModelFloorplanEventHandlers, ModelFloorplanViewEvent, } from './floorplan/ModelFloorplanPlugin';
 export { default as ModelFloorplanPlugin } from './floorplan/ModelFloorplanPlugin';
-export type { ModelChassisCompassPluginParameterType, ModelChassisCompassPluginData, ModelChassisCompassPluginExportType } from './ModelChassisCompassPlugin';
+export type { ModelChassisCompassPluginParameterType, ModelChassisCompassPluginData, ModelChassisCompassPluginExportType, } from './ModelChassisCompassPlugin';
 export { default as ModelChassisCompassPlugin } from './ModelChassisCompassPlugin';
-export type { ModelEntryDoorGuidePluginParameterType, ModelEntryDoorGuidePluginData, ModelEntryDoorGuidePluginExportType } from './ModelEntryDoorGuidePlugin';
+export type { ModelEntryDoorGuidePluginParameterType, ModelEntryDoorGuidePluginData, ModelEntryDoorGuidePluginExportType, } from './ModelEntryDoorGuidePlugin';
 export { default as ModelEntryDoorGuidePlugin } from './ModelEntryDoorGuidePlugin';
 export { default as CameraMovementPlugin } from './CameraMovementPlugin';
+export type { PanoCompassPluginParameterType, PanoCompassPluginExportType, PanoCompassPluginData, } from './PanoCompassPlugin';
+export { default as PanoCompassPluginPlugin } from './PanoCompassPlugin';

package/libs/index.js

@@ -1,6 +1,6 @@
-export { default as ModelViewPlugin } from "./ModelViewPlugin";
-export { default as CSS3DRenderPlugin } from "./CSS3DRenderPlugin";
-export { default as PanoCursorRaycasterPlugin } from "./PanoCursorRaycasterPlugin";
+export { default as ModelViewPlugin } from './ModelViewPlugin';
+export { default as CSS3DRenderPlugin } from './CSS3DRenderPlugin';
+export { default as PanoCursorRaycasterPlugin } from './PanoCursorRaycasterPlugin';
 export { default as ModelRoomLabelPlugin } from './ModelRoomLabelPlugin';
 export { default as TopviewFloorplanPlugin } from './floorplan/TopviewFloorplanPlugin';
 export { default as PanoFloorplanRadarPlugin } from './floorplan/PanoFloorplanRadarPlugin';
@@ -8,3 +8,4 @@ export { default as ModelFloorplanPlugin } from './floorplan/ModelFloorplanPlugi
 export { default as ModelChassisCompassPlugin } from './ModelChassisCompassPlugin';
 export { default as ModelEntryDoorGuidePlugin } from './ModelEntryDoorGuidePlugin';
 export { default as CameraMovementPlugin } from './CameraMovementPlugin';
+export { default as PanoCompassPluginPlugin } from './PanoCompassPlugin';

package/package.json

@@ -5,7 +5,7 @@
   "author": "REALSEE-DEVELOPER",
   "repository": "https://github.com/realsee-developer/dnalogel.git",
   "private": false,
-  "version": "2.0.0-alpha.2",
+  "version": "2.0.0-alpha.3",
   "license": "SEE LICENSE IN TERMS.txt",
   "scripts": {
     "build:dev": "yarn tsb && vite build --watch",