@realsee/dnalogel 2.0.0-alpha.32 → 2.0.0-alpha.34

package/libs/components/PaintBrush/Subscribe.js

@@ -0,0 +1,121 @@
+// type UniqueSymbol = ReturnType<(a: string) => { readonly 0: unique symbol }[0]>;
+//
+// function createSymbol(description: string): UniqueSymbol {
+//   // TODO 解决提示
+//   // @ts-ignore
+//   return typeof Symbol === "undefined" ? `$Symbol<${description}>$` : Symbol(description);
+// }
+//
+// const EVENT_SYMBOL = createSymbol("$$LIVE_EVENT$$")
+const EVENT_SYMBOL = Symbol("$$PAINT_BRUSH_EVENT$$");
+function __generateEventIfNotExisted(instance) {
+    if (!instance[EVENT_SYMBOL]) {
+        instance[EVENT_SYMBOL] = {};
+    }
+    return instance[EVENT_SYMBOL];
+}
+function __removeEventIfNotExisted(instance) {
+    if (!instance[EVENT_SYMBOL]) {
+        delete instance[EVENT_SYMBOL];
+    }
+}
+/**
+ * 监听者模式
+ * @template T 预设的监听回调类型
+ * @example
+ * ```
+ * new Subscribe<{
+ * "foo": [arg1: number, arg2: string],
+ * "bar": [arg: boolean],
+ * }>()
+ * ```
+ */
+class Subscribe {
+    /**
+     * 判断是否注册了事件
+     * @param name  事件类型
+     */
+    hasListener(name) {
+        const events = __generateEventIfNotExisted(this);
+        return events && events[name] && events[name].length > 0;
+    }
+    /**
+     * 注册事件
+     * @param  name    事件类型
+     * @param  callback 事件回调函数
+     * @param  once     是否只执行一次
+     * @returns 解除事件
+     * @template K 预设的监听事件名称
+     * @template C 回调函数函数上下文
+     */
+    on(name, callback, once) {
+        const events = __generateEventIfNotExisted(this);
+        if (!events[name])
+            events[name] = [];
+        events[name].push([callback, once || false]);
+        return () => this.off(name, callback);
+    }
+    /**
+     * 注册事件(是否只执行一次)
+     * @param  name     事件类型
+     * @param  callback 事件回调函数
+     * @returns 解除事件
+     * @template K 预设的监听事件名称
+     * @template C 回调函数函数上下文
+     */
+    once(name, callback) {
+        return this.on(name, callback, true);
+    }
+    /**
+     * 解除事件
+     *
+     * 如果 name 不传的话解除对应所有事件
+     * 如果 name, callback 不传的话解除所有name的所有事件
+     * @param  name     事件类型
+     * @param  callback 事件回调函数
+     * @template K 预设的监听事件名称
+     */
+    off(name, callback) {
+        if (name === undefined) {
+            __removeEventIfNotExisted(this);
+            return;
+        }
+        const events = __generateEventIfNotExisted(this);
+        if (!events[name])
+            events[name] = [];
+        if (callback === undefined) {
+            events[name].length = 0;
+            return;
+        }
+        let index = 0;
+        for (; index < events[name].length; index++) {
+            if (events[name][index][0] === callback)
+                break;
+        }
+        if (index < events[name].length) {
+            events[name].splice(index, 1);
+        }
+    }
+    /**
+     * 触发事件
+     * @param  name  事件类型
+     * @param  data  触发事件的数据
+     * @returns canceled 是否被触发取消
+     * @template K 预设的监听事件名称
+     */
+    emit(name, ...data) {
+        let canceled = false;
+        const events = __generateEventIfNotExisted(this);
+        const event = events[name] || [];
+        for (let one of event.slice()) {
+            const [callback, once = false] = one;
+            const result = callback(...data);
+            if (once)
+                this.off(name, callback);
+            if (result === false)
+                canceled = true;
+        }
+        return canceled;
+    }
+}
+export { Subscribe };

package/libs/components/PaintBrush/index.d.ts

