@netless/appliance-plugin 1.0.0-beta.0

package/dist/collector/base.d.ts

@@ -0,0 +1,20 @@
+import type { AppliancePluginLike } from "../plugin/types";
+import { IworkId } from "../core";
+export declare abstract class BaseCollector<T> {
+    plugin: AppliancePluginLike;
+    uid: string;
+    abstract serviceStorage: T;
+    abstract storage: T;
+    protected abstract namespace: string;
+    constructor(plugin: AppliancePluginLike);
+    getNamespaceData(): T;
+    getUidFromKey(key: string): string;
+    isLocalId(key: string): boolean;
+    getLocalId(key: string): string;
+    isSelector(key: string): boolean;
+    abstract transformKey(key: IworkId): string;
+    abstract isOwn(key: IworkId): boolean;
+    abstract dispatch(action: any): void;
+    abstract addStorageStateListener(callBack: (diff: any) => void): void;
+    abstract removeStorageStateListener(): void;
+}

package/dist/collector/collector.d.ts

@@ -0,0 +1,53 @@
+import { BaseCollectorReducerAction, Diff, ISerializableStorageData, ISerializableStorageViewData } from "./types";
+import { BaseCollector } from "./base";
+import type { AppliancePluginLike } from "../plugin/types";
+/**
+ * 服务端事件/状态同步收集器
+ */
+export declare class Collector extends BaseCollector<ISerializableStorageViewData> {
+    protected namespace: string;
+    static namespace: string;
+    static syncInterval: number;
+    serviceStorage: ISerializableStorageViewData;
+    storage: ISerializableStorageViewData;
+    private stateDisposer;
+    private asyncClockState;
+    constructor(plugin: AppliancePluginLike, syncInterval?: number);
+    getViewIdBySecenPath(scenePath: string): string | undefined;
+    getScenePathData(scenePath: string): ISerializableStorageData | undefined;
+    getStorageData(viewId: string, scenePath: string): ISerializableStorageData | undefined;
+    hasSelector(viewId: string, scenePath: string): boolean;
+    addStorageStateListener(callBack: (diff: Diff<ISerializableStorageData>) => void): void;
+    removeStorageStateListener(): void;
+    private diffFun;
+    private diffFunByscenePath;
+    private diffFunByKeys;
+    transformKey(workId: number | string): string;
+    isOwn(key: string): boolean;
+    dispatch(action: BaseCollectorReducerAction): void;
+    private checkOtherSelector;
+    setState(state: ISerializableStorageData, options: {
+        viewId: string;
+        scenePath: string;
+        isSync?: boolean;
+        isAfterUpdate?: boolean;
+    }): void;
+    updateValue(key: string, value: any, options: {
+        viewId: string;
+        scenePath: string;
+        isSync?: boolean;
+        isAfterUpdate?: boolean;
+    }): void;
+    private runSyncService;
+    private syncSerivice;
+    private syncViewData;
+    private syncScenePathData;
+    private syncUpdataView;
+    private syncStorageView;
+    private syncUpdataScenePath;
+    private syncStorageScenePath;
+    private syncUpdataKey;
+    private syncStorageKey;
+    keyTransformWorkId(key: string): string;
+    destroy(): void;
+}

package/dist/collector/const.d.ts

@@ -0,0 +1,3 @@
+export declare const Storage_Splitter = "++";
+export declare const Storage_Selector_key = "selector";
+export declare const Storage_ViewId_ALL = "all";

package/dist/collector/enum.d.ts

@@ -0,0 +1,13 @@
+/** 同步事件类型 */
+export declare enum EEventDataKey {
+    GetPoint = "getPoint"
+}
+/** 同步类型 */
+export declare enum SyncedType {
+    State = 0,
+    Event = 1
+}
+export declare enum EThreadType {
+    Main = 0,
+    Worker = 1
+}

package/dist/collector/eventCollector.d.ts

