@realsee/dnalogel 2.0.0-alpha.3 → 2.0.0-alpha.31-beta

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

@@ -0,0 +1,168 @@
+/* generated by Svelte v3.47.0 */
+import {
+	SvelteComponent,
+	append,
+	append_styles,
+	attr,
+	detach,
+	element,
+	init,
+	insert,
+	noop,
+	safe_not_equal,
+	set_style
+} from "svelte/internal";
+
+import { onMount, onDestroy } from 'svelte';
+import { CAMERA_IMAGE } from '../../Assets/camera';
+import throttle from '../../../shared-utils/throttle';
+
+function add_css(target) {
+	append_styles(target, "svelte-o7uo2v", ".plugin-radar__camera-wrapper.svelte-o7uo2v{width:100%;height:100%;position:absolute;pointer-events:none}.plugin-radar__camera-position.svelte-o7uo2v{position:absolute;left:0;top:0;width:0;height:0;transform:none;pointer-events:none;transition:transform 1s linear}.plugin-radar__camera-rotate.svelte-o7uo2v{position:absolute;left:-15px;top:-15px;width:17px;height:17px;transform-origin:15px 15px;transform:rotate(45deg);background-repeat:no-repeat;background-size:100%}");
+}
+
+function create_fragment(ctx) {
+	let div2;
+	let div1;
+	let div0;
+
+	return {
+		c() {
+			div2 = element("div");
+			div1 = element("div");
+			div0 = element("div");
+			attr(div0, "class", "plugin-radar__camera-rotate svelte-o7uo2v");
+			set_style(div0, "background-image", "url(" + (/*cameraImageUrl*/ ctx[0] || CAMERA_IMAGE) + ")");
+			set_style(div0, "transform", /*rotateTransform*/ ctx[1], false);
+			attr(div1, "class", "plugin-radar__camera-position svelte-o7uo2v");
+			set_style(div1, "transform", /*positionTransform*/ ctx[2], false);
+			attr(div2, "class", "plugin-radar__camera-wrapper svelte-o7uo2v");
+		},
+		m(target, anchor) {
+			insert(target, div2, anchor);
+			append(div2, div1);
+			append(div1, div0);
+		},
+		p(ctx, [dirty]) {
+			if (dirty & /*cameraImageUrl*/ 1) {
+				set_style(div0, "background-image", "url(" + (/*cameraImageUrl*/ ctx[0] || CAMERA_IMAGE) + ")");
+			}
+
+			if (dirty & /*rotateTransform*/ 2) {
+				set_style(div0, "transform", /*rotateTransform*/ ctx[1], false);
+			}
+
+			if (dirty & /*positionTransform*/ 4) {
+				set_style(div1, "transform", /*positionTransform*/ ctx[2], false);
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (detaching) detach(div2);
+		}
+	};
+}
+
+function getCameraRotateTransform(longitude) {
+	// 为什么要加 45 ==> 因为 UI 给的图初始角度是 -45
+	const rotate = Math.floor(longitude / Math.PI * 180) * -1 + 45;
+
+	return `rotate(${rotate}deg)`;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let positionTransform;
+	let rotateTransform;
+	let { five } = $$props;
+	let { pxmm } = $$props;
+	let { floorplanData } = $$props;
+	let { cameraImageUrl } = $$props;
+	let panoIndex = five.getCurrentState().panoIndex;
+	let longitude = five.getCurrentState().longitude;
+
+	/** 获取相机在当前 Five 状态下的位移 */
+	function getCameraPositionTransform(floorplanData, panoIndex) {
+		const bounding = floorplanData.bounding;
+		const floorplanObserver = floorplanData.observers[panoIndex];
+		if (!floorplanObserver) return '';
+		const clientWidth = (bounding.max.x - bounding.min.x) * pxmm;
+		const clientHeight = (bounding.max.y - bounding.min.y) * pxmm;
+		const left = Math.floor(floorplanObserver.positionInImage.x * clientWidth);
+		const top = Math.floor(floorplanObserver.positionInImage.y * clientHeight);
+		return `translate(${left}px, ${top}px)`;
+	}
+
+	function onFivePanoWillArrive(_panoIndex) {
+		$$invalidate(6, panoIndex = _panoIndex);
+	}
+
+	const onFiveCameraDirectionUpdate = throttle(
+		pose => {
+			$$invalidate(7, longitude = pose.longitude);
+		},
+		1000 / 60
+	);
+
+	onMount(() => {
+		five.on('panoWillArrive', onFivePanoWillArrive);
+		five.on('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
+	});
+
+	onDestroy(() => {
+		five.off('panoWillArrive', onFivePanoWillArrive);
+		five.off('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
+	});
+
+	$$self.$$set = $$props => {
+		if ('five' in $$props) $$invalidate(3, five = $$props.five);
+		if ('pxmm' in $$props) $$invalidate(4, pxmm = $$props.pxmm);
+		if ('floorplanData' in $$props) $$invalidate(5, floorplanData = $$props.floorplanData);
+		if ('cameraImageUrl' in $$props) $$invalidate(0, cameraImageUrl = $$props.cameraImageUrl);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*floorplanData, panoIndex*/ 96) {
+			// 初始状态，不能等 mount 之后再计算，那样第一次 camera 展示的时候也会有动画
+			$: $$invalidate(2, positionTransform = getCameraPositionTransform(floorplanData, panoIndex));
+		}
+
+		if ($$self.$$.dirty & /*longitude*/ 128) {
+			$: $$invalidate(1, rotateTransform = getCameraRotateTransform(longitude));
+		}
+	};
+
+	return [
+		cameraImageUrl,
+		rotateTransform,
+		positionTransform,
+		five,
+		pxmm,
+		floorplanData,
+		panoIndex,
+		longitude
+	];
+}
+
+class Component extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(
+			this,
+			options,
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{
+				five: 3,
+				pxmm: 4,
+				floorplanData: 5,
+				cameraImageUrl: 0
+			},
+			add_css
+		);
+	}
+}
+
+export default Component;

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