@@ -0,0 +1,27 @@
+import type { PaintBrushAction, PaintBrushConfigs, PaintBrushEventMap, PaintBrushState } from './typings';
+export declare class PaintBrush {
+    private controller;
+    constructor(configs?: Partial<PaintBrushConfigs>);
+    on<K extends keyof PaintBrushEventMap>(name: K, callback: (...args: Parameters<PaintBrushEventMap[K]>) => ReturnType<PaintBrushEventMap[K]>): void;
+    off<K extends keyof PaintBrushEventMap>(name: K, callback: (...args: Parameters<PaintBrushEventMap[K]>) => ReturnType<PaintBrushEventMap[K]>): void;
+    once<K extends keyof PaintBrushEventMap>(name: K, callback: (...args: Parameters<PaintBrushEventMap[K]>) => ReturnType<PaintBrushEventMap[K]>): void;
+    /**
+     * 显示画笔。
+     */
+    show(): void;
+    action(action: PaintBrushAction): void;
+    /**
+     * 获取画笔状态。
+     */
+    get state(): Record<string, PaintBrushState[]>;
+    get configs(): PaintBrushConfigs;
+    /**
+     * 销毁。
+     *
+     * @deprecated
+     *
+     * @description 画笔应该维护一个 **全局单例**，重复利用。
+     */
+    dispose(): void;
+    setCurrentColor(color: string): void;
+}

package/libs/components/PaintBrush/index.js