@@ -0,0 +1,29 @@
+import { BaseEventCollectorReducerAction, ISerializableEventData } from "./types";
+import { BaseCollector } from "./base";
+import type { AppliancePluginLike } from "../plugin/types";
+/**
+ * 服务端事件/状态同步收集器
+ */
+export declare class EventCollector extends BaseCollector<ISerializableEventData> {
+    static syncInterval: number;
+    static namespace: string;
+    serviceStorage: ISerializableEventData;
+    storage: ISerializableEventData;
+    private stateDisposer;
+    private asyncClockTimer?;
+    protected namespace: string;
+    constructor(plugin: AppliancePluginLike, syncInterval?: number);
+    addStorageStateListener(callBack: (event: Map<string, Array<BaseEventCollectorReducerAction | undefined>>) => void): void;
+    private getDiffMap;
+    removeStorageStateListener(): void;
+    transformKey(workId: number | string): string;
+    isOwn(key: string): boolean;
+    dispatch(action: BaseEventCollectorReducerAction): void;
+    pushValue(uid: string, value: BaseEventCollectorReducerAction | undefined, options?: {
+        isSync?: boolean;
+    }): void;
+    clearValue(uid: string): void;
+    private runSyncService;
+    private syncSerivice;
+    destroy(): void;
+}

package/dist/collector/index.d.ts

@@ -0,0 +1,4 @@
+export * from './const';
+export * from './base';
+export * from './collector';
+export * from './types';

package/dist/collector/types.d.ts

@@ -0,0 +1,70 @@
+import { EPostMessageType, EToolsKey, EventMessageType } from "../core/enum";
+import { ShapeOptions } from "../core/tools";
+import { IUpdateNodeOpt, IworkId } from "../core/types";
+import { EmitEventType } from "../plugin/types";
+import { EEventDataKey } from "./enum";
+export declare type DiffOne<T> = {
+    oldValue: T;
+    newValue: T;
+    viewId: string;
+    scenePath: string;
+};
+export declare type Diff<T> = {
+    [K in keyof T]?: DiffOne<T[K]>;
+};
+export type SyncEventData = {
+    [key in EEventDataKey]: {
+        workId?: number;
+        key: string;
+    };
+};
+export type IStorageValueItem = Partial<INormalPushMsg>;
+export interface INormalPushMsg {
+    workId?: IworkId;
+    toolsType?: EToolsKey;
+    opt?: ShapeOptions;
+    uid?: string;
+    taskId?: number;
+    namespace?: string;
+    op?: number[];
+    ops?: string;
+    index?: number;
+    w?: number;
+    h?: number;
+    type?: EPostMessageType;
+    removeIds?: Array<string>;
+    updateNodeOpt?: IUpdateNodeOpt;
+    selectIds?: Array<string>;
+    emitEventType?: EmitEventType;
+    /** 是否垂直同步 */
+    isSync?: boolean;
+    undoTickerId?: number;
+    viewId?: string;
+    scenePath?: string;
+    isActive?: string;
+}
+export interface INormalStorageData {
+    [key: string]: IStorageValueItem | undefined;
+}
+export type BaseCollectorReducerAction = INormalPushMsg & Pick<INormalPushMsg, 'type'>;
+export interface ISerializableStorageData {
+    [key: string]: BaseCollectorReducerAction | undefined;
+}
+export interface BaseEventCollectorReducerAction {
+    type?: EventMessageType;
+    uid?: string;
+    memberId?: number;
+    op?: Array<number | undefined>;
+    isHide?: boolean;
+    isSync?: boolean;
+    viewId?: string;
+}
+export interface ISerializableEventData {
+    [key: string]: Array<BaseEventCollectorReducerAction | undefined> | undefined;
+}
+export interface ISerializableStorageViewData {
+    [key: string]: ISerializableStoragescenePathData;
+}
+export interface ISerializableStoragescenePathData {
+    [key: string]: ISerializableStorageData;
+}

package/dist/collector/utils/color.d.ts

