@realsee/dnalogel 2.0.0-alpha.35 → 2.0.0-alpha.38

package/libs/floorplan/ModelFloorplanPlugin/index.d.ts

@@ -1,9 +1,7 @@
+import type { Parameters } from './typing';
 import type { FivePlugin } from '@realsee/five';
-import FloorplanPluginController, { ModelFloorplanParameterType } from './Controller';
-export declare const ModelFloorplanPlugin: FivePlugin<ModelFloorplanParameterType, ModelFloorplanPluginReturnType>;
+import { Controller } from './Controller';
+export declare const ModelFloorplanPlugin: FivePlugin<undefined | Parameters, Controller>;
+export declare type ModelFloorplanPluginParameterType = Parameters | undefined;
+export declare type ModelFloorplanPluginReturnType = InstanceType<typeof Controller>;
 export default ModelFloorplanPlugin;
-export declare type ModelFloorplanPluginReturnType = FloorplanPluginController;
-export type { ModelFloorplanViewEvent } from './typings/events.type';
-export type { FloorplanErrorType as ModelFloorplanErrorType } from './utils/constant';
-export type { ModelFloorplanPluginsConfigs, ModelFloorplanParameterType } from './Controller';
-export type { FloorplanEventHandlers as ModelFloorplanEventHandlers } from './typings/events.type';

package/libs/floorplan/ModelFloorplanPlugin/index.js

@@ -1,5 +1,5 @@
-import FloorplanPluginController from './Controller';
+import { Controller } from './Controller';
 export const ModelFloorplanPlugin = (five, params) => {
-    return new FloorplanPluginController(five, params);
+    return new Controller(five, params);
 };
 export default ModelFloorplanPlugin;

package/libs/floorplan/ModelFloorplanPlugin/typing.d.ts

@@ -0,0 +1,107 @@
+import type { FLOOR_PLAN_ATTACHED_TO } from '../constant';
+import type * as BasePlugin from '../../base/BasePluginWithData';
+import type { FloorplanServerData } from '../typings/floorplanServerData';
+import type { FloorplanData, FloorplanRoomItem } from '../typings/floorplanData';
+export interface State extends BasePlugin.State {
+    visible: boolean;
+    config: Config;
+}
+export interface Config {
+    /** 指北针的显示文案，默认为 '北' */
+    northDesc: string;
+    /** 户型图展示时，模型的透明度，默认为 1 */
+    modelOpacity: number;
+    /** 鼠标放置在分间上时，是否要自动高亮分间，默认为 true */
+    hoverEnable: boolean;
+    /** 是否要启用指北针功能，默认为 true */
+    compassEnable: boolean;
+    /** Five 切换到 Topview Mode 时，是否自动展示户型图，默认为 true */
+    autoShowEnable: boolean;
+    /** 是否要启用户型图分间标尺功能，默认为 true */
+    ruleLabelsEnable: boolean;
+    /** 是否要启用户型图分间标签功能，默认为 true */
+    roomLabelsEnable: boolean;
+    /** 自定义「雷达」图标 */
+    cameraImageUrl: string;
+    /** 计算户型图大小时，以模型的哪个高度为依据，默认为 BOUNDING_CENTER
+     * - FLOOR_PLAN_ATTACHED_TO.FLOOR: 户型图大小与模型的地板进行贴合
+     * - FLOOR_PLAN_ATTACHED_TO.CEILING: 户型图大小与模型的天花板进行贴合
+     * - FLOOR_PLAN_ATTACHED_TO.BOUNDING_CENTER: 户型图大小与模型的中心进行贴合
+     */
+    attachedTo: FLOOR_PLAN_ATTACHED_TO;
+    /** 分间标签的自定义函数，通过返回自定义 DOM 替换对应分间的标签 */
+    getLabelElement: undefined | ((room: FloorplanRoomItem) => Element | null);
+    /** 是否支持房屋标签自适应展示，默认为 true
+     * @description
+     * * 标签边框超过房间边框时，自动隐藏；不超过时自动展示。
+     * * 鼠标 hover 时，自动展示。
+     * */
+    adaptiveRoomLabelVisibleEnable: boolean;
+}
+export interface Parameters extends Partial<Config> {
+    selector?: string | Element;
+    scale?: number;
+}
+export interface ViewEvent {
+    /** 是否是用户滑动模型导致的户型图自动展示/消失 */
+    auto: boolean;
+    /** 是否是用户操作 */
+    userAction: boolean;
+}
+export interface EventMap extends BasePlugin.EventMap<State, FloorplanData> {
+    /**
+     * 展示结束的回调
+     * @param event.auto 是否是自动操作
+     * @param event.userAction 是否是用户操作
+     */
+    showAnimationEnded: (event: ViewEvent) => void;
+    /** visible 从 false 到 true 的回调
+     * @param event.userAction 是否是用户操作
+     */
+    show: (event: ViewEvent) => void;
+    /** visible 从 true 到 false 的回调
+     * @param event.auto 是否是自动操作
+     * @param event.userAction 是否是用户操作
+     */
+    hide: (event: ViewEvent) => void;
+    /** enabled 从 false 到 true 的回调
+     * @param event.userAction 是否是用户操作
+     */
+    enable: (event: {
+        userAction: boolean;
+    }) => void;
+    /** enabled 从 true 到 false 的回调
+     * @param event.userAction 是否是用户操作
+     */
+    disable: (event: {
+        userAction: boolean;
+    }) => void;
+    /**
+     * 点击户型图的回调
+     * @return 当返回 false 时，会阻止默认行为
+     */
+    click: () => boolean | void;
+}
+export interface PluginServerData extends BasePlugin.ServerData {
+    version: number;
+    data: FloorplanServerData;
+}
+export interface ShowOptions {
+    /** 展示户型图时，希望到达的楼层数 */
+    floorIndex: number;
+    /** 是否自动展示 */
+    isAutoShow: boolean;
+    /** 展示户型图时，模型透明度 */
+    modelOpacity: number;
+    /** 是否需要 opacity 动画 */
+    immediately: boolean;
+    /** 是否是用户操作 */
+    userAction: boolean;
+}
+export interface HideOptions {
+    /** 是否自动隐藏 */
+    isAutoHide: boolean;
+    /** 是否是用户操作 */
+    userAction: boolean;
+}
+export { FloorplanData as PluginData };

