@realsee/dnalogel 2.0.0-alpha.1 → 2.0.0-alpha.10

package/libs/ModelRoomLabelPlugin/RoomLabelItem.js

@@ -0,0 +1,121 @@
+/* generated by Svelte v3.47.0 */
+import {
+	SvelteComponent,
+	append,
+	append_styles,
+	attr,
+	detach,
+	element,
+	init,
+	insert,
+	listen,
+	noop,
+	safe_not_equal,
+	set_data,
+	set_style,
+	space,
+	text,
+	toggle_class
+} from "svelte/internal";
+
+import { ROOM_LABEL_BG } from './Assets/roomLabelBg';
+
+function add_css(target) {
+	append_styles(target, "svelte-17nkflf", ".room-label-item.svelte-17nkflf{position:absolute;font-size:8px;z-index:0;transform:none;cursor:pointer;pointer-events:none;user-select:none}.room-label-item__text.svelte-17nkflf{position:absolute;left:0;top:-64px;transform:translate(-50%, 0);display:flex;justify-content:center;align-items:center;height:20px;min-width:32px;padding:0 6px;pointer-events:all;background-size:100% 100%;background-repeat:no-repeat;white-space:nowrap}.room-label-item__bar.svelte-17nkflf{position:absolute;top:-44px;height:48px;width:1px;background-image:linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0))}.wide.svelte-17nkflf{font-size:10px}");
+}
+
+function create_fragment(ctx) {
+	let div1;
+	let span;
+	let t0_value = /*roomLabel*/ ctx[0].name + "";
+	let t0;
+	let t1;
+	let div0;
+	let mounted;
+	let dispose;
+
+	return {
+		c() {
+			div1 = element("div");
+			span = element("span");
+			t0 = text(t0_value);
+			t1 = space();
+			div0 = element("div");
+			attr(span, "class", "room-label-item__text svelte-17nkflf");
+			set_style(span, "background-image", "url(" + ROOM_LABEL_BG + ")");
+			toggle_class(span, "wide", /*roomLabel*/ ctx[0].name.length > 3);
+			attr(div0, "class", "room-label-item__bar svelte-17nkflf");
+			attr(div1, "class", "room-label-item svelte-17nkflf");
+			set_style(div1, "z-index", /*roomLabel*/ ctx[0].zIndex, false);
+			set_style(div1, "transform", /*roomLabel*/ ctx[0].transform, false);
+			set_style(div1, "opacity", /*roomLabel*/ ctx[0].visible ? 1 : 0, false);
+		},
+		m(target, anchor) {
+			insert(target, div1, anchor);
+			append(div1, span);
+			append(span, t0);
+			append(div1, t1);
+			append(div1, div0);
+
+			if (!mounted) {
+				dispose = listen(span, "click", /*onClick*/ ctx[1]);
+				mounted = true;
+			}
+		},
+		p(ctx, [dirty]) {
+			if (dirty & /*roomLabel*/ 1 && t0_value !== (t0_value = /*roomLabel*/ ctx[0].name + "")) set_data(t0, t0_value);
+
+			if (dirty & /*roomLabel*/ 1) {
+				toggle_class(span, "wide", /*roomLabel*/ ctx[0].name.length > 3);
+			}
+
+			if (dirty & /*roomLabel*/ 1) {
+				set_style(div1, "z-index", /*roomLabel*/ ctx[0].zIndex, false);
+			}
+
+			if (dirty & /*roomLabel*/ 1) {
+				set_style(div1, "transform", /*roomLabel*/ ctx[0].transform, false);
+			}
+
+			if (dirty & /*roomLabel*/ 1) {
+				set_style(div1, "opacity", /*roomLabel*/ ctx[0].visible ? 1 : 0, false);
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (detaching) detach(div1);
+			mounted = false;
+			dispose();
+		}
+	};
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let { five } = $$props;
+	let { roomLabel } = $$props;
+
+	function onClick() {
+		five.setState({
+			panoIndex: roomLabel.panoIndex,
+			mode: 'Panorama',
+			longitude: roomLabel.longitude
+		});
+	}
+
+	$$self.$$set = $$props => {
+		if ('five' in $$props) $$invalidate(2, five = $$props.five);
+		if ('roomLabel' in $$props) $$invalidate(0, roomLabel = $$props.roomLabel);
+	};
+
+	return [roomLabel, onClick, five];
+}
+
+class Component extends SvelteComponent {
+	constructor(options) {
+		super();
+		init(this, options, instance, create_fragment, safe_not_equal, { five: 2, roomLabel: 0 }, add_css);
+	}
+}
+
+export default Component;

package/libs/ModelRoomLabelPlugin/RoomLabelItems.js

@@ -0,0 +1,253 @@
+/* generated by Svelte v3.47.0 */
+import {
+	SvelteComponent,
+	add_render_callback,
+	add_resize_listener,
+	append_styles,
+	attr,
+	check_outros,
+	create_component,
+	destroy_component,
+	detach,
+	element,
+	empty,
+	group_outros,
+	init,
+	insert,
+	mount_component,
+	outro_and_destroy_block,
+	safe_not_equal,
+	transition_in,
+	transition_out,
+	update_keyed_each
+} from "svelte/internal";
+
+import { onDestroy, onMount } from 'svelte';
+import { Raycaster, Vector3 } from 'three';
+import RoomLabelItem from './RoomLabelItem';
+
+function add_css(target) {
+	append_styles(target, "svelte-185yvaa", ".room-labels-container.svelte-185yvaa{width:100%;height:100%;position:relative;color:#fff}");
+}
+
+function get_each_context(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[9] = list[i];
+	return child_ctx;
+}
+
+// (68:2) {#each roomLabels as roomLableItem (roomLableItem.id)}
+function create_each_block(key_1, ctx) {
+	let first;
+	let roomlabelitem;
+	let current;
+
+	roomlabelitem = new RoomLabelItem({
+			props: {
+				roomLabel: /*roomLableItem*/ ctx[9],
+				five: /*five*/ ctx[1]
+			}
+		});
+
+	return {
+		key: key_1,
+		first: null,
+		c() {
+			first = empty();
+			create_component(roomlabelitem.$$.fragment);
+			this.first = first;
+		},
+		m(target, anchor) {
+			insert(target, first, anchor);
+			mount_component(roomlabelitem, target, anchor);
+			current = true;
+		},
+		p(new_ctx, dirty) {
+			ctx = new_ctx;
+			const roomlabelitem_changes = {};
+			if (dirty & /*roomLabels*/ 1) roomlabelitem_changes.roomLabel = /*roomLableItem*/ ctx[9];
+			if (dirty & /*five*/ 2) roomlabelitem_changes.five = /*five*/ ctx[1];
+			roomlabelitem.$set(roomlabelitem_changes);
+		},
+		i(local) {
+			if (current) return;
+			transition_in(roomlabelitem.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(roomlabelitem.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(first);
+			destroy_component(roomlabelitem, detaching);
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let div;
+	let each_blocks = [];
+	let each_1_lookup = new Map();
+	let div_resize_listener;
+	let current;
+	let each_value = /*roomLabels*/ ctx[0];
+	const get_key = ctx => /*roomLableItem*/ ctx[9].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", "room-labels-container svelte-185yvaa");
+			add_render_callback(() => /*div_elementresize_handler*/ ctx[4].call(div));
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(div, null);
+			}
+
+			div_resize_listener = add_resize_listener(div, /*div_elementresize_handler*/ ctx[4].bind(div));
+			current = true;
+		},
+		p(ctx, [dirty]) {
+			if (dirty & /*roomLabels, five*/ 3) {
+				each_value = /*roomLabels*/ ctx[0];
+				group_outros();
+				each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div, outro_and_destroy_block, create_each_block, null, get_each_context);
+				check_outros();
+			}
+		},
+		i(local) {
+			if (current) return;
+
+			for (let i = 0; i < each_value.length; i += 1) {
+				transition_in(each_blocks[i]);
+			}
+
+			current = true;
+		},
+		o(local) {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				transition_out(each_blocks[i]);
+			}
+
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].d();
+			}
+
+			div_resize_listener();
+		}
+	};
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let { five } = $$props;
+	let { roomLabels } = $$props;
+	let containerWidth;
+	let containerHeight;
+
+	function getLabelVisible(five, roomLabelItem) {
+		// 先看是不是在当前展示的楼层上
+		const isLabelInFloor = five.model.shownFloor === null || roomLabelItem.floorIndex === five.model.shownFloor;
+
+		if (!isLabelInFloor) return false;
+
+		// 再看是不是被模型遮挡
+		const raycaster = new Raycaster();
+
+		const cameraPosition = five.camera.position.clone();
+		const position = new Vector3(roomLabelItem.position.x, roomLabelItem.position.y, roomLabelItem.position.z);
+		const vectorDistance = position.distanceTo(cameraPosition);
+		raycaster.set(cameraPosition.clone(), position.clone().sub(cameraPosition).normalize());
+		const [intersection] = five.model.intersectRaycaster(raycaster);
+		if (intersection && intersection.distance + 1 < vectorDistance) return false;
+		return true;
+	}
+
+	function getLabelTransform(five, roomLabelItem) {
+		const position = new Vector3(roomLabelItem.position.x, roomLabelItem.position.y, roomLabelItem.position.z);
+		const mouse = position.clone().project(five.camera);
+		const xOffset = Math.ceil((mouse.x + 1) / 2 * containerWidth);
+		const yOffset = Math.ceil((-mouse.y + 1) / 2 * containerHeight);
+		return `translate(${xOffset}px, ${yOffset}px)`;
+	}
+
+	function getFormatedRoomLabels(five, labels) {
+		const newLabels = labels.map(roomLabelItem => {
+			// 计算是否可见，入股不可见，不会更新位置
+			const visible = getLabelVisible(five, roomLabelItem);
+
+			if (!visible) return { ...roomLabelItem, visible };
+
+			// 更新位置
+			const transform = getLabelTransform(five, roomLabelItem);
+
+			return { ...roomLabelItem, visible, transform };
+		});
+
+		const sortedRoomLabelItems = newLabels.filter(({ visible }) => visible).map(roomLabelItem => ({
+			roomLabelItem,
+			distance: new Vector3(...Object.values(roomLabelItem.position)).clone().distanceTo(five.camera.position)
+		})).sort((a, b) => a.distance - b.distance);
+
+		return newLabels.map(roomLabelItem => {
+			const sortIndex = sortedRoomLabelItems.findIndex(item => item.roomLabelItem.id === roomLabelItem.id);
+			if (sortIndex !== undefined) return { ...roomLabelItem, zIndex: sortIndex * 10 };
+			return roomLabelItem;
+		});
+	}
+
+	function onFiveCameraUpdate() {
+		$$invalidate(0, roomLabels = getFormatedRoomLabels(five, roomLabels));
+	}
+
+	five.on('cameraUpdate', onFiveCameraUpdate);
+
+	onDestroy(() => {
+		five.off('cameraUpdate', onFiveCameraUpdate);
+	});
+
+	onMount(() => {
+		onFiveCameraUpdate();
+	});
+
+	function div_elementresize_handler() {
+		containerWidth = this.clientWidth;
+		containerHeight = this.clientHeight;
+		$$invalidate(2, containerWidth);
+		$$invalidate(3, containerHeight);
+	}
+
+	$$self.$$set = $$props => {
+		if ('five' in $$props) $$invalidate(1, five = $$props.five);
+		if ('roomLabels' in $$props) $$invalidate(0, roomLabels = $$props.roomLabels);
+	};
+
+	return [roomLabels, five, containerWidth, containerHeight, div_elementresize_handler];
+}
+
+class Component extends SvelteComponent {
+	constructor(options) {
+		super();
+		init(this, options, instance, create_fragment, safe_not_equal, { five: 1, roomLabels: 0 }, add_css);
+	}
+}
+
+export default Component;