@@ -0,0 +1,31 @@
+/**
+ * RGB 颜色值转换为 HSL.
+ * 转换公式参考自 http://en.wikipedia.org/wiki/HSL_color_space.
+ * r, g, 和 b 需要在 [0, 255] 范围内
+ * 返回的 h, s, 和 l 在 [0, 1] 之间
+ *
+ * @param   Number  r       红色色值
+ * @param   Number  g       绿色色值
+ * @param   Number  b       蓝色色值
+ * @return  Array           HSL各值数组
+ */
+export declare function rgbToHsl(r: number, g: number, b: number): number[];
+/**
+ * HSL颜色值转换为RGB.
+ * 换算公式改编自 http://en.wikipedia.org/wiki/HSL_color_space.
+ * h, s, 和 l 设定在 [0, 1] 之间
+ * 返回的 r, g, 和 b 在 [0, 255]之间
+ *
+ * @param   Number  h       色相
+ * @param   Number  s       饱和度
+ * @param   Number  l       亮度
+ * @return  Array           RGB色值数值
+ */
+export declare function hslToRgb(h: number, s: number, l: number): number[];
+export declare function rgbToHex(r: number, g: number, b: number): string;
+/** 十六进制转rgba */
+export declare function hexToRgba(hex: string, opacity?: number): string;
+export declare function rgbToRgba(r: number, g: number, b: number, opacity?: number): string;
+export declare function colorRGBA2Hex(color: string): [string, number];
+export declare function colorRGBA2Array(color: string): [number, number, number, number];
+export declare function isTransparent(color: string): boolean;

package/dist/collector/utils/index.d.ts

@@ -0,0 +1,5 @@
+export declare function transformToNormalData(str: string): any;
+export declare function transformToSerializableData(data: unknown): string;
+export declare function normalDataToUint8Array(data: unknown): Uint8Array;
+export declare function uint8ArrayToNormalData(data: Uint8Array): unknown;
+export declare const plainObjectKeys: <T>(o: T) => Array<Extract<keyof T, string>>;

package/dist/component/textEditor/index.d.ts

@@ -0,0 +1,2 @@
+export * from './types';
+export * from './manager';

package/dist/component/textEditor/manager.d.ts