@@ -0,0 +1,250 @@
+/* generated by Svelte v3.47.0 */
+import {
+	SvelteComponent,
+	assign,
+	check_outros,
+	create_component,
+	destroy_component,
+	detach,
+	empty,
+	get_spread_update,
+	group_outros,
+	init,
+	insert,
+	mount_component,
+	safe_not_equal,
+	space,
+	transition_in,
+	transition_out
+} from "svelte/internal";
+
+import ExtraObjects from './ExtraObjects';
+import BaseImage from '../../../Components/BaseImage';
+import Highlight from '../../../Components/RoomHighlight/RoomHighlight';
+
+function create_if_block(ctx) {
+	let highlight;
+	let current;
+
+	const highlight_spread_levels = [
+		{
+			five: /*five*/ ctx[0],
+			pxmm: /*pxmm*/ ctx[1],
+			floorIndex: /*floorIndex*/ ctx[2],
+			floorplanData: /*floorplanData*/ ctx[4],
+			onRoomHeightClick: /*onRoomHeightClick*/ ctx[6]
+		}
+	];
+
+	let highlight_props = {};
+
+	for (let i = 0; i < highlight_spread_levels.length; i += 1) {
+		highlight_props = assign(highlight_props, highlight_spread_levels[i]);
+	}
+
+	highlight = new Highlight({ props: highlight_props });
+
+	return {
+		c() {
+			create_component(highlight.$$.fragment);
+		},
+		m(target, anchor) {
+			mount_component(highlight, target, anchor);
+			current = true;
+		},
+		p(ctx, dirty) {
+			const highlight_changes = (dirty & /*five, pxmm, floorIndex, floorplanData, onRoomHeightClick*/ 87)
+			? get_spread_update(highlight_spread_levels, [
+					{
+						five: /*five*/ ctx[0],
+						pxmm: /*pxmm*/ ctx[1],
+						floorIndex: /*floorIndex*/ ctx[2],
+						floorplanData: /*floorplanData*/ ctx[4],
+						onRoomHeightClick: /*onRoomHeightClick*/ ctx[6]
+					}
+				])
+			: {};
+
+			highlight.$set(highlight_changes);
+		},
+		i(local) {
+			if (current) return;
+			transition_in(highlight.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(highlight.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			destroy_component(highlight, detaching);
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let baseimage;
+	let t0;
+	let extraobjects;
+	let t1;
+	let if_block_anchor;
+	let current;
+
+	const baseimage_spread_levels = [
+		{
+			floorIndex: /*floorIndex*/ ctx[2],
+			floorplanData: /*floorplanData*/ ctx[4]
+		}
+	];
+
+	let baseimage_props = {};
+
+	for (let i = 0; i < baseimage_spread_levels.length; i += 1) {
+		baseimage_props = assign(baseimage_props, baseimage_spread_levels[i]);
+	}
+
+	baseimage = new BaseImage({ props: baseimage_props });
+
+	extraobjects = new ExtraObjects({
+			props: {
+				extraObjects: /*currentFloorExtraObjects*/ ctx[5]
+			}
+		});
+
+	let if_block = /*hoverEnable*/ ctx[3] && create_if_block(ctx);
+
+	return {
+		c() {
+			create_component(baseimage.$$.fragment);
+			t0 = space();
+			create_component(extraobjects.$$.fragment);
+			t1 = space();
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			mount_component(baseimage, target, anchor);
+			insert(target, t0, anchor);
+			mount_component(extraobjects, target, anchor);
+			insert(target, t1, anchor);
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+			current = true;
+		},
+		p(ctx, [dirty]) {
+			const baseimage_changes = (dirty & /*floorIndex, floorplanData*/ 20)
+			? get_spread_update(baseimage_spread_levels, [
+					{
+						floorIndex: /*floorIndex*/ ctx[2],
+						floorplanData: /*floorplanData*/ ctx[4]
+					}
+				])
+			: {};
+
+			baseimage.$set(baseimage_changes);
+			const extraobjects_changes = {};
+			if (dirty & /*currentFloorExtraObjects*/ 32) extraobjects_changes.extraObjects = /*currentFloorExtraObjects*/ ctx[5];
+			extraobjects.$set(extraobjects_changes);
+
+			if (/*hoverEnable*/ ctx[3]) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+
+					if (dirty & /*hoverEnable*/ 8) {
+						transition_in(if_block, 1);
+					}
+				} else {
+					if_block = create_if_block(ctx);
+					if_block.c();
+					transition_in(if_block, 1);
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				group_outros();
+
+				transition_out(if_block, 1, 1, () => {
+					if_block = null;
+				});
+
+				check_outros();
+			}
+		},
+		i(local) {
+			if (current) return;
+			transition_in(baseimage.$$.fragment, local);
+			transition_in(extraobjects.$$.fragment, local);
+			transition_in(if_block);
+			current = true;
+		},
+		o(local) {
+			transition_out(baseimage.$$.fragment, local);
+			transition_out(extraobjects.$$.fragment, local);
+			transition_out(if_block);
+			current = false;
+		},
+		d(detaching) {
+			destroy_component(baseimage, detaching);
+			if (detaching) detach(t0);
+			destroy_component(extraobjects, detaching);
+			if (detaching) detach(t1);
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let currentFloorExtraObjects;
+	let { five } = $$props;
+	let { pxmm } = $$props;
+	let { floorIndex } = $$props;
+	let { hoverEnable } = $$props;
+	let { floorplanData } = $$props;
+	let { extraObjects = [] } = $$props;
+	const onRoomHeightClick = undefined;
+
+	$$self.$$set = $$props => {
+		if ('five' in $$props) $$invalidate(0, five = $$props.five);
+		if ('pxmm' in $$props) $$invalidate(1, pxmm = $$props.pxmm);
+		if ('floorIndex' in $$props) $$invalidate(2, floorIndex = $$props.floorIndex);
+		if ('hoverEnable' in $$props) $$invalidate(3, hoverEnable = $$props.hoverEnable);
+		if ('floorplanData' in $$props) $$invalidate(4, floorplanData = $$props.floorplanData);
+		if ('extraObjects' in $$props) $$invalidate(7, extraObjects = $$props.extraObjects);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*extraObjects, floorIndex*/ 132) {
+			$: $$invalidate(5, currentFloorExtraObjects = extraObjects === null || extraObjects === void 0
+			? void 0
+			: extraObjects.filter(object => object.floorIndex === floorIndex));
+		}
+	};
+
+	return [
+		five,
+		pxmm,
+		floorIndex,
+		hoverEnable,
+		floorplanData,
+		currentFloorExtraObjects,
+		onRoomHeightClick,
+		extraObjects
+	];
+}
+
+class Component extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(this, options, instance, create_fragment, safe_not_equal, {
+			five: 0,
+			pxmm: 1,
+			floorIndex: 2,
+			hoverEnable: 3,
+			floorplanData: 4,
+			extraObjects: 7
+		});
+	}
+}
+
+export default Component;

package/libs/floorplan/PanoFloorplanRadarPlugin/Components/CurrentFloor/ExtraObjects.js

@@ -0,0 +1,154 @@
+/* generated by Svelte v3.47.0 */
+import {
+	SvelteComponent,
+	append,
+	append_styles,
+	attr,
+	destroy_block,
+	detach,
+	element,
+	init,
+	insert,
+	noop,
+	safe_not_equal,
+	set_style,
+	space,
+	update_keyed_each
+} from "svelte/internal";
+
+function add_css(target) {
+	append_styles(target, "svelte-8n0d4v", ".plugin-pano-floorplan__extra-objects.svelte-8n0d4v{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.plugin-pano-floorplan__extra-object-item--position.svelte-8n0d4v{position:absolute;width:0;height:0}.plugin-pano-floorplan__extra-object-item.svelte-8n0d4v{transform:translate(-50%, -50%)}");
+}
+
+function get_each_context(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[1] = list[i];
+	return child_ctx;
+}
+
+// (5:2) {#each extraObjects as extraObject (extraObject.id)}
+function create_each_block(key_1, ctx) {
+	let div1;
+	let div0;
+	let style_width = `${/*extraObject*/ ctx[1].icon.width / 16}rem`;
+	let style_height = `${/*extraObject*/ ctx[1].icon.height / 16}rem`;
+	let t;
+	let style_top = `${/*extraObject*/ ctx[1].positionInImage.y * 100}%`;
+	let style_left = `${/*extraObject*/ ctx[1].positionInImage.x * 100}%`;
+
+	return {
+		key: key_1,
+		first: null,
+		c() {
+			div1 = element("div");
+			div0 = element("div");
+			t = space();
+			attr(div0, "class", "plugin-pano-floorplan__extra-object-item svelte-8n0d4v");
+			set_style(div0, "background-image", `url(${/*extraObject*/ ctx[1].icon.url})`);
+			set_style(div0, "width", style_width, false);
+			set_style(div0, "height", style_height, false);
+			attr(div1, "class", "plugin-pano-floorplan__extra-object-item--position svelte-8n0d4v");
+			set_style(div1, "top", style_top, false);
+			set_style(div1, "left", style_left, false);
+			this.first = div1;
+		},
+		m(target, anchor) {
+			insert(target, div1, anchor);
+			append(div1, div0);
+			append(div1, t);
+		},
+		p(new_ctx, dirty) {
+			ctx = new_ctx;
+
+			if (dirty & /*extraObjects*/ 1) {
+				set_style(div0, "background-image", `url(${/*extraObject*/ ctx[1].icon.url})`);
+			}
+
+			if (dirty & /*extraObjects*/ 1 && style_width !== (style_width = `${/*extraObject*/ ctx[1].icon.width / 16}rem`)) {
+				set_style(div0, "width", style_width, false);
+			}
+
+			if (dirty & /*extraObjects*/ 1 && style_height !== (style_height = `${/*extraObject*/ ctx[1].icon.height / 16}rem`)) {
+				set_style(div0, "height", style_height, false);
+			}
+
+			if (dirty & /*extraObjects*/ 1 && style_top !== (style_top = `${/*extraObject*/ ctx[1].positionInImage.y * 100}%`)) {
+				set_style(div1, "top", style_top, false);
+			}
+
+			if (dirty & /*extraObjects*/ 1 && style_left !== (style_left = `${/*extraObject*/ ctx[1].positionInImage.x * 100}%`)) {
+				set_style(div1, "left", style_left, false);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(div1);
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let div;
+	let each_blocks = [];
+	let each_1_lookup = new Map();
+	let each_value = /*extraObjects*/ ctx[0];
+	const get_key = ctx => /*extraObject*/ ctx[1].id;
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		let child_ctx = get_each_context(ctx, each_value, i);
+		let key = get_key(child_ctx);
+		each_1_lookup.set(key, each_blocks[i] = create_each_block(key, child_ctx));
+	}
+
+	return {
+		c() {
+			div = element("div");
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			attr(div, "class", "plugin-pano-floorplan__extra-objects svelte-8n0d4v");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(div, null);
+			}
+		},
+		p(ctx, [dirty]) {
+			if (dirty & /*extraObjects*/ 1) {
+				each_value = /*extraObjects*/ ctx[0];
+				each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div, destroy_block, create_each_block, null, get_each_context);
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (detaching) detach(div);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].d();
+			}
+		}
+	};
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let { extraObjects = [] } = $$props;
+
+	$$self.$$set = $$props => {
+		if ('extraObjects' in $$props) $$invalidate(0, extraObjects = $$props.extraObjects);
+	};
+
+	return [extraObjects];
+}
+
+class Component extends SvelteComponent {
+	constructor(options) {
+		super();
+		init(this, options, instance, create_fragment, safe_not_equal, { extraObjects: 0 }, add_css);
+	}
+}
+
+export default Component;