package/libs/ModelViewPlugin/index.js

@@ -5,6 +5,7 @@ import * as THREE from 'three';
  */
 export const ModelViewPlugin = (five) => {
     let needsRender = true;
+    let renderer = null;
     const scene = new THREE.Scene();
     const camera = new THREE.PerspectiveCamera(60, 1, 0.1, 1000);
     let model = new THREE.Object3D();
@@ -22,7 +23,6 @@ export const ModelViewPlugin = (five) => {
         scene.add(light);
     }
     scene.add(model);
-    let renderer = null;
     const initRendererIfNeeds = () => {
         if (!five.renderer)
             return;
@@ -35,7 +35,7 @@ export const ModelViewPlugin = (five) => {
         }
         return renderer;
     };
-    const modelWillLoad = () => {
+    const handleModelWillLoad = () => {
         model.traverse((object) => {
             if (object instanceof THREE.Mesh) {
                 const materials = [].concat(object.material);
@@ -47,7 +47,7 @@ export const ModelViewPlugin = (five) => {
         scene.add(model);
         update();
     };
-    const modelLoaded = () => {
+    const handleModelLoaded = () => {
         function cloneMaterial(material) {
             material = material.clone();
             material.uniforms.modelAlpha.value = 1;
@@ -105,7 +105,7 @@ export const ModelViewPlugin = (five) => {
             camera.aspect = width / height;
             camera.updateProjectionMatrix();
         }
-        needsRender = true;
+        update();
     };
     const cameraDistance = () => {
         const bounding = five.model.bounding;
@@ -150,8 +150,8 @@ export const ModelViewPlugin = (five) => {
             renderer.dispose();
         renderer = null;
     };
-    five.on('modelLoaded', modelLoaded);
-    five.on('modelWillLoad', modelWillLoad);
+    five.on('modelLoaded', handleModelLoaded);
+    five.on('modelWillLoad', handleModelWillLoad);
     five.on('cameraDirectionUpdate', update);
     five.on('dispose', dispose);
     five.on('renderFrame', render);

package/libs/PanoCompassPlugin/Assets/roomInfoIcon.d.ts

@@ -0,0 +1 @@
+export declare const roomInfoIcon = "data:image/png;base64,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";

package/libs/PanoCompassPlugin/Assets/roomInfoIcon.js

@@ -0,0 +1 @@
+export const roomInfoIcon = 'data:image/png;base64,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';

package/libs/PanoCompassPlugin/getRoomInfoInstance.d.ts

@@ -0,0 +1,8 @@
+import type { FloorplanServerRoomItem } from '../floorplan/typings/floorplanServerData';
+export declare function getRoomInfoInstance(): {
+    appendTo(element: Element): void;
+    dispose(): void;
+    setRoom(room: FloorplanServerRoomItem): void;
+    show(): void;
+    hide(): void;
+};

package/libs/PanoCompassPlugin/getRoomInfoInstance.js

@@ -0,0 +1,48 @@
+import { roomInfoIcon } from './Assets/roomInfoIcon';
+export function getRoomInfoInstance() {
+    const infoDom = document.createElement('div');
+    const iconDom = document.createElement('i');
+    const textDom = document.createElement('span');
+    infoDom.appendChild(iconDom);
+    infoDom.appendChild(textDom);
+    // infoDom style
+    infoDom.style.position = 'relative';
+    infoDom.style.width = '100%';
+    infoDom.style.display = 'flex';
+    infoDom.style.flexDirection = 'column';
+    infoDom.style.alignItems = 'center';
+    infoDom.style.marginTop = `${150 / 16}rem`;
+    infoDom.style.opacity = '0';
+    infoDom.style.transition = 'opacity 1000ms linear';
+    // iconDom style
+    iconDom.style.display = 'block';
+    iconDom.style.width = `${134 / 16}rem`;
+    iconDom.style.height = `${22 / 16}rem`;
+    iconDom.style.backgroundSize = '100%';
+    iconDom.style.backgroundRepeat = 'no-repeat';
+    iconDom.style.backgroundImage = `url(${roomInfoIcon})`;
+    textDom.style.marginTop = `${10 / 16}rem`;
+    // textDom style
+    textDom.style.fontSize = `${16 / 16}rem`;
+    textDom.style.color = '#fff';
+    textDom.style.opacity = '0.7';
+    textDom.style.textShadow = '0 2px 16px rgb(22 34 83 / 24%)';
+    textDom.style.fontWeight = 'bold';
+    return {
+        appendTo(element) {
+            element.appendChild(infoDom);
+        },
+        dispose() {
+            infoDom.remove();
+        },
+        setRoom(room) {
+            textDom.innerHTML = room.name + ' ' + Math.floor(room.size / 1000000) + '㎡';
+        },
+        show() {
+            infoDom.style.opacity = '1';
+        },
+        hide() {
+            infoDom.style.opacity = '0';
+        }
+    };
+}

package/libs/PanoCompassPlugin/index.d.ts

@@ -0,0 +1,51 @@
+import type { Five, FivePlugin } from '@realsee/five';
+import type { FloorplanServerRoomItem } from '../floorplan/typings/floorplanServerData';
+export interface PanoCompassPluginParameterType {
+    compassImageUrl?: string;
+    entryDoorImageUrl?: string;
+}
+export interface PanoCompassPluginData {
+    north_rad: null | number;
+    entrance: null | undefined | {
+        position: {
+            x: number;
+            y: number;
+            z: number;
+        };
+    };
+    room_observers: undefined | {
+        index: number;
+        floor_index: number;
+        room: FloorplanServerRoomItem;
+    }[];
+}
+export declare type PanoCompassPluginExportType = PanoCompassController;
+export declare const panoCompassPluginServerParams: {
+    name: string;
+    version: number;
+};
+export declare const PanoCompassPlugin: FivePlugin<PanoCompassPluginParameterType | undefined, PanoCompassController>;
+export default PanoCompassPlugin;
+declare class PanoCompassController {
+    five: Five;
+    data?: PanoCompassPluginData;
+    config?: PanoCompassPluginParameterType;
+    private group;
+    private modelLoaded;
+    private roomInfoInstance?;
+    private roomInfoWrapperInstance?;
+    private compassMeshTween?;
+    private compassMesh?;
+    private entryDoorMesh?;
+    constructor(five: Five, config?: PanoCompassPluginParameterType);
+    load(data: PanoCompassPluginData): void;
+    dispose: () => void;
+    private onFiveFistPanoLoaded;
+    private init;
+    private loadCompassMesh;
+    private loadEntryDoorMesh;
+    private loadRoomInfo;
+    private onFivePanoWillArrive;
+    private onFivePanoArrived;
+    private onFiveCameraDirectionUpdate;
+}