@@ -0,0 +1,120 @@
+import { TextEditorInfo, TextOptions } from "./types";
+import { BaseSubWorkModuleProps } from "../../plugin/types";
+import { ICameraOpt, IWorkerMessage } from "../../core";
+import type EventEmitter2 from "eventemitter2";
+import { BaseApplianceManager } from "../../plugin/baseApplianceManager";
+export interface TextEditorManager {
+    readonly internalMsgEmitter: EventEmitter2;
+    readonly control: BaseApplianceManager;
+    editors: Map<string, TextEditorInfo>;
+    activeId?: string;
+    undoTickerId?: number;
+    /** 通过view组建中更新文本 */
+    updateForViewEdited(activeId?: string, info?: TextEditorInfo): void;
+    /** 过滤文本编辑器 */
+    filterEditor(viewId: string): Map<string, TextEditorInfo>;
+    /** 通过点计算获焦的文本 */
+    computeTextActive(point: [number, number], viewId: string): void;
+    /** 校验是否删除空文本或事失焦 */
+    checkEmptyTextBlur(): void;
+    /** 激活文本编辑组件 */
+    active(workId: string): void;
+    /** 不激活文本编辑组件 */
+    unActive(): void;
+    /** 创建文本来源于main */
+    createTextForMasterController(params: TextEditorInfo & {
+        workId: string;
+        x: number;
+        y: number;
+        opt: TextOptions;
+        viewId: string;
+    }, undoTickerId?: number): void;
+    /** 修改文本来源于main */
+    updateTextForMasterController(params: Partial<TextEditorInfo> & {
+        workId: string;
+        viewId: string;
+        canWorker: boolean;
+        canSync: boolean;
+    }, undoTickerId?: number): void;
+    /** 修改文本来并等到新数据 */
+    updateTextControllerWithEffectAsync(params: Partial<TextEditorInfo> & {
+        workId: string;
+        viewId: string;
+        canWorker: boolean;
+        canSync: boolean;
+    }, undoTickerId?: number): Promise<TextEditorInfo | undefined>;
+    /** 修改文本来源于worker */
+    updateTextForWorker(params: Partial<TextEditorInfo> & {
+        workId: string;
+        viewId: string;
+        canWorker: boolean;
+        canSync: boolean;
+    }, undoTickerId?: number): void;
+    /** 编辑文本 */
+    /** 获取组建信息 */
+    get(workId: string): TextEditorInfo | undefined;
+    /** 删除组件 */
+    delete(workId: string, canSync?: boolean, canWorker?: boolean): void;
+    /** 批量删除组件 */
+    deleteBatch(workIds: string[], canSync?: boolean, canWorker?: boolean): void;
+    /** 清空指定view下文本 */
+    clear(viewId: string, justLocal?: boolean): void;
+    /** 销毁 */
+    destory(): void;
+    /** 监听服务端数据变动 */
+    onServiceDerive(data: IWorkerMessage): void;
+    /** 监听camera变化 */
+    onCameraChange(cameraOpt: ICameraOpt, viewId: string): void;
+}
+export declare class TextEditorManagerImpl implements TextEditorManager {
+    readonly internalMsgEmitter: EventEmitter2;
+    readonly control: BaseApplianceManager;
+    editors: Map<string, TextEditorInfo>;
+    activeId?: string;
+    undoTickerId?: number;
+    private proxyMap;
+    private taskqueue;
+    constructor(props: BaseSubWorkModuleProps);
+    get collector(): import("../../collector").Collector | undefined;
+    filterEditor(viewId: string): Map<string, TextEditorInfo>;
+    get interceptors(): {
+        set: (workId: string, info: TextEditorInfo) => true | undefined;
+        delete: (workId: string) => true | undefined;
+        clear(): boolean;
+    };
+    computeTextActive(point: [number, number], viewId: string): void;
+    checkEmptyTextBlur(): void;
+    onCameraChange(cameraOpt: ICameraOpt, viewId: string): void;
+    onServiceDerive(data: IWorkerMessage): void;
+    updateForViewEdited(activeId: string, info: TextEditorInfo): void;
+    active(workId: string): void;
+    unActive(): void;
+    createTextForMasterController(params: TextEditorInfo & {
+        workId: string;
+        viewId: string;
+    }, undoTickerId?: number): void;
+    updateTextForMasterController(params: Partial<TextEditorInfo> & {
+        workId: string;
+        viewId: string;
+        canWorker: boolean;
+        canSync: boolean;
+    }, undoTickerId?: number): void;
+    updateTextControllerWithEffectAsync(params: Partial<TextEditorInfo> & {
+        workId: string;
+        viewId: string;
+        canWorker: boolean;
+        canSync: boolean;
+    }, undoTickerId?: number): Promise<TextEditorInfo | undefined>;
+    updateTextForWorker(params: TextEditorInfo & {
+        workId: string;
+        viewId: string;
+        canWorker: boolean;
+        canSync: boolean;
+    }, undoTickerId?: number): void;
+    get(workId: string): TextEditorInfo | undefined;
+    delete(workId: string, canSync?: boolean, canWorker?: boolean): void;
+    deleteBatch(workIds: string[], canSync?: boolean | undefined, canWorker?: boolean | undefined): void;
+    clear(viewId: string, justLocal?: boolean): void;
+    destory(): void;
+    private getMaxZIndex;
+}

package/dist/component/textEditor/types.d.ts

@@ -0,0 +1,50 @@
+import { EDataType, EvevtWorkState } from "../../core";
+import { BaseShapeOptions } from "../../core/tools";
+export declare enum ETextEditorType {
+    Text = 1,
+    Shape = 2
+}
+export type VerticalAlignType = "top" | "middle" | "bottom";
+export type TextAlignType = "left" | "center" | "right";
+export type FontWeightType = 'bold' | 'normal';
+export type FontStyleType = 'italic' | 'normal';
+export interface TextOptions extends BaseShapeOptions {
+    fontColor: string;
+    fontSize: number;
+    text: string;
+    textAlign: TextAlignType;
+    verticalAlign: VerticalAlignType;
+    lineHeight?: number;
+    fontFamily?: string;
+    bold?: FontWeightType;
+    italic?: FontStyleType;
+    fontBgColor?: string;
+    /** 是否显示下划线 */
+    underline?: boolean;
+    /** 是否显示删除线 */
+    lineThrough?: boolean;
+    boxPoint?: [number, number];
+    boxSize?: [number, number];
+    /** 状态 */
+    workState?: EvevtWorkState;
+    /** 正在编辑的用户 */
+    uid?: string;
+}
+export type TextEditorInfo = {
+    x: number;
+    y: number;
+    opt: TextOptions;
+    type: ETextEditorType;
+    viewId: string;
+    scenePath: string;
+    w?: number;
+    h?: number;
+    scale?: number;
+    isSelect?: boolean;
+    isActive?: boolean;
+    canWorker?: boolean;
+    canSync?: boolean;
+    dataType?: EDataType;
+    translate?: [number, number];
+    justLocal?: boolean;
+};