@@ -0,0 +1,57 @@
+import { Controller } from './Controller';
+export class PaintBrush {
+    constructor(configs = {}) {
+        Object.defineProperty(this, "controller", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        const _configs = Object.assign({
+            currentColor: '#f44336',
+            onUndoText: '回退',
+            onExitText: '关闭'
+        }, configs);
+        this.controller = new Controller(_configs);
+    }
+    on(name, callback) {
+        this.controller.on(name, callback);
+    }
+    off(name, callback) {
+        this.controller.off(name, callback);
+    }
+    once(name, callback) {
+        this.controller.once(name, callback);
+    }
+    /**
+     * 显示画笔。
+     */
+    show() {
+        this.controller.openBrush();
+    }
+    action(action) {
+        this.controller.action(action);
+    }
+    /**
+     * 获取画笔状态。
+     */
+    get state() {
+        return this.controller.state;
+    }
+    get configs() {
+        return this.controller.configs;
+    }
+    /**
+     * 销毁。
+     *
+     * @deprecated
+     *
+     * @description 画笔应该维护一个 **全局单例**，重复利用。
+     */
+    dispose() {
+        return this.controller.destroyBrush();
+    }
+    setCurrentColor(color) {
+        this.controller.updateCurrentColor(color);
+    }
+}

package/libs/components/PaintBrush/style.d.ts

@@ -0,0 +1,2 @@
+declare const PaintBrushStyle = "\n<style type=\"text/css\">\n\n#_gl_paintBrush {\nposition: fixed;\ntop: 0;\nbottom: 0;\nleft: 0;\nright: 0;\ntransform: translateZ(0);\nz-index: 1997;\npointer-events: none;\nopacity: 0;\ntransition: all 500ms;\n}\n\n#_gl_paintBrush.brushing {\n  opacity: 1;\n}\n\n#_gl_paintBrush ._paintBrush-canvas {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n}\n\n#_gl_paintBrush ._paintBrush-canvas--sync {\n  pointer-events: none;\n  z-index: 0;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n}\n\n#_gl_paintBrush ._paintBrush-canvas {\n  pointer-events: none;\n  z-index: 1;\n}\n\n#_gl_paintBrush.brushing ._paintBrush-canvas {\n  pointer-events: auto;\n}\n\n#_gl_paintBrush ._paintBrush-ctrl {\n  width: 140px;\n  height: 52px;\n  position: absolute;\n  bottom: 28px;\n  right: 50%;\n  transform: translateX(50%);\n  font-size: 10px;\n  color: white;\n  z-index: 2;\n}\n\n#_gl_paintBrush.brushing ._paintBrush-ctrl {\n  pointer-events: auto;\n}\n\n#_gl_paintBrush ._paintBrush-ctrl ._paintBrush-ctrlinner {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 100%;\n  height: 100%;\n  border-radius: 26px;\n  padding: 8px 16px;\n  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2);\n  background-image: linear-gradient(180deg, hsl(0deg 0% 0% / 57%), hsl(0deg 0% 0% / 70%) 117%);\n}\n\n._paintBrush-ctrlitem {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  width: 38px;\n  height: 38px;\n  cursor: pointer;\n}\n\n._paintBrush-ctrlitem--undo >.brush-icon{\n    background-image: url(\"//vrlab-static.ljcdn.com/release/web/revoke.ab7694ef.svg\");\n    background-size: 100%;\n    width: 22px;\n    height: 22px;\n}\n\n._paintBrush-ctrlitem--close >.brush-icon {\n    background-image: url(\"//vrlab-static.ljcdn.com/release/web/exit_paintbrush.02bc1341.svg\");\n    background-size: 100%;\n    width: 22px;\n    height: 22px;\n}\n\n</style>\n";
+export default PaintBrushStyle;

package/libs/components/PaintBrush/style.js

@@ -0,0 +1,102 @@
+const PaintBrushStyle = `
+<style type="text/css">
+
+#_gl_paintBrush {
+position: fixed;
+top: 0;
+bottom: 0;
+left: 0;
+right: 0;
+transform: translateZ(0);
+z-index: 1997;
+pointer-events: none;
+opacity: 0;
+transition: all 500ms;
+}
+
+#_gl_paintBrush.brushing {
+  opacity: 1;
+}
+
+#_gl_paintBrush ._paintBrush-canvas {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+}
+
+#_gl_paintBrush ._paintBrush-canvas--sync {
+  pointer-events: none;
+  z-index: 0;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+}
+
+#_gl_paintBrush ._paintBrush-canvas {
+  pointer-events: none;
+  z-index: 1;
+}
+
+#_gl_paintBrush.brushing ._paintBrush-canvas {
+  pointer-events: auto;
+}
+
+#_gl_paintBrush ._paintBrush-ctrl {
+  width: 140px;
+  height: 52px;
+  position: absolute;
+  bottom: 28px;
+  right: 50%;
+  transform: translateX(50%);
+  font-size: 10px;
+  color: white;
+  z-index: 2;
+}
+
+#_gl_paintBrush.brushing ._paintBrush-ctrl {
+  pointer-events: auto;
+}
+
+#_gl_paintBrush ._paintBrush-ctrl ._paintBrush-ctrlinner {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  border-radius: 26px;
+  padding: 8px 16px;
+  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2);
+  background-image: linear-gradient(180deg, hsl(0deg 0% 0% / 57%), hsl(0deg 0% 0% / 70%) 117%);
+}
+
+._paintBrush-ctrlitem {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  width: 38px;
+  height: 38px;
+  cursor: pointer;
+}
+
+._paintBrush-ctrlitem--undo >.brush-icon{
+    background-image: url("//vrlab-static.ljcdn.com/release/web/revoke.ab7694ef.svg");
+    background-size: 100%;
+    width: 22px;
+    height: 22px;
+}
+
+._paintBrush-ctrlitem--close >.brush-icon {
+    background-image: url("//vrlab-static.ljcdn.com/release/web/exit_paintbrush.02bc1341.svg");
+    background-size: 100%;
+    width: 22px;
+    height: 22px;
+}
+
+</style>
+`;
+export default PaintBrushStyle;

package/libs/components/PaintBrush/tween.d.ts

@@ -0,0 +1,62 @@
+import { Tween } from '@tweenjs/tween.js';
+export declare const Easing: {
+    Linear: {
+        None: (amount: number) => number;
+    };
+    Quadratic: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+    Cubic: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+    Quartic: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+    Quintic: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+    Sinusoidal: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+    Exponential: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+    Circular: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+    Elastic: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+    Back: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+    Bounce: {
+        In: (amount: number) => number;
+        Out: (amount: number) => number;
+        InOut: (amount: number) => number;
+    };
+};
+export interface TweenRes extends Tween<any> {
+    onDestroy: (fn: () => void) => any;
+    destroy: () => any;
+}
+export default function tween(from: any, to: any, duration: number, easing?: (amount: number) => number): TweenRes;
+export declare function tweenProgress(duration: number, easing: (amount: number) => number): TweenRes;

package/libs/components/PaintBrush/tween.js

@@ -0,0 +1,15 @@
+import TWEEN from '@tweenjs/tween.js';
+export const Easing = TWEEN.Easing;
+export default function tween(from, to, duration, easing = Easing.Linear.None) {
+    const tweenInstance = new TWEEN.Tween(from).to(to, duration).easing(easing).start();
+    function animate(time) {
+        if (!tweenInstance.update(time))
+            return;
+        requestAnimationFrame(animate);
+    }
+    requestAnimationFrame(animate);
+    return tweenInstance;
+}
+export function tweenProgress(duration, easing) {
+    return tween({ progress: 0 }, { progress: 1 }, duration, easing);
+}

package/libs/components/PaintBrush/typings.d.ts

@@ -0,0 +1,58 @@
+export interface PaintBrushConfigs {
+    container?: HTMLDivElement;
+    currentColor: string;
+    DPR?: number;
+    onClickClose?: () => void;
+    onClickUndo?: () => void;
+    onUndoText?: string;
+    onExitText?: string;
+}
+export declare type PaintBrushEventMap = {
+    readyChange: (ready: boolean) => void;
+    stateChange: (state: PaintBrushAction, userAction: boolean) => void;
+};
+export interface PaintBrushState {
+    move: {
+        x: number;
+        y: number;
+    };
+    line: {
+        x: number;
+        y: number;
+    }[];
+    color: string;
+    uuid: string;
+    duration: number;
+}
+export declare enum PaintBrushTypeEnum {
+    Drawline = "Drawline",
+    Undo = "Undo",
+    Exit = "Exit"
+}
+export interface PaintBrushAction {
+    uuid: string;
+    /**
+     * 类型枚举
+     */
+    type: PaintBrushTypeEnum;
+    /**
+     * 颜色色值
+     */
+    color: string;
+    /**
+     * 是否就绪
+     */
+    ready: boolean;
+    /**
+     * 状态值
+     */
+    state?: PaintBrushState;
+    /**
+     * 时间戳：当作 uuid 使用
+     */
+    timestamp?: number;
+    /**
+     * 是否是结尾数据
+     */
+    end?: boolean;
+}

package/libs/components/PaintBrush/typings.js

@@ -0,0 +1,6 @@
+export var PaintBrushTypeEnum;
+(function (PaintBrushTypeEnum) {
+    PaintBrushTypeEnum["Drawline"] = "Drawline";
+    PaintBrushTypeEnum["Undo"] = "Undo";
+    PaintBrushTypeEnum["Exit"] = "Exit";
+})(PaintBrushTypeEnum || (PaintBrushTypeEnum = {}));

package/libs/components/PaintBrush/utils.d.ts

@@ -0,0 +1,26 @@
+export declare function noop(): void;
+export interface Coords {
+    x: number;
+    y: number;
+}
+export declare function queue(promiseCallback?: () => Promise<void>): void;
+export declare function transformCoords(coords: Coords, cw: number, ch: number): {
+    x: number;
+    y: number;
+};
+export declare function unTransformCoords(coords: Coords, cw: number, ch: number): {
+    x: number;
+    y: number;
+};
+export declare function getQuadraticCurvePoint(points: Coords[]): {
+    control?: undefined;
+    end?: undefined;
+} | {
+    control: Coords;
+    end: {
+        x: number;
+        y: number;
+    };
+};
+export declare function execInterval(i: number, time: number, callback?: typeof noop): void;
+export declare function nextFrame(fn: FrameRequestCallback, delay?: number): void;

package/libs/components/PaintBrush/utils.js

@@ -0,0 +1,51 @@
+export function noop() { }
+const promise = () => Promise.resolve();
+const state = {
+    __queue: Promise.resolve()
+};
+export function queue(promiseCallback = promise) {
+    state.__queue = state.__queue.then(promiseCallback).catch(promise);
+}
+export function transformCoords(coords, cw, ch) {
+    const _x = coords.x;
+    const _y = coords.y;
+    const x = Math.floor((_x / cw) * 10000) / 10000; // 保留四位小数
+    const y = Math.floor((_y / ch) * 10000) / 10000; // 保留四位小数
+    return { x, y };
+}
+export function unTransformCoords(coords, cw, ch) {
+    const { x: _x, y: _y } = coords;
+    const x = _x * cw;
+    const y = _y * ch;
+    return { x, y };
+}
+export function getQuadraticCurvePoint(points) {
+    if (points.length < 2)
+        return {};
+    const lastTwo = points.slice(-2);
+    const control = lastTwo[0];
+    const end = {
+        x: (lastTwo[0].x + lastTwo[1].x) / 2,
+        y: (lastTwo[0].y + lastTwo[1].y) / 2,
+    };
+    return { control, end };
+}
+export function execInterval(i, time, callback = noop) {
+    new Promise((resolve) => {
+        setTimeout(() => {
+            callback();
+            resolve(true);
+        }, time * i);
+    });
+}
+const _window = window;
+const _requestAnimationFrame = window.requestAnimationFrame ||
+    _window.webkitRequestAnimationFrame ||
+    (fn => setTimeout(fn, 16));
+const _cancelAnimationFrame = window.cancelAnimationFrame || _window.webkitCancelAnimationFrame || clearTimeout;
+export function nextFrame(fn, delay = 0) {
+    if (delay <= 0)
+        _requestAnimationFrame(fn);
+    else
+        _requestAnimationFrame(() => nextFrame(fn, delay - 1));
+}

package/libs/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './PaintBrush';
+export * from './PaintBrush/typings';

package/libs/components/index.js

@@ -0,0 +1,3 @@
+// 画笔组件
+export * from './PaintBrush';
+export * from './PaintBrush/typings';

package/libs/floorplan/Components/Compass.js

@@ -23,7 +23,7 @@ function add_css(target) {
 	append_styles(target, "svelte-5l80pv", ".floorplan-plugin__compass.svelte-5l80pv{position:absolute;left:50%;top:-46px;width:231px;height:41px;will-change:opacity;transform-origin:center 184px}.floorplan-plugin__compass-image.svelte-5l80pv{width:100%;height:100%;position:absolute;left:0;top:0;opacity:0.1;background-repeat:no-repeat;background-size:100% 100%}.floorplan-plugin__compass-text.svelte-5l80pv{position:absolute;left:50%;top:15px;transform:translateX(-50%);opacity:0.2;font-weight:bold;font-size:10px;color:#fff}");
 }
 
-// (13:0) {#if northRad}
+// (14:0) {#if canShowCompass}
 function create_if_block(ctx) {
 	let div1;
 	let div0;
@@ -42,7 +42,7 @@ function create_if_block(ctx) {
 			set_style(div0, "background-image", `url(${COMPASS_IMAGE})`);
 			attr(span, "class", "floorplan-plugin__compass-text svelte-5l80pv");
 			attr(div1, "class", "floorplan-plugin__compass svelte-5l80pv");
-			set_style(div1, "transform", /*compassTransformStyle*/ ctx[2], false);
+			set_style(div1, "transform", /*compassTransformStyle*/ ctx[1], false);
 		},
 		m(target, anchor) {
 			insert(target, div1, anchor);
@@ -62,7 +62,7 @@ function create_if_block(ctx) {
 
 function create_fragment(ctx) {
 	let if_block_anchor;
-	let if_block = /*northRad*/ ctx[1] && create_if_block(ctx);
+	let if_block = /*canShowCompass*/ ctx[2] && create_if_block(ctx);
 
 	return {
 		c() {
@@ -74,7 +74,7 @@ function create_fragment(ctx) {
 			insert(target, if_block_anchor, anchor);
 		},
 		p(ctx, [dirty]) {
-			if (/*northRad*/ ctx[1]) if_block.p(ctx, dirty);
+			if (/*canShowCompass*/ ctx[2]) if_block.p(ctx, dirty);
 		},
 		i: noop,
 		o: noop,
@@ -98,15 +98,16 @@ function instance($$self, $$props, $$invalidate) {
 	? void 0
 	: _a.northRad;
 
-	const rotate = !northRad ? 0 : rad2Deg(northRad);
+	const rotate = typeof northRad !== 'number' ? 0 : rad2Deg(northRad);
 	const compassTransformStyle = `translateX(-50%) translateZ(10px) rotate(${-rotate + 90}deg)`;
+	const canShowCompass = typeof northRad === 'number';
 
 	$$self.$$set = $$props => {
 		if ('floorplanData' in $$props) $$invalidate(3, floorplanData = $$props.floorplanData);
 		if ('northDesc' in $$props) $$invalidate(0, northDesc = $$props.northDesc);
 	};
 
-	return [northDesc, northRad, compassTransformStyle, floorplanData];
+	return [northDesc, compassTransformStyle, canShowCompass, floorplanData];
 }
 
 class Component extends SvelteComponent {

package/libs/shared-utils/uuid.d.ts

@@ -2,3 +2,4 @@
  * 随机生成一个uuid值
  */
 export default function uuid(): string;
+export { uuid };

package/libs/shared-utils/uuid.js

@@ -9,3 +9,4 @@ export default function uuid() {
     // then to call it, plus stitch in '4' in the third group
     return (S4() + S4() + '-' + S4() + '-4' + S4().substr(0, 3) + '-' + S4() + '-' + S4() + S4() + S4()).toLowerCase();
 }
+export { uuid };

package/package.json

@@ -8,12 +8,13 @@
   "repository": "https://github.com/realsee-developer/dnalogel.git",
   "description": "如视 VR 看房插件合集",
   "private": false,
-  "version": "2.0.0-alpha.32",
+  "version": "2.0.0-alpha.34",
   "license": "SEE LICENSE IN TERMS.txt",
   "scripts": {
-    "build": "yarn run tsb && yarn run build:rollup && yarn build:docs",
+    "build": "yarn run tsb && yarn run build:rollup && yarn run build:components && yarn build:docs",
     "build:dev": "yarn build:svelte && tsc --watch",
     "build:rollup": " rollup --config rollup.config.js",
+    "build:components": "vite build",
     "tsb": "tsc && yarn build:svelte && ./bin/svelte-compile.js",
     "build:svelte": "svelte-strip strip src/ libs -m=false",
     "build:docs": "typedoc --options ./typedoc.json",
@@ -23,6 +24,7 @@
   "files": [
     "libs",
     "dist",
+    "components",
     "docs",
     "TERMS.txt"
   ],