package/libs/floorplan/ModelFloorplanPlugin/typing.js

@@ -0,0 +1 @@
+export {};

package/libs/floorplan/PanoFloorplanRadarPlugin/Components/Camera.js

@@ -13,7 +13,7 @@ import {
 	set_style
 } from "svelte/internal";
 
-import { onMount, onDestroy } from 'svelte';
+import { onMount } from 'svelte';
 import { CAMERA_IMAGE } from '../../Assets/camera';
 import throttle from '../../../shared-utils/throttle';
 
@@ -107,11 +107,11 @@ function instance($$self, $$props, $$invalidate) {
 	onMount(() => {
 		five.on('panoWillArrive', onFivePanoWillArrive);
 		five.on('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
-	});
 
-	onDestroy(() => {
-		five.off('panoWillArrive', onFivePanoWillArrive);
-		five.off('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
+		return function dispose() {
+			five.off('panoWillArrive', onFivePanoWillArrive);
+			five.off('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
+		};
 	});
 
 	$$self.$$set = $$props => {

package/libs/floorplan/PanoFloorplanRadarPlugin/Components/Main.js

@@ -12,6 +12,7 @@ import {
 	destroy_component,
 	detach,
 	element,
+	empty,
 	get_spread_update,
 	group_outros,
 	init,
@@ -32,24 +33,85 @@ function add_css(target) {
 	append_styles(target, "svelte-7d8ub2", ".plugin-floorplan-radar.svelte-7d8ub2{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.plugin-floorplan-radar-container.svelte-7d8ub2{position:relative}");
 }
 
-// (41:2) {#if clientWidth !== 0}
+// (41:0) {#if visible}
 function create_if_block(ctx) {
+	let div;
+	let div_resize_listener;
+	let current;
+	let if_block = /*clientWidth*/ ctx[6] !== 0 && create_if_block_1(ctx);
+
+	return {
+		c() {
+			div = element("div");
+			if (if_block) if_block.c();
+			attr(div, "class", "plugin-floorplan-radar svelte-7d8ub2");
+			add_render_callback(() => /*div_elementresize_handler*/ ctx[12].call(div));
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			if (if_block) if_block.m(div, null);
+			div_resize_listener = add_resize_listener(div, /*div_elementresize_handler*/ ctx[12].bind(div));
+			current = true;
+		},
+		p(ctx, dirty) {
+			if (/*clientWidth*/ ctx[6] !== 0) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+
+					if (dirty & /*clientWidth*/ 64) {
+						transition_in(if_block, 1);
+					}
+				} else {
+					if_block = create_if_block_1(ctx);
+					if_block.c();
+					transition_in(if_block, 1);
+					if_block.m(div, null);
+				}
+			} else if (if_block) {
+				group_outros();
+
+				transition_out(if_block, 1, 1, () => {
+					if_block = null;
+				});
+
+				check_outros();
+			}
+		},
+		i(local) {
+			if (current) return;
+			transition_in(if_block);
+			current = true;
+		},
+		o(local) {
+			transition_out(if_block);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+			if (if_block) if_block.d();
+			div_resize_listener();
+		}
+	};
+}
+
+// (43:4) {#if clientWidth !== 0}
+function create_if_block_1(ctx) {
 	let div;
 	let currentfloor;
 	let t;
 	let camera;
-	let style_width = `${/*contentWidth*/ ctx[7]}px`;
-	let style_height = `${/*contentHeight*/ ctx[10]}px`;
+	let style_width = `${/*contentWidth*/ ctx[8]}px`;
+	let style_height = `${/*contentHeight*/ ctx[11]}px`;
 	let current;
 
 	const currentfloor_spread_levels = [
 		{
 			five: /*five*/ ctx[0],
-			pxmm: /*pxmm*/ ctx[8],
-			floorIndex: /*floorIndex*/ ctx[9],
-			floorplanData: /*floorplanData*/ ctx[2],
-			hoverEnable: /*hoverEnable*/ ctx[1],
-			extraObjects: /*extraObjects*/ ctx[4]
+			pxmm: /*pxmm*/ ctx[9],
+			floorIndex: /*floorIndex*/ ctx[10],
+			floorplanData: /*floorplanData*/ ctx[3],
+			hoverEnable: /*hoverEnable*/ ctx[2],
+			extraObjects: /*extraObjects*/ ctx[5]
 		}
 	];
 
@@ -63,10 +125,10 @@ function create_if_block(ctx) {
 
 	const camera_spread_levels = [
 		{
-			pxmm: /*pxmm*/ ctx[8],
+			pxmm: /*pxmm*/ ctx[9],
 			five: /*five*/ ctx[0],
-			floorplanData: /*floorplanData*/ ctx[2],
-			cameraImageUrl: /*cameraImageUrl*/ ctx[3]
+			floorplanData: /*floorplanData*/ ctx[3],
+			cameraImageUrl: /*cameraImageUrl*/ ctx[4]
 		}
 	];
 
@@ -96,39 +158,39 @@ function create_if_block(ctx) {
 			current = true;
 		},
 		p(ctx, dirty) {
-			const currentfloor_changes = (dirty & /*five, pxmm, floorIndex, floorplanData, hoverEnable, extraObjects*/ 791)
+			const currentfloor_changes = (dirty & /*five, pxmm, floorIndex, floorplanData, hoverEnable, extraObjects*/ 1581)
 			? get_spread_update(currentfloor_spread_levels, [
 					{
 						five: /*five*/ ctx[0],
-						pxmm: /*pxmm*/ ctx[8],
-						floorIndex: /*floorIndex*/ ctx[9],
-						floorplanData: /*floorplanData*/ ctx[2],
-						hoverEnable: /*hoverEnable*/ ctx[1],
-						extraObjects: /*extraObjects*/ ctx[4]
+						pxmm: /*pxmm*/ ctx[9],
+						floorIndex: /*floorIndex*/ ctx[10],
+						floorplanData: /*floorplanData*/ ctx[3],
+						hoverEnable: /*hoverEnable*/ ctx[2],
+						extraObjects: /*extraObjects*/ ctx[5]
 					}
 				])
 			: {};
 
 			currentfloor.$set(currentfloor_changes);
 
-			const camera_changes = (dirty & /*pxmm, five, floorplanData, cameraImageUrl*/ 269)
+			const camera_changes = (dirty & /*pxmm, five, floorplanData, cameraImageUrl*/ 537)
 			? get_spread_update(camera_spread_levels, [
 					{
-						pxmm: /*pxmm*/ ctx[8],
+						pxmm: /*pxmm*/ ctx[9],
 						five: /*five*/ ctx[0],
-						floorplanData: /*floorplanData*/ ctx[2],
-						cameraImageUrl: /*cameraImageUrl*/ ctx[3]
+						floorplanData: /*floorplanData*/ ctx[3],
+						cameraImageUrl: /*cameraImageUrl*/ ctx[4]
 					}
 				])
 			: {};
 
 			camera.$set(camera_changes);
 
-			if (dirty & /*contentWidth*/ 128 && style_width !== (style_width = `${/*contentWidth*/ ctx[7]}px`)) {
+			if (dirty & /*contentWidth*/ 256 && style_width !== (style_width = `${/*contentWidth*/ ctx[8]}px`)) {
 				set_style(div, "width", style_width, false);
 			}
 
-			if (dirty & /*contentHeight*/ 1024 && style_height !== (style_height = `${/*contentHeight*/ ctx[10]}px`)) {
+			if (dirty & /*contentHeight*/ 2048 && style_height !== (style_height = `${/*contentHeight*/ ctx[11]}px`)) {
 				set_style(div, "height", style_height, false);
 			}
 		},
@@ -152,37 +214,33 @@ function create_if_block(ctx) {
 }
 
 function create_fragment(ctx) {
-	let div;
-	let div_resize_listener;
+	let if_block_anchor;
 	let current;
-	let if_block = /*clientWidth*/ ctx[5] !== 0 && create_if_block(ctx);
+	let if_block = /*visible*/ ctx[1] && create_if_block(ctx);
 
 	return {
 		c() {
-			div = element("div");
 			if (if_block) if_block.c();
-			attr(div, "class", "plugin-floorplan-radar svelte-7d8ub2");
-			add_render_callback(() => /*div_elementresize_handler*/ ctx[11].call(div));
+			if_block_anchor = empty();
 		},
 		m(target, anchor) {
-			insert(target, div, anchor);
-			if (if_block) if_block.m(div, null);
-			div_resize_listener = add_resize_listener(div, /*div_elementresize_handler*/ ctx[11].bind(div));
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
 			current = true;
 		},
 		p(ctx, [dirty]) {
-			if (/*clientWidth*/ ctx[5] !== 0) {
+			if (/*visible*/ ctx[1]) {
 				if (if_block) {
 					if_block.p(ctx, dirty);
 
-					if (dirty & /*clientWidth*/ 32) {
+					if (dirty & /*visible*/ 2) {
 						transition_in(if_block, 1);
 					}
 				} else {
 					if_block = create_if_block(ctx);
 					if_block.c();
 					transition_in(if_block, 1);
-					if_block.m(div, null);
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
 				}
 			} else if (if_block) {
 				group_outros();
@@ -204,15 +262,15 @@ function create_fragment(ctx) {
 			current = false;
 		},
 		d(detaching) {
-			if (detaching) detach(div);
-			if (if_block) if_block.d();
-			div_resize_listener();
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
 		}
 	};
 }
 
 function instance($$self, $$props, $$invalidate) {
 	let { five } = $$props;
+	let { visible } = $$props;
 	let { hoverEnable } = $$props;
 	let { floorplanData } = $$props;
 	let { cameraImageUrl } = $$props;
@@ -225,7 +283,7 @@ function instance($$self, $$props, $$invalidate) {
 	let contentHeight = 0;
 
 	function handlePanoArrived(panoIndex) {
-		$$invalidate(9, floorIndex = five.work.observers[panoIndex].floorIndex);
+		$$invalidate(10, floorIndex = five.work.observers[panoIndex].floorIndex);
 	}
 
 	onMount(() => {
@@ -239,20 +297,21 @@ function instance($$self, $$props, $$invalidate) {
 	function div_elementresize_handler() {
 		clientWidth = this.clientWidth;
 		clientHeight = this.clientHeight;
-		$$invalidate(5, clientWidth);
-		$$invalidate(6, clientHeight);
+		$$invalidate(6, clientWidth);
+		$$invalidate(7, clientHeight);
 	}
 
 	$$self.$$set = $$props => {
 		if ('five' in $$props) $$invalidate(0, five = $$props.five);
-		if ('hoverEnable' in $$props) $$invalidate(1, hoverEnable = $$props.hoverEnable);
-		if ('floorplanData' in $$props) $$invalidate(2, floorplanData = $$props.floorplanData);
-		if ('cameraImageUrl' in $$props) $$invalidate(3, cameraImageUrl = $$props.cameraImageUrl);
-		if ('extraObjects' in $$props) $$invalidate(4, extraObjects = $$props.extraObjects);
+		if ('visible' in $$props) $$invalidate(1, visible = $$props.visible);
+		if ('hoverEnable' in $$props) $$invalidate(2, hoverEnable = $$props.hoverEnable);
+		if ('floorplanData' in $$props) $$invalidate(3, floorplanData = $$props.floorplanData);
+		if ('cameraImageUrl' in $$props) $$invalidate(4, cameraImageUrl = $$props.cameraImageUrl);
+		if ('extraObjects' in $$props) $$invalidate(5, extraObjects = $$props.extraObjects);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*clientWidth, clientHeight, floorplanData, contentWidth*/ 228) {
+		if ($$self.$$.dirty & /*clientWidth, clientHeight, floorplanData, contentWidth*/ 456) {
 			$: {
 				const size = Math.min(clientWidth, clientHeight);
 				const { max, min } = floorplanData.bounding;
@@ -264,15 +323,16 @@ function instance($$self, $$props, $$invalidate) {
 					return [size / boundingHeight * boundingWidth, size];
 				})();
 
-				$$invalidate(7, contentWidth = contentSize[0]);
-				$$invalidate(10, contentHeight = contentSize[1]);
-				$$invalidate(8, pxmm = contentWidth / boundingWidth);
+				$$invalidate(8, contentWidth = contentSize[0]);
+				$$invalidate(11, contentHeight = contentSize[1]);
+				$$invalidate(9, pxmm = contentWidth / boundingWidth);
 			}
 		}
 	};
 
 	return [
 		five,
+		visible,
 		hoverEnable,
 		floorplanData,
 		cameraImageUrl,
@@ -299,10 +359,11 @@ class Component extends SvelteComponent {
 			safe_not_equal,
 			{
 				five: 0,
-				hoverEnable: 1,
-				floorplanData: 2,
-				cameraImageUrl: 3,
-				extraObjects: 4
+				visible: 1,
+				hoverEnable: 2,
+				floorplanData: 3,
+				cameraImageUrl: 4,
+				extraObjects: 5
 			},
 			add_css
 		);

package/libs/floorplan/PanoFloorplanRadarPlugin/Controller.d.ts

@@ -1,27 +1,36 @@
 import type { Five } from '@realsee/five';
+import type { BaseOptions } from '../../base/BasePlugin';
 import type { FloorplanServerData } from '../typings/floorplanServerData';
 import type { FloorplanExtraObject3D } from '../typings/floorplanData';
-export interface PanoFloorplanRadarPluginControllerParameter {
-    wrapper?: string | Element;
-    configs?: {
-        hoverEnable?: boolean;
-        cameraImageUrl?: string;
-    };
-}
-export default class PanoFloorplanRadarPluginController {
+import type { State, Config, EventMap, Parameters, PluginData, PluginServerData } from './typing';
+import * as BasePlugin from '../../base/BasePluginWithData';
+export declare class Controller extends BasePlugin.Controller<State, EventMap, PluginServerData, PluginData> {
+    name: string;
+    state: State;
+    protected data?: PluginData;
     private app?;
-    private five;
     private wrapperSelector;
-    private data?;
     private wrapper;
+    private disposed;
     private extraObjects;
-    private configs;
-    constructor(five: Five, params?: PanoFloorplanRadarPluginControllerParameter);
+    constructor(five: Five, params?: Parameters);
     dispose: () => void;
-    load: (data: FloorplanServerData) => Promise<void>;
+    load(serverData: PluginServerData | FloorplanServerData, state?: Partial<State>, userAction?: boolean): Promise<void>;
+    show(options?: BaseOptions): Promise<void>;
+    hide(options?: BaseOptions): Promise<void>;
+    enable(options?: BaseOptions): void;
+    disable(options?: BaseOptions): void;
+    /** 更改插件 State */
+    setState(state: Partial<State>, options?: BaseOptions): void;
     /** 把插件的渲染DOM插入到对应的容器中去 */
     appendTo(wrapper: Element): void;
-    changeConfigs(configs: PanoFloorplanRadarPluginController['configs']): void;
+    changeConfigs(config: Config, userAction?: boolean): void;
     setExtraObjectsWith3DPositions(data: FloorplanExtraObject3D[]): void;
+    protected formatData(serverData: PluginServerData): Promise<PluginData>;
+    private _enable;
+    private _disable;
+    private _show;
+    private _hide;
+    private updateState;
     private render;
 }