package/dist/component/textEditor/utils.d.ts

@@ -0,0 +1,3 @@
+import { EToolsKey } from "../../core";
+import { ETextEditorType } from "./types";
+export declare function getTextEditorType(toolsKey: EToolsKey): ETextEditorType | undefined;

package/dist/component/textEditor/view.d.ts

@@ -0,0 +1,68 @@
+import React, { FocusEventHandler, KeyboardEventHandler } from "react";
+import { TextEditorInfo, TextOptions } from "./types";
+import { ApplianceViewManagerLike } from "../../plugin/types";
+export interface TextSelectorManagerProps {
+    selectIds: string[];
+    className?: string;
+    editors?: Map<string, TextEditorInfo>;
+    activeTextId?: string;
+    position?: {
+        x: number;
+        y: number;
+    };
+    textRef?: React.RefObject<HTMLDivElement>;
+    manager: ApplianceViewManagerLike;
+    showFloatBtns?: boolean;
+}
+export interface TextViewProps {
+    workId: string;
+    data: TextEditorInfo;
+    isSelect?: boolean;
+    isActive?: boolean;
+    manager: ApplianceViewManagerLike;
+}
+export interface TextSelectorViewProps extends TextViewProps {
+    position?: {
+        x: number;
+        y: number;
+    };
+    selectIds?: string[];
+    updateOptInfo: (param: {
+        activeTextId: string;
+        update: Partial<TextOptions>;
+        syncData?: Pick<TextEditorInfo, 'canSync' | 'canWorker'>;
+    }) => void;
+}
+export interface TextEditorProps extends TextViewProps {
+    showFloatBtns: boolean;
+    handleKeyUp: KeyboardEventHandler<HTMLDivElement>;
+    handleFocus: FocusEventHandler<HTMLDivElement>;
+    updateOptInfo: (param: {
+        activeTextId: string;
+        update: Partial<TextOptions>;
+        syncData?: Pick<TextEditorInfo, 'canSync' | 'canWorker'>;
+    }) => void;
+}
+export declare const TextView: (props: TextViewProps) => React.JSX.Element;
+export declare const TextSelectorView: React.MemoExoticComponent<(props: TextSelectorViewProps) => React.JSX.Element>;
+export declare const TextEditor: (props: TextEditorProps) => React.JSX.Element;
+export declare class TextViewInSelector extends React.Component<TextSelectorManagerProps, {
+    hasEditor: boolean;
+}> {
+    constructor(props: TextSelectorManagerProps);
+    getInnerText(target: HTMLDivElement): string[];
+    updateOptInfo(param: {
+        activeTextId: string;
+        update: Partial<TextOptions>;
+        syncData?: Pick<TextEditorInfo, 'canSync' | 'canWorker'>;
+    }): void;
+    get editorUI(): JSX.Element[] | null;
+    render(): React.JSX.Element;
+}
+export declare class TextEditorContainer extends TextViewInSelector {
+    constructor(props: TextSelectorManagerProps);
+    handleKeyUp(e: any): void;
+    handleFocus(e: any): void;
+    get editorUI(): JSX.Element[] | null;
+    render(): React.JSX.Element;
+}

package/dist/core/const.d.ts

@@ -0,0 +1 @@
+export declare const Cursor_Hover_Id = "cursorhover";

package/dist/core/enum.d.ts

@@ -0,0 +1,135 @@
+export declare enum EToolsKey {
+    /** 铅笔绘制工具 */
+    Pencil = 1,
+    /** 橡皮擦工具 */
+    Eraser = 2,
+    /** 选择工具 */
+    Selector = 3,
+    /** 点击互动工具 */
+    Clicker = 4,
+    /** 箭头工具 */
+    Arrow = 5,
+    /** 抓手工具 */
+    Hand = 6,
+    /** 激光铅笔绘制工具 */
+    LaserPen = 7,
+    /** 文字工具 */
+    Text = 8,
+    /** 直线工具 */
+    Straight = 9,
+    /** 矩形工具 */
+    Rectangle = 10,
+    /** 圆形工具 */
+    Ellipse = 11,
+    /** 星形工具 */
+    Star = 12,
+    /** 三角形工具 */
+    Triangle = 13,
+    /** 菱形工具 */
+    Rhombus = 14,
+    /** 多边形工具 */
+    Polygon = 15,
+    /** 聊天泡泡框 */
+    SpeechBalloon = 16,
+    /** 图片 */
+    Image = 17
+}
+export declare enum EDataType {
+    /** 本地数据 */
+    Local = 1,
+    /** 服务端数据 */
+    Service = 2,
+    /** 来源于worker */
+    Worker = 3
+}
+export declare enum EvevtWorkState {
+    Pending = 0,
+    Start = 1,
+    Doing = 2,
+    Done = 3,
+    /** 冻结,不能本地输入事件,camera、clear等任务还是可以执行 */
+    Freeze = 4,
+    /** 只读状态 */
+    Unwritable = 5
+}
+/**
+ * 消息变化顺序: init => Scene事件 => work事件 => node事件
+ * 本地数据: Init、Transform、UpdateTools
+ * 服务端数据:
+ */
+export declare enum EPostMessageType {
+    /** 什么也不需要做 */
+    None = 0,
+    /** 初始化,仅用于本地 */
+    Init = 1,
+    /** 本地视口切换,仅用于本地 */
+    UpdateCamera = 2,
+    /** 更新tool配置数据,仅用于本地 */
+    UpdateTools = 3,
+    /** 创建一次work */
+    CreateWork = 4,
+    /** 绘制当次work（高频） */
+    DrawWork = 5,
+    /** 完成完整的一次work */
+    FullWork = 6,
+    /** 更新已有node */
+    UpdateNode = 7,
+    /** 删除node */
+    RemoveNode = 8,
+    /** 清空 */
+    Clear = 9,
+    /** 选中 */
+    Select = 10,
+    /** 销毁 */
+    Destroy = 11,
+    /** 获取指定场景快照 */
+    Snapshot = 12,
+    /** 获取指定场所有元素的的包围盒 */
+    BoundingBox = 13,
+    /** 指针事件 */
+    Cursor = 14,
+    /** 更新文本 */
+    TextUpdate = 15,
+    /** 获取获奖的文本信息 */
+    GetTextActive = 16,
+    /** 批量队列化处理 */
+    TasksQueue = 17,
+    /** 指针hover元素事件 */
+    CursorHover = 18
+}
+export declare enum ECanvasContextType {
+    Webgl2 = "webgl2",
+    Webgl = "webgl",
+    Canvas2d = "2d"
+}
+export declare enum ECanvasShowType {
+    /** 本地前置画布 */
+    Float = 1,
+    /** 背景画布 */
+    Bg = 2,
+    /** 选择框中的画布 */
+    Selector = 3,
+    /** 服务端前置画布 */
+    ServiceFloat = 4,
+    None = 5
+}
+export declare enum EventMessageType {
+    /** cursor事件 */
+    Cursor = 1,
+    /** 创建text编辑器 */
+    TextCreate = 2
+}
+export declare enum ElayerType {
+    Top = 1,
+    Bottom = 2
+}
+export declare enum EScaleType {
+    /** 不可以拉伸 */
+    none = 1,
+    /** 八个方向都可以拉伸 */
+    all = 2,
+    /** 两个方向拉伸 */
+    both = 3,
+    /** 等比例 */
+    proportional = 4
+}

package/dist/core/index.d.ts

@@ -0,0 +1,3 @@
+export * from './enum';
+export * from './types';
+export * from './const';