graphic-pixi/lib/index.js

import { Graphics, Container, Text, Point, Matrix, Color, Polygon, DisplayObject, Rectangle, Application, BitmapFont, BitmapText } from 'pixi.js';
import EventEmitter from 'eventemitter3';
import { Viewport } from 'pixi-viewport';
import { Client } from '@stomp/stompjs';
import mqtt from 'mqtt';

/**
 * ID生成器
 */
class IdGenerator {
    constructor(type) {
        Object.defineProperty(this, "serial", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 0
        });
        Object.defineProperty(this, "type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.type = type;
    }
    next() {
        ++this.serial;
        return this.getType() + this.serial;
    }
    getType() {
        return this.type;
    }
    initSerial(serial) {
        this.serial = serial;
    }
}
const GraphicIdGenerator = new IdGenerator('');

/**
 * 图形动画管理
 */
class AnimationManager {
    constructor(app) {
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "_pause", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * key - graphic.id
         */
        Object.defineProperty(this, "graphicAnimationMap", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.app = app;
        this._pause = false;
        this.graphicAnimationMap = new Map();
        // 动画控制
        app.pixi.ticker.add(this.run, this);
    }
    run(dt) {
        if (this._pause) {
            // 暂停
            return;
        }
        this.graphicAnimationMap.forEach((map) => {
            map.forEach((animation) => {
                if (animation.running) {
                    animation.run(dt);
                }
            });
        });
    }
    pause() {
        this._pause = true;
    }
    resume() {
        this._pause = false;
    }
    destroy() {
        this.app.pixi.ticker.remove(this.run, this);
    }
    /**
     * 图形对象的所有动画map
     * @param graphic
     * @returns
     */
    animationMap(graphic) {
        let map = this.graphicAnimationMap.get(graphic.id);
        if (!map) {
            map = new Map();
            this.graphicAnimationMap.set(graphic.id, map);
        }
        return map;
    }
    /**
     * 注册图形动画
     * @param graphic
     * @param animation
     */
    registerAnimation(graphic, animation) {
        this.animationMap(graphic).set(animation.name, animation);
    }
    /**
     * 删除图形动画
     * @param graphic
     * @param name
     */
    unregisterAnimation(graphic, name) {
        this.animationMap(graphic).delete(name);
    }
    /**
     * 删除所有图形动画
     * @param graphic
     */
    unregisterGraphicAnimations(graphic) {
        this.animationMap(graphic).clear();
    }
    /**
     * 获取图形指定名称动画
     * @param graphic
     * @param name
     * @returns
     */
    animation(graphic, name) {
        return this.animationMap(graphic).get(name);
    }
}

var InteractionPluginType;
(function (InteractionPluginType) {
    InteractionPluginType["App"] = "app";
    InteractionPluginType["Graphic"] = "graphic";
    InteractionPluginType["Other"] = "other";
})(InteractionPluginType || (InteractionPluginType = {}));
class InteractionPluginBase {
    constructor(app, name, type) {
        Object.defineProperty(this, "_type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "name", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 唯一标识
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "_pause", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this._type = type;
        this.app = app;
        this.name = name;
        this._pause = true;
        app.registerInteractionPlugin(this);
    }
    /**
     * 恢复
     */
    resume() {
        this.bind();
        this._pause = false;
        this.app.emit('interaction-plugin-resume', this);
    }
    /**
     * 停止
     */
    pause() {
        this.unbind();
        this._pause = true;
        this.app.emit('interaction-plugin-pause', this);
    }
    /**
     * 是否生效
     */
    isActive() {
        return !this._pause;
    }
    isGraphicPlugin() {
        return this._type === InteractionPluginType.Graphic;
    }
    isAppPlugin() {
        return this._type === InteractionPluginType.App;
    }
    isOtherPlugin() {
        return this._type === InteractionPluginType.Other;
    }
}
class OtherInteractionPlugin extends InteractionPluginBase {
    constructor(app, name) {
        super(app, name, InteractionPluginType.Other);
    }
}
class AppDragEvent {
    constructor(app, type, target, original, start) {
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "target", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "original", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "start", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 画布坐标
        this.app = app;
        this.type = type;
        this.target = target;
        this.original = original;
        this.start = start;
    }
    get isMouse() {
        return this.original.pointerType === 'mouse';
    }
    get isLeftButton() {
        return (this.isMouse &&
            ((this.original.button === -1 && this.original.buttons === 1) ||
                (this.original.button === 0 && this.original.buttons === 0)));
    }
    get isRightButton() {
        return (this.isMouse &&
            ((this.original.button === -1 && this.original.buttons === 2) ||
                (this.original.button === 2 && this.original.buttons === 0)));
    }
    get isMiddleButton() {
        return (this.isMouse &&
            ((this.original.button === -1 && this.original.buttons === 4) ||
                (this.original.button === 1 && this.original.buttons === 0)));
    }
    get isTouch() {
        return this.original.pointerType === 'touch';
    }
    /**
     * 终点坐标(画布坐标)
     */
    get end() {
        return this.app.toCanvasCoordinates(this.original.global);
    }
    get dx() {
        const move = this.original.movement;
        return move.x / this.app.viewport.scaled;
    }
    get dy() {
        const move = this.original.movement;
        return move.y / this.app.viewport.scaled;
    }
    get dsx() {
        return this.end.x - this.start.x;
    }
    get dsy() {
        return this.end.y - this.start.y;
    }
    /**
     * 转换为目标对象的位移距离
     */
    toTargetShiftLen(target) {
        const sl = target.canvasToLocalPoint(this.start);
        const el = target.canvasToLocalPoint(this.end);
        return { dx: el.x - sl.x, dy: el.y - sl.y };
    }
}
/**
 * 拖拽操作插件
 */
class DragPlugin extends OtherInteractionPlugin {
    constructor(app) {
        super(app, DragPlugin.Name);
        Object.defineProperty(this, "threshold", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 3
        });
        Object.defineProperty(this, "target", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: null
        });
        Object.defineProperty(this, "start", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: null
        });
        Object.defineProperty(this, "startClientPoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: null
        });
        Object.defineProperty(this, "drag", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        app.on('options-update', (options) => {
            if (options.threshold !== undefined) {
                this.threshold = options.threshold;
            }
        });
    }
    static new(app) {
        return new DragPlugin(app);
    }
    bind() {
        const canvas = this.app.canvas;
        canvas.on('pointerdown', this.onPointerDown, this);
    }
    unbind() {
        const canvas = this.app.canvas;
        canvas.off('pointerdown', this.onPointerDown, this);
        canvas.off('pointerup', this.onPointerUp, this);
        canvas.off('pointerupoutside', this.onPointerUp, this);
    }
    onPointerDown(e) {
        this.target = e.target;
        this.start = this.app.toCanvasCoordinates(e.global);
        this.startClientPoint = e.global.clone();
        const canvas = this.app.canvas;
        canvas.on('pointermove', this.onPointerMove, this);
        canvas.on('pointerup', this.onPointerUp, this);
        canvas.on('pointerupoutside', this.onPointerUp, this);
    }
    onPointerMove(e) {
        if (this.start && this.startClientPoint) {
            const current = e.global;
            const sgp = this.startClientPoint;
            const dragStart = Math.abs(current.x - sgp.x) > this.threshold ||
                Math.abs(current.y - sgp.y) > this.threshold;
            if (this.target && this.start && !this.drag && dragStart) {
                this.app.emit('drag_op_start', new AppDragEvent(this.app, 'start', this.target, e, this.start));
                this.drag = true;
            }
            // drag移动处理
            if (this.target && this.drag && this.start) {
                this.app.emit('drag_op_move', new AppDragEvent(this.app, 'move', this.target, e, this.start));
            }
        }
    }
    onPointerUp(e) {
        if (this.target && this.drag && this.start) {
            this.app.emit('drag_op_end', new AppDragEvent(this.app, 'end', this.target, e, this.start));
        }
        else if (this.target && this.start && !this.drag) {
            // this.target.emit('click', this.target);
            const ade = new AppDragEvent(this.app, 'end', this.target, e, this.start);
            const graphic = this.target.getGraphic();
            if (ade.isRightButton) {
                this.target.emit('_rightclick', e);
                if (graphic != null) {
                    graphic.emit('_rightclick', e);
                }
            }
            else if (ade.isLeftButton) {
                this.target.emit('_leftclick', e);
                if (graphic != null) {
                    graphic.emit('_leftclick', e);
                }
            }
        }
        const canvas = this.app.canvas;
        canvas.off('mousemove', this.onPointerMove, this);
        canvas.off('mouseup', this.onPointerUp, this);
        canvas.off('mouseupoutside', this.onPointerUp, this);
        this.clearCache();
    }
    /**
     * 清理缓存
     */
    clearCache() {
        this.drag = false;
        this.start = null;
        this.startClientPoint = null;
        this.target = null;
    }
}
Object.defineProperty(DragPlugin, "Name", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: '__drag_operation_plugin'
});
/**
 * 视口移动插件
 */
class ViewportMovePlugin extends OtherInteractionPlugin {
    constructor(app) {
        super(app, ViewportMovePlugin.Name);
        Object.defineProperty(this, "moveHandler", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: null
        });
        Object.defineProperty(this, "moveSpeedx", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 0
        });
        Object.defineProperty(this, "moveSpeedy", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 0
        });
    }
    static new(app) {
        return new ViewportMovePlugin(app);
    }
    pause() {
        super.pause();
        this.stopMove();
    }
    bind() {
        this.app.canvas.on('pointermove', this.viewportMove, this);
    }
    unbind() {
        this.app.canvas.off('pointermove', this.viewportMove, this);
    }
    startMove(moveSpeedx, moveSpeedy) {
        this.moveSpeedx = moveSpeedx;
        this.moveSpeedy = moveSpeedy;
        if (this.moveHandler == null) {
            const viewport = this.app.viewport;
            this.moveHandler = setInterval(() => {
                viewport.moveCorner(viewport.corner.x + this.moveSpeedx, viewport.corner.y + this.moveSpeedy);
            }, ViewportMovePlugin.MoveInterval);
        }
    }
    stopMove() {
        if (this.moveHandler != null) {
            clearInterval(this.moveHandler);
            this.moveHandler = null;
            this.app.canvas.cursor = 'auto';
        }
    }
    calculateBoundaryMoveSpeed(sp) {
        let moveSpeedx = 0;
        let moveSpeedy = 0;
        const range = ViewportMovePlugin.TriggerRange;
        const viewport = this.app.viewport;
        if (sp.x < range) {
            moveSpeedx = this.calculateMoveSpeed(sp.x - range);
        }
        else if (sp.x > viewport.screenWidth - range) {
            moveSpeedx = this.calculateMoveSpeed(sp.x + range - viewport.screenWidth);
        }
        else {
            moveSpeedx = 0;
        }
        if (sp.y < range) {
            moveSpeedy = this.calculateMoveSpeed(sp.y - range);
        }
        else if (sp.y > viewport.screenHeight - range) {
            moveSpeedy = this.calculateMoveSpeed(sp.y + range - viewport.screenHeight);
        }
        else {
            moveSpeedy = 0;
        }
        return { moveSpeedx, moveSpeedy };
    }
    calculateMoveSpeed(dd) {
        return ((dd / ViewportMovePlugin.TriggerRange) *
            ViewportMovePlugin.DefaultMoveSpeed);
    }
    viewportMove(e) {
        const sp = e.global;
        const { moveSpeedx, moveSpeedy } = this.calculateBoundaryMoveSpeed(sp);
        if (moveSpeedx == 0 && moveSpeedy == 0) {
            this.app.canvas.cursor = 'auto';
            this.stopMove();
        }
        else {
            this.app.canvas.cursor = 'grab';
            this.startMove(moveSpeedx, moveSpeedy);
        }
    }
}
Object.defineProperty(ViewportMovePlugin, "Name", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: '__viewport_move_plugin'
});
Object.defineProperty(ViewportMovePlugin, "MoveInterval", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 20
}); // 移动间隔，单位ms
Object.defineProperty(ViewportMovePlugin, "TriggerRange", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 100
}); // 边界触发范围,单位px
Object.defineProperty(ViewportMovePlugin, "DefaultMoveSpeed", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 200 / ViewportMovePlugin.MoveInterval
}); // 默认移动速度
/**
 * 应用交互插件，同时只能生效一个
 */
class AppInteractionPlugin extends InteractionPluginBase {
    constructor(name, app) {
        super(app, name, InteractionPluginType.App);
    }
    /**
     * 恢复，app交互插件同时只能生效一个
     */
    resume() {
        this.app.pauseAppInteractionPlugins();
        super.resume();
    }
}
/**
 * 图形交互插件,可同时生效
 */
class GraphicInteractionPlugin {
    constructor(name, app) {
        Object.defineProperty(this, "_type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: InteractionPluginType.Graphic
        });
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "name", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 唯一标识
        Object.defineProperty(this, "_pause", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.app = app;
        this.name = name;
        this._pause = true;
        app.registerInteractionPlugin(this);
        this.resume();
        // 新增的图形对象绑定
        this.app.on('graphicstored', (g) => {
            if (this.isActive()) {
                this.binds(this.filter(g));
            }
        });
        this.app.on('graphicdeleted', (g) => {
            if (this.isActive()) {
                this.unbinds(this.filter(g));
            }
        });
    }
    isActive() {
        return !this._pause;
    }
    isAppPlugin() {
        return false;
    }
    isOtherPlugin() {
        return false;
    }
    isGraphicPlugin() {
        return true;
    }
    resume() {
        const list = this.filter(...this.app.queryStore.getAllGraphics());
        this.binds(list);
        this._pause = false;
        this.app.emit('interaction-plugin-resume', this);
    }
    pause() {
        const list = this.filter(...this.app.queryStore.getAllGraphics());
        this.unbinds(list);
        this._pause = true;
        this.app.emit('interaction-plugin-pause', this);
    }
    binds(list) {
        if (list) {
            list.forEach((g) => this.bind(g));
        }
    }
    unbinds(list) {
        if (list) {
            list.forEach((g) => this.unbind(g));
        }
    }
}

class CompleteMouseToolOptions {
    constructor() {
        Object.defineProperty(this, "boxSelect", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "viewportDrag", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "viewportDragLeft", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "wheelZoom", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "selectFilter", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.boxSelect = true;
        this.viewportDrag = true;
        this.wheelZoom = true;
        this.viewportDragLeft = false;
    }
    update(options) {
        if (options.boxSelect != undefined) {
            this.boxSelect = options.boxSelect;
        }
        if (options.viewportDrag != undefined) {
            this.viewportDrag = options.viewportDrag;
        }
        if (options.viewportDragLeft != undefined) {
            this.viewportDragLeft = options.viewportDragLeft;
        }
        if (options.wheelZoom != undefined) {
            this.wheelZoom = options.wheelZoom;
        }
        this.selectFilter = options.selectFilter;
    }
}
/**
 * 通用交互工具
 */
class CommonMouseTool extends AppInteractionPlugin {
    constructor(scene) {
        super(CommonMouseTool.Name, scene);
        Object.defineProperty(this, "options", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "box", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "leftDownTarget", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: null
        });
        Object.defineProperty(this, "drag", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        Object.defineProperty(this, "graphicSelect", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        Object.defineProperty(this, "rightTarget", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: null
        });
        this.options = new CompleteMouseToolOptions();
        this.box = new Graphics();
        this.box.name = CommonMouseTool.SelectBox;
        this.box.visible = false;
        this.app.canvas.addAssistantAppends(this.box);
        scene.on('options-update', (options) => {
            if (options.mouseToolOptions) {
                this.options.update(options.mouseToolOptions);
                if (this.isActive()) {
                    this.pause();
                    this.resume();
                }
            }
        });
    }
    static new(app) {
        return new CommonMouseTool(app);
    }
    bind() {
        const canvas = this.app.canvas;
        canvas.on('mousedown', this.onMouseDown, this);
        canvas.on('mouseup', this.onMouseUp, this);
        this.app.on('drag_op_start', this.onDragStart, this);
        this.app.on('drag_op_move', this.onDragMove, this);
        this.app.on('drag_op_end', this.onDragEnd, this);
        if (this.options.viewportDrag) {
            if (this.options.viewportDragLeft) {
                this.app.viewport.drag({
                    mouseButtons: 'left',
                });
                canvas.on('mousedown', this.setLeftCursor, this);
                canvas.on('mouseup', this.resumeLeftCursor, this);
                canvas.on('mouseupoutside', this.resumeLeftCursor, this);
            }
            else {
                this.app.viewport.drag({
                    mouseButtons: 'right',
                });
                canvas.on('rightdown', this.setCursor, this);
                canvas.on('rightup', this.resumeCursor, this);
                canvas.on('rightupoutside', this.resumeCursor, this);
            }
        }
        if (this.options.wheelZoom) {
            this.app.viewport.wheel({
                percent: 0.01,
            });
        }
    }
    unbind() {
        const canvas = this.app.canvas;
        // 确保所有事件取消监听
        canvas.off('mousedown', this.onMouseDown, this);
        canvas.off('mouseup', this.onMouseUp, this);
        this.app.off('drag_op_start', this.onDragStart, this);
        this.app.off('drag_op_move', this.onDragMove, this);
        this.app.off('drag_op_end', this.onDragEnd, this);
        this.app.viewport.plugins.remove('drag');
        canvas.off('mousedown', this.setLeftCursor, this);
        canvas.off('mouseup', this.resumeLeftCursor, this);
        canvas.off('mouseupoutside', this.resumeLeftCursor, this);
        canvas.off('rightdown', this.setCursor, this);
        canvas.off('rightup', this.resumeCursor, this);
        canvas.off('rightupoutside', this.resumeCursor, this);
        this.app.viewport.plugins.remove('wheel');
        this.clearCache();
    }
    onDragStart(event) {
        if (this.boxSelect && event.target.isCanvas() && event.isLeftButton) {
            this.box.visible = true;
            this.app.interactionPlugin(ViewportMovePlugin.Name).resume();
        }
        this.drag = true;
    }
    onDragMove(event) {
        if (this.boxSelect && event.target.isCanvas()) {
            this.boxSelectDraw(event.start, event.end);
        }
    }
    onDragEnd(event) {
        if (this.boxSelect && event.target.isCanvas() && event.isLeftButton) {
            this.boxSelectDraw(event.start, event.end);
            this.boxSelectGraphicCheck();
            this.app.interactionPlugin(ViewportMovePlugin.Name).pause();
            this.box.clear();
            this.box.visible = false;
        }
    }
    setLeftCursor(e) {
        const target = e.target;
        this.leftDownTarget = target;
        if (target.isCanvas() && this.app.pixi.view.style) {
            this.app.pixi.view.style.cursor = 'grab';
        }
    }
    resumeLeftCursor() {
        if (this.leftDownTarget &&
            this.leftDownTarget.isCanvas() &&
            this.app.pixi.view.style) {
            this.app.pixi.view.style.cursor = 'inherit';
        }
        this.leftDownTarget = null;
    }
    setCursor(e) {
        const target = e.target;
        this.rightTarget = target;
        if (target.isCanvas() && this.app.pixi.view.style) {
            this.app.pixi.view.style.cursor = 'grab';
        }
    }
    resumeCursor() {
        if (this.rightTarget &&
            this.rightTarget.isCanvas() &&
            this.app.pixi.view.style) {
            this.app.pixi.view.style.cursor = 'inherit';
        }
        this.rightTarget = null;
    }
    onMouseDown(e) {
        this.leftDownTarget = e.target;
        this.graphicSelect = false;
        // 图形
        const graphic = this.leftDownTarget.getGraphic();
        if (graphic) {
            const app = this.app;
            // 图形选中
            if (!e.ctrlKey && !graphic.selected && graphic.selectable) {
                app.updateSelected(graphic);
                graphic.childEdit = false;
                this.graphicSelect = true;
            }
            else if (!e.ctrlKey && graphic.selected && graphic.childEdit) {
                if (this.leftDownTarget.isGraphicChild() &&
                    this.leftDownTarget.selectable) {
                    graphic.setChildSelected(this.leftDownTarget);
                }
                else {
                    graphic.exitChildEdit();
                }
            }
        }
    }
    /**
     * 选中处理
     * @param e
     */
    onMouseUp(e) {
        const app = this.app;
        if (!this.drag) {
            const target = e.target;
            const graphic = e.target.getGraphic();
            if (graphic &&
                graphic.selected &&
                !this.graphicSelect &&
                app.selectedGraphics.length == 1 &&
                target === this.leftDownTarget &&
                target.isGraphicChild() &&
                target.selectable) {
                graphic.childEdit = true;
            }
            if (e.ctrlKey) {
                // 多选
                if (graphic) {
                    if (graphic.childEdit && target === this.leftDownTarget) {
                        graphic.invertChildSelected(target);
                    }
                    else {
                        graphic.invertSelected();
                    }
                }
            }
            else {
                // 非多选
                if (e.target.isCanvas()) {
                    this.app.updateSelected();
                }
                else {
                    if (graphic &&
                        graphic.childEdit &&
                        app.selectedGraphics.length === 1 &&
                        target === this.leftDownTarget) {
                        graphic.setChildSelected(target);
                    }
                }
            }
            // 多个图形选中，退出子元素编辑模式
            const selecteds = this.app.selectedGraphics;
            if (selecteds.length > 1) {
                selecteds.forEach((g) => g.exitChildEdit());
            }
        }
        this.clearCache();
    }
    /**
     * 清理缓存
     */
    clearCache() {
        this.drag = false;
        this.leftDownTarget = null;
    }
    get boxSelect() {
        return this.options.boxSelect;
    }
    get selectFilter() {
        return this.options.selectFilter;
    }
    /**
     * 框选图形绘制并检查
     */
    boxSelectDraw(start, end) {
        if (!this.drag)
            return;
        // 绘制框选矩形框
        this.box.clear();
        this.box.lineStyle({
            width: 2,
            color: this.app.appOptions.assistantElementColor ||
                AppConsts.assistantElementColor,
        });
        const dsx = end.x - start.x;
        const dsy = end.y - start.y;
        let { x, y } = start;
        if (dsx < 0) {
            x += dsx;
        }
        if (dsy < 0) {
            y += dsy;
        }
        const width = Math.abs(dsx);
        const height = Math.abs(dsy);
        this.box.drawRect(x, y, width, height);
    }
    /**
     * 框选图形判断
     * @returns
     */
    boxSelectGraphicCheck() {
        if (!this.drag)
            return;
        // 遍历筛选
        const boxRect = this.box.getLocalBounds();
        const app = this.app;
        const selects = [];
        app.queryStore.getAllGraphics().forEach((g) => {
            if ((this.selectFilter == undefined && g.visible) ||
                (!!this.selectFilter && this.selectFilter(g))) {
                // 选择过滤器
                if (g.boxIntersectCheck(boxRect)) {
                    selects.push(g);
                }
            }
        });
        app.updateSelected(...selects);
    }
}
Object.defineProperty(CommonMouseTool, "Name", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'mouse-tool'
});
Object.defineProperty(CommonMouseTool, "SelectBox", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: '__select_box'
});

let target;
class GlobalKeyboardHelper {
    constructor() {
        Object.defineProperty(this, "appKeyboardPluginMap", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
        window.onkeydown = (e) => {
            this.appKeyboardPluginMap.forEach((plugin) => {
                const listenerMap = plugin.getKeyListener(e);
                listenerMap === null || listenerMap === void 0 ? void 0 : listenerMap.forEach((listener) => {
                    if (listener.global) {
                        listener.press(e, plugin.app);
                    }
                });
            });
            if (e.ctrlKey) {
                if (e.code == 'KeyS') {
                    // 屏蔽全局Ctrl+S保存操作
                    return false;
                }
            }
            if (target && target.nodeName == 'CANVAS') {
                // 事件的目标是画布时，屏蔽总的键盘操作操作
                if (e.ctrlKey) {
                    if (e.code == 'KeyA' || e.code == 'KeyS') {
                        // 屏蔽Canvas上的Ctrl+A、Ctrl+S操作
                        return false;
                    }
                }
            }
            return true;
        };
        window.onkeyup = (e) => {
            this.appKeyboardPluginMap.forEach((plugin) => {
                const listenerMap = plugin.getKeyListener(e);
                listenerMap === null || listenerMap === void 0 ? void 0 : listenerMap.forEach((listener) => {
                    if (listener.global) {
                        listener.release(e, plugin.app);
                    }
                });
            });
        };
    }
    registerGAKPlugin(plugin) {
        if (!this.appKeyboardPluginMap.find((pg) => pg == plugin)) {
            this.appKeyboardPluginMap.push(plugin);
        }
    }
    removeGAKPlugin(plugin) {
        const index = this.appKeyboardPluginMap.findIndex((pg) => pg == plugin);
        if (index >= 0) {
            this.appKeyboardPluginMap.splice(index, 1);
        }
    }
}
const GlobalKeyboardPlugin = new GlobalKeyboardHelper();
class JlGraphicAppKeyboardPlugin {
    constructor(app) {
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 结构为Map<key.code|key.key|key.keyCode, Map<KeyListener.identifier, KeyListener>>
         */
        Object.defineProperty(this, "keyListenerMap", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Map()
        }); // 键值监听map
        Object.defineProperty(this, "keyListenerStackMap", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Map()
        }); // 键值监听栈(多次注册相同的监听会把之前注册的监听器入栈，移除最新的监听会从栈中弹出一个作为指定事件监听处理器)
        this.app = app;
        GlobalKeyboardPlugin.registerGAKPlugin(this);
        const onMouseUpdateTarget = (e) => {
            const node = e.target;
            target = node;
        };
        const keydownHandle = (e) => {
            var _a;
            // console.debug(e.key, e.code, e.keyCode);
            if (target && target == ((_a = this.app.dom) === null || _a === void 0 ? void 0 : _a.getElementsByTagName('canvas')[0])) {
                const listenerMap = this.getKeyListener(e);
                listenerMap === null || listenerMap === void 0 ? void 0 : listenerMap.forEach((listener) => {
                    if (!listener.global) {
                        listener.press(e, this.app);
                    }
                });
            }
        };
        const keyupHandle = (e) => {
            var _a;
            if (target && target == ((_a = this.app.dom) === null || _a === void 0 ? void 0 : _a.getElementsByTagName('canvas')[0])) {
                const listenerMap = this.getKeyListener(e);
                listenerMap === null || listenerMap === void 0 ? void 0 : listenerMap.forEach((listener) => {
                    if (!listener.global) {
                        listener.release(e, this.app);
                    }
                });
            }
        };
        document.addEventListener('mousedown', onMouseUpdateTarget, false);
        document.addEventListener('keydown', keydownHandle, false);
        document.addEventListener('keyup', keyupHandle, false);
        this.app.on('destroy', () => {
            document.removeEventListener('mousedown', onMouseUpdateTarget, false);
            document.removeEventListener('keydown', keydownHandle, false);
            document.removeEventListener('keyup', keyupHandle, false);
            GlobalKeyboardPlugin.removeGAKPlugin(this);
        });
    }
    getOrInit(key) {
        let map = this.keyListenerMap.get(key);
        if (map === undefined) {
            map = new Map();
            this.keyListenerMap.set(key, map);
        }
        return map;
    }
    getOrInitStack(key) {
        let stack = this.keyListenerStackMap.get(key);
        if (stack === undefined) {
            stack = [];
            this.keyListenerStackMap.set(key, stack);
        }
        return stack;
    }
    /**
     * 注册按键监听，若有旧的，旧的入栈
     * @param keyListener
     */
    addKeyListener(keyListener) {
        const map = this.getOrInit(keyListener.value);
        // 查询是否有旧的监听，若有入栈
        const old = map.get(keyListener.identifier);
        if (old) {
            const stack = this.getOrInitStack(keyListener.identifier);
            stack.push(old);
        }
        map.set(keyListener.identifier, keyListener);
    }
    /**
     * 移除按键监听，若是当前注册的监听，尝试从栈中取出作为按键监听器，若是旧的，则同时移除栈中的监听
     * @param keyListener
     */
    removeKeyListener(keyListener) {
        keyListener.onRemove();
        const map = this.getOrInit(keyListener.value);
        const old = map.get(keyListener.identifier);
        map.delete(keyListener.identifier);
        const stack = this.getOrInitStack(keyListener.identifier);
        if (old && old === keyListener) {
            // 是旧的监听
            const listener = stack.pop();
            if (listener) {
                map.set(keyListener.identifier, listener);
            }
        }
        else {
            // 移除栈中的
            const index = stack.findIndex((ls) => ls === keyListener);
            if (index >= 0) {
                stack.splice(index, 1);
            }
        }
    }
    getKeyListenerBy(key) {
        return this.keyListenerMap.get(key);
    }
    getKeyListener(e) {
        return (this.getKeyListenerBy(e.key) ||
            this.getKeyListenerBy(e.code) ||
            this.getKeyListenerBy(e.keyCode));
    }
    isKeyListened(key) {
        return this.getOrInit(key).size > 0;
    }
    /**
     * 获取所有注册监听的键值（组合键）
     */
    getAllListenedKeys() {
        const keys = [];
        this.keyListenerMap.forEach((v) => v.forEach((_listener, ck) => keys.push(ck)));
        return keys;
    }
}
var CombinationKey;
(function (CombinationKey) {
    CombinationKey["Ctrl"] = "Ctrl";
    CombinationKey["Alt"] = "Alt";
    CombinationKey["Shift"] = "Shift";
})(CombinationKey || (CombinationKey = {}));
const DefaultKeyListenerOptions = {
    value: '',
    combinations: [],
    global: false,
    onPress: undefined,
    pressTriggerAsOriginalEvent: false,
    onRelease: undefined,
};
class KeyListener {
    constructor(options) {
        // value 支持keyCode，key，code三种值
        Object.defineProperty(this, "options", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "isPress", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        this.options = Object.assign({}, DefaultKeyListenerOptions, options);
    }
    static create(options) {
        return new KeyListener(options);
    }
    get value() {
        return this.options.value;
    }
    get combinations() {
        return this.options.combinations;
    }
    get identifier() {
        return this.options.combinations.join('+') + '+' + this.options.value;
    }
    get global() {
        return this.options.global;
    }
    get onPress() {
        return this.options.onPress;
    }
    set onPress(v) {
        this.options.onPress = v;
    }
    get onRelease() {
        return this.options.onRelease;
    }
    set onRelease(v) {
        this.options.onRelease = v;
    }
    get pressTriggerEveryTime() {
        return this.options.pressTriggerAsOriginalEvent;
    }
    set pressTriggerEveryTime(v) {
        this.options.pressTriggerAsOriginalEvent = v;
    }
    press(e, app) {
        if (!this.checkCombinations(e)) {
            console.debug('组合键不匹配, 不执行press', e, this);
            return;
        }
        if (this.pressTriggerEveryTime || !this.isPress) {
            this.isPress = true;
            if (this.onPress) {
                this.onPress(e, app);
            }
        }
    }
    /**
     * 检查组合键是否匹配
     */
    checkCombinations(e) {
        const cbs = this.combinations;
        if (cbs.length > 0) {
            if (((e.altKey && cbs.includes(CombinationKey.Alt)) ||
                (!e.altKey && !cbs.includes(CombinationKey.Alt))) &&
                ((e.ctrlKey && cbs.includes(CombinationKey.Ctrl)) ||
                    (!e.ctrlKey && !cbs.includes(CombinationKey.Ctrl))) &&
                ((e.shiftKey && cbs.includes(CombinationKey.Shift)) ||
                    (!e.shiftKey && !cbs.includes(CombinationKey.Shift)))) {
                return true;
            }
        }
        else {
            return !e.altKey && !e.ctrlKey && !e.shiftKey;
        }
        return false;
    }
    release(e, app) {
        if (this.isPress) {
            this.isPress = false;
            if (this.onRelease) {
                this.onRelease(e, app);
            }
        }
    }
    onRemove() {
        // 重置按下状态
        this.isPress = false;
    }
}

/**
 * 图形复制插件
 */
class GraphicCopyPlugin {
    constructor(scene) {
        Object.defineProperty(this, "container", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "scene", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "keyListeners", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "copys", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "start", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "running", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        Object.defineProperty(this, "moveLimit", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.scene = scene;
        this.container = new Container();
        this.copys = [];
        this.keyListeners = [];
        this.keyListeners.push(new KeyListener({
            // ESC 用于取消复制操作
            value: 'Escape',
            global: true,
            // combinations: [CombinationKey.Ctrl],
            onPress: () => {
                this.cancle();
            },
        }), new KeyListener({
            // X 限制只能在x轴移动
            value: 'KeyX',
            global: true,
            // combinations: [CombinationKey.Ctrl],
            onPress: () => {
                this.updateMoveLimit('x');
            },
        }), new KeyListener({
            // Y 限制只能在y轴移动
            value: 'KeyY',
            global: true,
            // combinations: [CombinationKey.Ctrl],
            onPress: () => {
                this.updateMoveLimit('y');
            },
        }));
    }
    updateMoveLimit(limit) {
        if (this.moveLimit === limit) {
            this.moveLimit = undefined;
        }
        else {
            this.moveLimit = limit;
        }
    }
    init() {
        if (this.running)
            return;
        if (this.scene.selectedGraphics.length === 0) {
            throw new Error('没有选中图形，复制取消');
        }
        this.running = true;
        this.copys = [];
        this.container.alpha = 0.5;
        this.scene.canvas.addChild(this.container);
        const app = this.scene;
        this.scene.selectedGraphics.forEach((g) => {
            const template = app.getGraphicTemplatesByType(g.type);
            const clone = template.clone(g);
            this.copys.push(clone);
            this.container.position.set(0, 0);
            this.container.addChild(clone);
            clone.repaint();
        });
        this.scene.canvas.on('mousemove', this.onPointerMove, this);
        this.scene.canvas.on('mouseup', this.onFinish, this);
        this.scene.canvas.on('rightup', this.cancle, this);
        this.keyListeners.forEach((kl) => {
            this.scene.app.addKeyboardListener(kl);
        });
    }
    clear() {
        this.running = false;
        this.start = undefined;
        this.moveLimit = undefined;
        this.copys = [];
        this.container.removeChildren();
        this.scene.canvas.removeChild(this.container);
        this.scene.canvas.off('mousemove', this.onPointerMove, this);
        this.scene.canvas.off('mouseup', this.onFinish, this);
        this.scene.canvas.off('rightup', this.cancle, this);
        this.keyListeners.forEach((kl) => {
            this.scene.app.removeKeyboardListener(kl);
        });
    }
    onPointerMove(e) {
        const cp = this.scene.toCanvasCoordinates(e.global);
        if (!this.start) {
            this.start = cp;
        }
        else {
            if (this.moveLimit === 'x') {
                const dx = cp.x - this.start.x;
                this.container.position.x = dx;
                this.container.position.y = 0;
            }
            else if (this.moveLimit === 'y') {
                const dy = cp.y - this.start.y;
                this.container.position.x = 0;
                this.container.position.y = dy;
            }
            else {
                const dx = cp.x - this.start.x;
                const dy = cp.y - this.start.y;
                this.container.position.x = dx;
                this.container.position.y = dy;
            }
        }
    }
    onFinish() {
        console.log('复制确认');
        // 将图形添加到app
        this.copys.forEach((g) => {
            g.position.x += this.container.position.x;
            g.position.y += this.container.position.y;
        });
        this.scene.app.addGraphicAndRecord(...this.copys);
        this.scene.detectRelations();
        this.scene.updateSelected(...this.copys);
        this.clear();
    }
    cancle() {
        console.log('复制操作取消');
        this.scene.canvas.removeChild(this.container);
        this.clear();
    }
}

class VectorGraphicUtil {
    static handle(obj) {
        const vg = obj;
        const onScaleChange = function (obj) {
            if (vg.isParent(obj)) {
                vg.updateOnScaled();
            }
        };
        const registerScaleChange = function registerScaleChange(obj) {
            if (!obj.scaledListenerOn) {
                obj.scaledListenerOn = true;
                obj.getGraphicApp().on('viewport-scaled', onScaleChange);
            }
        };
        const unregisterScaleChange = function unregisterScaleChange(obj) {
            obj.scaledListenerOn = false;
            obj.getGraphicApp().off('viewport-scaled', onScaleChange);
        };
        obj.onAddToCanvas = function onAddToCanvas() {
            obj.updateOnScaled();
            registerScaleChange(obj);
        };
        obj.onRemoveFromCanvas = function onRemoveFromCanvas() {
            // console.debug('矢量图像onRemoveFromCanvas');
            unregisterScaleChange(obj);
        };
        obj.on('added', (container) => {
            if (container.isInCanvas()) {
                obj.onAddToCanvas(container.getCanvas());
            }
        });
    }
}

/**
 * 矢量文字.实现原理：在缩放发生变化时，更新fontSize
 */
class VectorText extends Text {
    constructor(text, style, canvas) {
        super(text, style, canvas);
        Object.defineProperty(this, "vectorFontSize", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 8
        });
        Object.defineProperty(this, "scaled", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 1
        });
        Object.defineProperty(this, "scaledListenerOn", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        VectorGraphicUtil.handle(this);
    }
    updateOnScaled() {
        const scaled = this.getAllParentScaled();
        const scale = Math.max(scaled.x, scaled.y);
        this.style.fontSize = this.vectorFontSize * scale;
        this.scale.set(1 / scale, 1 / scale);
    }
    /**
     * 设置矢量文字的字体大小
     */
    setVectorFontSize(fontSize) {
        if (this.vectorFontSize !== fontSize) {
            this.vectorFontSize = fontSize;
            this.updateOnScaled();
        }
    }
}

/**
 * 拖拽点参数
 */
const DraggablePointParam = {
    lineWidth: 1,
    lineColor: 0x000000,
    fillColor: 0xffffff,
    radius: 5, // 半径
};
const DraggablePointGraphic = new Graphics();
DraggablePointGraphic.lineStyle(DraggablePointParam.lineWidth, DraggablePointParam.lineColor);
DraggablePointGraphic.beginFill(DraggablePointParam.fillColor);
DraggablePointGraphic.drawCircle(0, 0, DraggablePointParam.radius);
DraggablePointGraphic.endFill();
/**
 * 拖拽点，用于更新图形属性
 */
class DraggablePoint extends Graphics {
    /**
     *
     * @param point 画布坐标点
     */
    constructor(point) {
        super(DraggablePointGraphic.geometry);
        Object.defineProperty(this, "scaledListenerOn", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        this.position.copyFrom(point);
        this.eventMode = 'static';
        this.draggable = true;
        this.cursor = 'crosshair';
        VectorGraphicUtil.handle(this);
    }
    updateOnScaled() {
        const scaled = this.getAllParentScaled();
        const scale = Math.max(scaled.x, scaled.y);
        this.scale.set(1 / scale, 1 / scale);
    }
}

/**
 * 浮点数相等判断误差值
 */
const epsilon = 0.00001;
/**
 * 判断浮点数是不是0
 * @param v
 * @returns
 */
function isZero(v) {
    if (Math.abs(v) < epsilon) {
        return true;
    }
    return false;
}
/**
 * 两浮点数是否相等
 * @param f1
 * @param f2
 * @returns
 */
function floatEquals(f1, f2) {
    return isZero(f1 - f2);
}

/* eslint-disable @typescript-eslint/no-this-alias */
class Vector2 {
    constructor(values) {
        Object.defineProperty(this, "values", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Float32Array(2)
        });
        if (values !== undefined) {
            this.xy = values;
        }
    }
    static from(p) {
        return new Vector2([p.x, p.y]);
    }
    get x() {
        return this.values[0];
    }
    set x(value) {
        this.values[0] = value;
    }
    get y() {
        return this.values[1];
    }
    set y(value) {
        this.values[1] = value;
    }
    get xy() {
        return [this.values[0], this.values[1]];
    }
    set xy(values) {
        this.values[0] = values[0];
        this.values[1] = values[1];
    }
    at(index) {
        return this.values[index];
    }
    reset() {
        this.x = 0;
        this.y = 0;
    }
    copy(dest) {
        if (!dest) {
            dest = new Vector2();
        }
        dest.x = this.x;
        dest.y = this.y;
        return dest;
    }
    negate(dest) {
        if (!dest) {
            dest = this;
        }
        dest.x = -this.x;
        dest.y = -this.y;
        return dest;
    }
    equals(vector, threshold = epsilon) {
        if (Math.abs(this.x - vector.x) > threshold) {
            return false;
        }
        if (Math.abs(this.y - vector.y) > threshold) {
            return false;
        }
        return true;
    }
    length() {
        return Math.sqrt(this.squaredLength());
    }
    squaredLength() {
        const x = this.x;
        const y = this.y;
        return x * x + y * y;
    }
    add(vector) {
        this.x += vector.x;
        this.y += vector.y;
        return this;
    }
    subtract(vector) {
        this.x -= vector.x;
        this.y -= vector.y;
        return this;
    }
    multiply(vector) {
        this.x *= vector.x;
        this.y *= vector.y;
        return this;
    }
    divide(vector) {
        this.x /= vector.x;
        this.y /= vector.y;
        return this;
    }
    scale(value, dest) {
        if (!dest) {
            dest = this;
        }
        dest.x *= value;
        dest.y *= value;
        return dest;
    }
    normalize(dest) {
        if (!dest) {
            dest = this;
        }
        let length = this.length();
        if (length === 1) {
            return this;
        }
        if (length === 0) {
            dest.x = 0;
            dest.y = 0;
            return dest;
        }
        length = 1.0 / length;
        dest.x *= length;
        dest.y *= length;
        return dest;
    }
    // multiplyMat2(matrix: mat2, dest?: Vector2): Vector2 {
    //   if (!dest) {
    //     dest = this;
    //   }
    //   return matrix.multiplyVec2(this, dest);
    // }
    // multiplyMat3(matrix: mat3, dest?: Vector2): Vector2 {
    //   if (!dest) {
    //     dest = this;
    //   }
    //   return matrix.multiplyVec2(this, dest);
    // }
    // static cross(vector: Vector2, vector2: Vector2, dest?: vec3): vec3 {
    //   if (!dest) {
    //     dest = new vec3();
    //   }
    //   const x = vector.x;
    //   const y = vector.y;
    //   const x2 = vector2.x;
    //   const y2 = vector2.y;
    //   const z = x * y2 - y * x2;
    //   dest.x = 0;
    //   dest.y = 0;
    //   dest.z = z;
    //   return dest;
    // }
    /**
     * 向量点乘
     * @param vector
     * @param vector2
     * @returns
     */
    static dot(vector, vector2) {
        return vector.x * vector2.x + vector.y * vector2.y;
    }
    /**
     * 向量长度
     * @param vector
     * @param vector2
     * @returns
     */
    static distance(vector, vector2) {
        return Math.sqrt(this.squaredDistance(vector, vector2));
    }
    /**
     * 向量长度平方
     * @param vector
     * @param vector2
     * @returns
     */
    static squaredDistance(vector, vector2) {
        const x = vector2.x - vector.x;
        const y = vector2.y - vector.y;
        return x * x + y * y;
    }
    /**
     * v2->v1的方向的单位向量
     * @param v1
     * @param v2
     * @param dest
     * @returns
     */
    static direction(v1, v2, dest) {
        if (!dest) {
            dest = new Vector2();
        }
        const x = v1.x - v2.x;
        const y = v1.y - v2.y;
        let length = Math.sqrt(x * x + y * y);
        if (length === 0) {
            dest.x = 0;
            dest.y = 0;
            return dest;
        }
        length = 1 / length;
        dest.x = x * length;
        dest.y = y * length;
        return dest;
    }
    static mix(vector, vector2, time, dest) {
        if (!dest) {
            dest = new Vector2();
        }
        const x = vector.x;
        const y = vector.y;
        const x2 = vector2.x;
        const y2 = vector2.y;
        dest.x = x + time * (x2 - x);
        dest.y = y + time * (y2 - y);
        return dest;
    }
    /**
     * 向量加法
     * @param vector
     * @param vector2
     * @param dest
     * @returns
     */
    static sum(vector, vector2, dest) {
        if (!dest) {
            dest = new Vector2();
        }
        dest.x = vector.x + vector2.x;
        dest.y = vector.y + vector2.y;
        return dest;
    }
    /**
     * 向量减法
     * @param vector
     * @param vector2
     * @param dest
     * @returns
     */
    static difference(vector, vector2, dest) {
        if (!dest) {
            dest = new Vector2();
        }
        dest.x = vector.x - vector2.x;
        dest.y = vector.y - vector2.y;
        return dest;
    }
    /**
     * 向量乘法
     * @param vector
     * @param vector2
     * @param dest
     * @returns
     */
    static product(vector, vector2, dest) {
        if (!dest) {
            dest = new Vector2();
        }
        dest.x = vector.x * vector2.x;
        dest.y = vector.y * vector2.y;
        return dest;
    }
    /**
     * 向量除法
     * @param vector
     * @param vector2
     * @param dest
     * @returns
     */
    static quotient(vector, vector2, dest) {
        if (!dest) {
            dest = new Vector2();
        }
        dest.x = vector.x / vector2.x;
        dest.y = vector.y / vector2.y;
        return dest;
    }
}
Object.defineProperty(Vector2, "zero", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: new Vector2([0, 0])
});
Object.defineProperty(Vector2, "one", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: new Vector2([1, 1])
});

/**
 * 递归父节点执行逻辑
 * @param obj
 * @param handler
 */
function recursiveParents(obj, handler) {
    if (obj.parent) {
        handler(obj.parent);
        recursiveParents(obj.parent, handler);
    }
}
/**
 * 递归父节点查询父节点对象
 * @param obj
 * @param finder
 * @returns
 */
function recursiveFindParent(obj, finder) {
    if (obj.parent) {
        if (finder(obj.parent)) {
            return obj.parent;
        }
        else {
            return recursiveFindParent(obj.parent, finder);
        }
    }
    return null;
}
/**
 * 递归子节点执行逻辑
 * @param container
 * @param handler
 */
function recursiveChildren(container, handler) {
    container.children.forEach((child) => {
        handler(child);
        if (child.children) {
            recursiveChildren(child, handler);
        }
    });
}
/**
 * 递归子节点查询子节点对象
 */
function recursiveFindChild(container, finder) {
    let result = null;
    for (let i = 0; i < container.children.length; i++) {
        const child = container.children[i];
        if (finder(child)) {
            return child;
        }
        else if (child.children) {
            result = recursiveFindChild(child, finder);
        }
    }
    return result;
}
/**
 * 判断贝塞尔曲线数据是否正确
 * @param points
 */
function assertBezierPoints(points) {
    if (points.length < 4 || points.length % 3 !== 1) {
        throw new Error(`bezierCurve 数据错误: ${points}`);
    }
}
/**
 * 转换为贝塞尔曲线参数
 * @param points
 * @returns
 */
function convertToBezierParams(points) {
    assertBezierPoints(points);
    const bps = [];
    for (let i = 0; i < points.length - 3; i += 3) {
        const p1 = new Point(points[i].x, points[i].y);
        const p2 = new Point(points[i + 3].x, points[i + 3].y);
        const cp1 = new Point(points[i + 1].x, points[i + 1].y);
        const cp2 = new Point(points[i + 2].x, points[i + 2].y);
        bps.push({
            p1,
            p2,
            cp1,
            cp2,
        });
    }
    return bps;
}
/**
 * 根据分段数计算贝塞尔曲线所有点坐标
 * @param basePoints
 * @param segmentsCount
 * @returns
 */
function calculateBezierPoints(basePoints, segmentsCount) {
    const bps = convertToBezierParams(basePoints);
    const points = [];
    bps.forEach((bp) => {
        points.push(...calculateOneBezierPoints(bp.p1, bp.p2, bp.cp1, bp.cp2, segmentsCount));
    });
    return points;
}
/**
 * 根据分段数计算贝塞尔曲线所有点坐标
 * @param basePoints
 * @param segmentsCount
 * @returns
 */
function calculateOneBezierPoints(p1, p2, cp1, cp2, segmentsCount) {
    const points = [];
    const fromX = p1.x;
    const fromY = p1.y;
    const n = segmentsCount;
    let dt = 0;
    let dt2 = 0;
    let dt3 = 0;
    let t2 = 0;
    let t3 = 0;
    const cpX = cp1.x;
    const cpY = cp1.y;
    const cpX2 = cp2.x;
    const cpY2 = cp2.y;
    const toX = p2.x;
    const toY = p2.y;
    points.push(new Point(p1.x, p1.y));
    for (let i = 1, j = 0; i <= n; ++i) {
        j = i / n;
        dt = 1 - j;
        dt2 = dt * dt;
        dt3 = dt2 * dt;
        t2 = j * j;
        t3 = t2 * j;
        const px = dt3 * fromX + 3 * dt2 * j * cpX + 3 * dt * t2 * cpX2 + t3 * toX;
        const py = dt3 * fromY + 3 * dt2 * j * cpY + 3 * dt * t2 * cpY2 + t3 * toY;
        points.push(new Point(px, py));
    }
    return points;
}
/**
 * 计算矩形中点
 */
function getRectangleCenter(rectangle) {
    return new Point(rectangle.x + rectangle.width / 2, rectangle.y + rectangle.height / 2);
}
/**
 * 计算两个矩形中心对齐的坐标, PS: 计算的是较大包围框的中心
 * @param rect1
 * @param rect2
 * @returns
 */
function getCenterOfTwoRectangle(rect1, rect2) {
    const x = Math.abs(rect1.width - rect2.width) / 2;
    const y = Math.abs(rect1.height - rect2.height) / 2;
    return new Point(x, y);
}
/**
 * 序列化图形变换
 * @param obj
 * @returns
 */
function serializeTransform(obj) {
    const position = obj.position;
    const scale = obj.scale;
    const angle = obj.angle;
    const skew = obj.skew;
    return [position.x, position.y, scale.x, scale.y, angle, skew.x, skew.y];
}
/**
 * 反序列化变换数据到图形对象
 * @param obj
 * @param transform
 */
function deserializeTransformInto(obj, transform) {
    if (transform.length === 7) {
        obj.position.set(transform[0], transform[1]);
        obj.scale.set(transform[2], transform[3]);
        obj.angle = transform[4];
        obj.skew.set(transform[5], transform[6]);
    }
    else if (transform.length > 0) {
        console.warn('错误的变换数据', transform);
    }
}
/**
 * 将直线转换为多边形
 * @param p1
 * @param p2
 * @param thick
 * @returns
 */
function convertLineToPolygonPoints(p1, p2, thick) {
    const angle = Math.atan2(p2.y - p1.y, p2.x - p1.x) - Math.PI / 2;
    const half = thick / 2;
    const cos = Math.cos(angle) * half;
    const sin = Math.sin(angle) * half;
    return [
        new Point(p1.x - cos, p1.y - sin),
        new Point(p2.x - cos, p2.y - sin),
        new Point(p2.x + cos, p2.y + sin),
        new Point(p1.x + cos, p1.y + sin),
    ];
}
/**
 * 转换矩形为多边形点坐标
 * @param rect 矩形
 * @returns
 */
function convertRectangleToPolygonPoints(rect) {
    return [
        new Point(rect.x, rect.y),
        new Point(rect.x + rect.width, rect.y),
        new Point(rect.x + rect.width, rect.y + rect.height),
        new Point(rect.x, rect.y + rect.height),
    ];
}
/**
 * 计算线段中点坐标
 * @param p1
 * @param p2
 * @returns
 */
function calculateLineMidpoint(p1, p2) {
    const x = (p1.x + p2.x) / 2;
    const y = (p1.y + p2.y) / 2;
    return new Point(x, y);
}
/**
 * 计算线段细分坐标--线段分成几份
 * @param p1
 * @param p2
 * @param knife
 * @returns
 */
function calculateLineSegmentingPoint(p1, p2, knife) {
    const segmentingPoints = [];
    const x = p1.x < p2.x ? p1.x : p2.x;
    const y = p1.y < p2.y ? p1.y : p2.y;
    const w = Math.abs(p1.x - p2.x);
    const h = Math.abs(p1.y - p2.y);
    for (let i = 0; i < knife - 1; i++) {
        const pointX = x + (w * (i + 1)) / knife;
        const pointy = y + (h * (i + 1)) / knife;
        segmentingPoints.push(new Point(pointX, pointy));
    }
    return segmentingPoints;
}
/**
 * 计算点到直线距离
 * @param p1
 * @param p2
 * @param p
 */
function calculateDistanceFromPointToLine(p1, p2, p) {
    // 求直线的一般方程参数ABC，直线的一般式方程AX+BY+C=0
    const A = p1.y - p2.y;
    const B = p2.x - p1.x;
    const C = p1.x * p2.y - p1.y * p2.x;
    // 计算点到直线垂直距离: d = |Ax+By+C|/sqrt(A*A+B*B),其中x,y为点坐标
    const dl = Math.abs(A * p.x + B * p.y + C) / Math.sqrt(A * A + B * B);
    return dl;
}
/**
 * 计算点到直线的垂足坐标
 * @param p
 * @param p1
 * @param p2
 */
function calculateFootPointFromPointToLine(p1, p2, p) {
    if (p1.x == p2.x && p1.y == p2.y) {
        throw new Error(`直线两坐标点相等:${p1}`);
    }
    const k = -(((p1.x - p.x) * (p2.x - p1.x) + (p1.y - p.y) * (p2.y - p1.y)) /
        (Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2)));
    if (isZero(k)) {
        return new Point(p.x, p.y);
    }
    const xf = k * (p2.x - p1.x) + p1.x;
    const yf = k * (p2.y - p1.y) + p1.y;
    return new Point(xf, yf);
}
/**
 * 计算直线与圆的交点
 * 1用直线到圆心的距离和半径相比，判断是否和圆有交点；
 * 2求出圆心在直线上面的垂点；
 * 3算出直线的单位向量e；
 * 4求出一侧交点(Intersection)到projectPoint的长度(sideLength)；
 * 5求出sideLength和这侧端点到projectPoint距离的比例(ratio)；
 * 6projectPoint +/- ratio * e = 两侧交点；
 * @param p0 圆心坐标
 * @param radius 圆半径
 * @param p1 直线坐标1
 * @param p2 直线坐标2
 * @returns 交点坐标，可能2/1/0个
 */
function calculateIntersectionPointOfCircleAndLine(p0, radius, p1, p2) {
    const distance = calculateDistanceFromPointToLine(p1, p2, p0);
    if (distance <= radius) {
        // 有交点
        // 计算垂点
        const pr = calculateFootPointFromPointToLine(p1, p2, p0);
        if (floatEquals(distance, radius)) {
            // 切线
            return [pr];
        }
        const vpr = new Vector2([pr.x, pr.y]);
        const vc = new Vector2([p0.x, p0.y]);
        // 计算直线单位向量
        const v1 = new Vector2([p1.x, p1.y]);
        const v2 = new Vector2([p2.x, p2.y]);
        const ve = Vector2.direction(v2, v1);
        const base = Math.sqrt(Math.abs(radius * radius - Vector2.difference(vpr, vc).squaredLength()));
        const vl = ve.scale(base);
        const ip1 = Vector2.sum(vpr, vl);
        const ip2 = Vector2.difference(vpr, vl);
        return [new Point(ip1.x, ip1.y), new Point(ip2.x, ip2.y)];
    }
    else {
        // 无交点
        return [];
    }
}
/**
 * 计算圆心与圆心外一点与圆的交点（取圆心到点的向量与圆的交点）
 * @param p0 圆心坐标
 * @param radius 圆半径
 * @param p 点坐标
 * @returns
 */
function calculateIntersectionPointOfCircleAndPoint(p0, radius, p) {
    const points = calculateIntersectionPointOfCircleAndLine(p0, radius, p0, p);
    const vc = new Vector2([p0.x, p0.y]);
    const vp = new Vector2([p.x, p.y]);
    const vecp = Vector2.direction(vp, vc);
    for (let i = 0; i < points.length; i++) {
        const ip = points[i];
        const ve = Vector2.direction(new Vector2([ip.x, ip.y]), vc);
        if (ve.equals(vecp)) {
            return ip;
        }
    }
    throw new Error('计算圆心与圆心外一点与圆的交点逻辑错误');
}
/**
 * 计算点基于点的镜像点坐标
 * @param bp 基准点
 * @param p 待镜像的点坐标
 * @param distance 镜像点到基准点的距离，默认为p到基准点的距离,即对称
 * @returns
 */
function calculateMirrorPoint(bp, p, distance) {
    const vbp = Vector2.from(bp);
    const vp = Vector2.from(p);
    const direction = Vector2.direction(vbp, vp);
    if (distance == undefined) {
        distance = Vector2.distance(vbp, vp);
    }
    const vmp = Vector2.sum(vbp, direction.scale(distance));
    return new Point(vmp.x, vmp.y);
}
/**
 * 计算基于给定轴的给定点的镜像点坐标
 * @param pa 给定轴线的坐标
 * @param pb 给定轴线的坐标
 * @param p 待镜像点坐标
 * @param distance
 * @returns
 */
function calculateMirrorPointBasedOnAxis(pa, pb, p, distance) {
    const fp = calculateFootPointFromPointToLine(pa, pb, p);
    if (fp.equals(p)) {
        return fp;
    }
    else {
        return calculateMirrorPoint(fp, p, distance);
    }
}
/**
 * 计算直线与水平夹角,角度按顺时针，从0开始
 * @param p1
 * @param p2
 * @returns 角度，范围[0, 360)
 */
function angleToAxisx(p1, p2) {
    if (p1.x == p2.x && p1.y == p2.y) {
        throw new Error('一个点无法计算角度');
    }
    const dx = Math.abs(p1.x - p2.x);
    const dy = Math.abs(p1.y - p2.y);
    if (p2.x == p1.x) {
        if (p2.y > p1.y) {
            return 90;
        }
        else {
            return 270;
        }
    }
    if (p2.y == p1.y) {
        if (p2.x > p1.x) {
            return 0;
        }
        else {
            return 180;
        }
    }
    const angle = (Math.atan2(dy, dx) * 180) / Math.PI;
    if (p2.x > p1.x) {
        if (p2.y > p1.y) {
            return angle;
        }
        else if (p2.y < p1.y) {
            return 360 - angle;
        }
    }
    else if (p2.x < p1.x) {
        if (p2.y > p1.y) {
            return 180 - angle;
        }
        else {
            return 180 + angle;
        }
    }
    return angle;
}
/**
 * 计算两线夹角,pc与pa,pb的夹角，顺时针为正，逆时针为负
 * @param pa 交点
 * @param pb 锚定
 * @param pc
 * @returns 夹角, [-180, 180]
 */
function angleOfIncludedAngle(pa, pb, pc) {
    const abAngle = angleToAxisx(pa, pb);
    const acAngle = angleToAxisx(pa, pc);
    let angle = acAngle - abAngle;
    if (angle < -180) {
        angle = 360 + angle;
    }
    else if (angle > 180) {
        angle = -(360 - angle);
    }
    return angle;
}
/**
 * 计算两点连线的法向量
 * @param point1
 * @param point2
 * @returns 单位法向量
 */
function getNormalVector(point1, point2) {
    const x1 = point1.x, y1 = point1.y;
    const x2 = point2.x, y2 = point2.y;
    const length = Math.sqrt(Math.pow((y2 - y1), 2) + Math.pow((x2 - x1), 2));
    return [(y2 - y1) / length, (x1 - x2) / length];
}
/**
 * 点延向量方向移动
 * @param point
 * @param normal  单位向量
 * @param length 平移长度
 * @returns 移动后的点
 */
function movePointAlongNormal(point, normal, length) {
    const newPoint = new Point(point.x + length * normal[0], point.y + length * normal[1]);
    return newPoint;
}
/**
 * 计算两组点各自组成直线的相交点(若两线平行 返回第一组坐标第一个点)
 * @param line1 两点坐标列表
 * @param line2 两点坐标列表
 * @returns 相交点
 */
function getIntersectionPoint(line1, line2) {
    const a1 = line1[0], b1 = line1[1];
    const a2 = line1[2], b2 = line1[3];
    const a3 = line2[0], b3 = line2[1];
    const a4 = line2[2], b4 = line2[3];
    const denominator = (a3 - a4) * (b1 - b2) - (a1 - a2) * (b3 - b4);
    if (denominator === 0) {
        return new Point(a1, b1);
    }
    const x = ((a3 - a4) * (a2 * b1 - a1 * b2) - (a1 - a2) * (a4 * b3 - a3 * b4)) /
        denominator;
    const y = ((b3 - b4) * (b2 * a1 - b1 * a2) - (b1 - b2) * (b4 * a3 - b3 * a4)) /
        -denominator;
    return new Point(x, y);
}
/**
 * 是否平行线
 * @param p1
 * @param p2
 * @param pa
 * @param pb
 * @returns
 */
function isParallelLines(p1, p2, pa, pb) {
    const vle1 = Vector2.direction(Vector2.from(p1), Vector2.from(p2));
    const vle2 = Vector2.direction(Vector2.from(pa), Vector2.from(pb));
    if (vle2.equals(vle1)) {
        return true;
    }
    return vle1.equals(Vector2.direction(Vector2.from(pb), Vector2.from(pa)));
}
/**
 * 点是否在线段上
 * @param p1
 * @param p2
 * @param p
 * @returns
 */
function isPointOnLine(p1, p2, p) {
    const vp1 = Vector2.from(p1);
    const vp2 = Vector2.from(p2);
    const vp = Vector2.from(p);
    if (vp1.equals(vp) || vp2.equals(vp)) {
        return true;
    }
    const vle = Vector2.direction(vp1, Vector2.from(p2));
    const vpe = Vector2.direction(vp1, vp);
    if (vle.equals(vpe)) {
        return (Vector2.difference(vp1, vp2).squaredLength() >=
            Vector2.difference(vp1, vp).squaredLength());
    }
    return false;
}
/**
 * 两条线段是否存在包含关系
 * @param line1
 * @param line2
 * @returns
 */
function isLineContainOther(line1, line2) {
    return ((isPointOnLine(line1.p1, line1.p2, line2.p1) &&
        isPointOnLine(line1.p1, line1.p2, line2.p2)) ||
        (isPointOnLine(line2.p1, line2.p2, line1.p1) &&
            isPointOnLine(line2.p1, line2.p2, line1.p2)));
}
/** 均分线段, 返回各线段端点 */
function splitLineEvenly(p1, p2, count) {
    const [stepX, stepY] = [(p2.x - p1.x) / count, (p2.y - p1.y) / count];
    return Array(count)
        .fill(1)
        .map((_, i) => {
        return [
            { x: p1.x + stepX * i, y: p1.y + stepY * i },
            { x: p1.x + stepX * (i + 1), y: p1.y + stepY * (i + 1) },
        ];
    });
}
function splitPolyline(points, count) {
    if (points.length !== 2) {
        let totalLen = 0;
        const lengths = [];
        for (let i = 1; i < points.length; i++) {
            const { x: x1, y: y1 } = points[i - 1], { x: x2, y: y2 } = points[i];
            const len = new Vector2([x2 - x1, y2 - y1]).length();
            totalLen += len;
            lengths.push(len);
        }
        const counts = lengths.map((length) => Math.round((count * length) / totalLen));
        if (counts.reduce((p, c) => p + c, 0) !== count) {
            const intersection = counts.reduce((p, c) => p + c, 0) - count;
            let maxCountIndex = 0, maxCount = 0;
            counts.forEach((c, i) => {
                if (c > maxCount) {
                    maxCount = c;
                    maxCountIndex = i;
                }
            });
            counts[maxCountIndex] + intersection;
        }
        return counts
            .map((count, i) => {
            return splitLineEvenly(points[i], points[i + 1], count);
        })
            .flat();
    }
    else {
        return splitLineEvenly(points[0], points[points.length - 1], count);
    }
}
function getParallelOfPolyline(points, offset, side) {
    const { PI, cos, acos } = Math;
    const angleBase = side === 'L' ? -PI / 2 : PI / 2;
    return points.map((p, i) => {
        let baseUnitVec; //上一段的基准单位向量
        let angle; //偏转角度
        let len; //结合偏转角度的实际偏移量
        if (!points[i - 1] || !points[i + 1]) {
            angle = angleBase;
            len = offset;
            baseUnitVec = points[i - 1]
                ? new Vector2([
                    p.x - points[i - 1].x,
                    p.y - points[i - 1].y,
                ]).normalize()
                : new Vector2([
                    points[i + 1].x - p.x,
                    points[i + 1].y - p.y,
                ]).normalize();
        }
        else {
            const vp = new Vector2([p.x - points[i - 1].x, p.y - points[i - 1].y]);
            const vn = new Vector2([points[i + 1].x - p.x, points[i + 1].y - p.y]);
            const cosTheta = Vector2.dot(vn, vp) / (vp.length() * vn.length());
            const direction = vp.x * vn.y - vp.y * vn.x > 0; //det(vp|vn)>0?
            const theta = direction ? acos(cosTheta) : -acos(cosTheta);
            angle = angleBase + theta / 2;
            len = offset / cos(theta / 2);
            baseUnitVec = Vector2.from(vp).normalize();
        }
        return new Matrix()
            .scale(len, len)
            .rotate(angle)
            .translate(p.x, p.y)
            .apply(baseUnitVec);
    });
}

// /**
//  * 点线碰撞检测
//  * @param pa 线段a端坐标
//  * @param pb 线段b端坐标
//  * @param p 点坐标
//  * @param tolerance 容忍度，越大检测范围越大
//  * @returns
//  */
// export function linePoint(pa: Point, pb: Point, p: Point, tolerance: number): boolean {
//     return (Math.abs(distanceSquared(pa.x, pa.y, pb.x, pb.y) - (distanceSquared(pa.x, pa.y, p.x, p.y) + distanceSquared(pb.x, pb.y, p.x, p.y))) <= tolerance)
// }
/**
 * 根据点到直线的垂直距离计算碰撞
 * @param pa 线段a端坐标
 * @param pb 线段b端坐标
 * @param p 点坐标
 * @param lineWidth 线宽
 * @param exact 是否精确（使用给定线宽，否则线宽会设置为8）
 * @returns
 */
function linePoint(pa, pb, p, lineWidth, exact = false) {
    if (!exact && lineWidth < 6) {
        lineWidth = 6;
    }
    // 求直线的一般方程参数ABC，直线的一般式方程AX+BY+C=0
    const A = pa.y - pb.y;
    const B = pb.x - pa.x;
    const C = pa.x * pb.y - pa.y * pb.x;
    // 计算点到直线垂直距离: d = |Ax+By+C|/sqrt(A*A+B*B),其中x,y为点坐标
    const dl = Math.abs(A * p.x + B * p.y + C) / Math.sqrt(A * A + B * B);
    const intersect = dl <= lineWidth / 2;
    if (intersect) {
        // 距离在线宽范围内,再判断点是否超过线段两端点范围外(两端点外会有一点误差，两端点线宽一半半径的圆范围内)
        const da = distance(pa.x, pa.y, p.x, p.y);
        const db = distance(pb.x, pb.y, p.x, p.y);
        const dab = distance(pa.x, pa.y, pb.x, pb.y);
        return da <= dl + dab && db <= dl + dab;
    }
    return false;
}
/**
 * 折线与点碰撞
 * @param points 折线端点列表
 * @param p 点座标
 * @param lineWidth 线宽
 */
function polylinePoint(points, p, lineWidth) {
    const len = points.length;
    for (let i = 0; i < len - 1; i++) {
        if (linePoint(points[i], points[i + 1], p, lineWidth)) {
            return true;
        }
    }
    return false;
}
/**
 * 线线碰撞检测
 * @param pa 线段1a端坐标
 * @param pb 线段1b端坐标
 * @param p1 线段2a端坐标
 * @param p2 线段2b端坐标
 * @returns
 */
function lineLine(pa, pb, p1, p2) {
    const x1 = pa.x;
    const y1 = pa.y;
    const x2 = pb.x;
    const y2 = pb.y;
    const x3 = p1.x;
    const y3 = p1.y;
    const x4 = p2.x;
    const y4 = p2.y;
    const s1_x = x2 - x1;
    const s1_y = y2 - y1;
    const s2_x = x4 - x3;
    const s2_y = y4 - y3;
    const s = (-s1_y * (x1 - x3) + s1_x * (y1 - y3)) / (-s2_x * s1_y + s1_x * s2_y);
    const t = (s2_x * (y1 - y3) - s2_y * (x1 - x3)) / (-s2_x * s1_y + s1_x * s2_y);
    return s >= 0 && s <= 1 && t >= 0 && t <= 1;
}
/**
 * 点和矩形碰撞检测
 * @param p 点作弊
 * @param rect 矩形
 * @returns
 */
function pointBox(p, rect) {
    const { x, y, width, height } = rect;
    const x2 = p.x;
    const y2 = p.y;
    return x2 >= x && x2 <= x + width && y2 >= y && y2 <= y + height;
}
/**
 * 线和矩形碰撞检测
 * @param pa 线段a端坐标
 * @param pb 线段b端坐标
 * @param rect 矩形
 * @returns
 */
function lineBox(pa, pb, rect) {
    if (pointBox(pa, rect) || pointBox(pb, rect)) {
        return true;
    }
    const { x, y, width, height } = rect;
    const rp1 = new Point(x, y);
    const rp2 = new Point(x + width, y);
    const rp3 = new Point(x + width, y + height);
    const rp4 = new Point(x, y + height);
    return (lineLine(pa, pb, rp1, rp2) ||
        lineLine(pa, pb, rp2, rp3) ||
        lineLine(pa, pb, rp3, rp4) ||
        lineLine(pa, pb, rp1, rp4));
}
/**
 * 多线段和矩形碰撞检测
 * @param points
 * @param rect
 * @returns false / 碰撞的线段序号
 */
function polylineBox(points, rect) {
    if (points.length < 2) {
        return false;
    }
    for (let i = 0; i < points.length - 1; i++) {
        const p1 = points[i];
        const p2 = points[i + 1];
        if (lineBox(p1, p2, rect)) {
            return true;
        }
    }
    return false;
}
/**
 * 两点碰撞检测
 * @param p1
 * @param p2
 * @param tolerance
 * @returns
 */
function pointPoint2(p1, p2, tolerance) {
    return pointPoint(p1.x, p1.y, p2.x, p2.y, tolerance);
}
/**
 * 两点碰撞检测
 * @param x1
 * @param y1
 * @param x2
 * @param y2
 * @param tolerance 容忍度/两点半径和
 * @returns
 */
function pointPoint(x1, y1, x2, y2, tolerance) {
    return distance(x1, y1, x2, y2) <= tolerance;
}
/**
 * 两点距离
 * @param x1
 * @param y1
 * @param x2
 * @param y2
 * @returns
 */
function distance(x1, y1, x2, y2) {
    return Math.sqrt(Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2));
}
/**
 * 两点距离
 * @param p1
 * @param p2
 * @returns
 */
function distance2(p1, p2) {
    return distance(p1.x, p1.y, p2.x, p2.y);
}
/**
 * 圆和点的碰撞检测
 * @param x1 圆心x
 * @param y1 圆心y
 * @param r1 圆半径
 * @param x2 点x
 * @param y2 点y
 * @returns
 */
function circlePoint(x1, y1, r1, x2, y2) {
    const x = x2 - x1;
    const y = y2 - y1;
    return x * x + y * y <= r1 * r1;
}
/**
 * 圆和点的碰撞检测--不包括圆内部
 */
function circlePoint2(x1, y1, r1, x2, y2, tolerance) {
    const x = x2 - x1;
    const y = y2 - y1;
    return (x * x + y * y <= (r1 + tolerance) * (r1 + tolerance) &&
        x * x + y * y >= (r1 - tolerance) * (r1 - tolerance));
}
/**
 * 点和多边形碰撞检测
 */
function pointPolygon(p, points, lineWidth) {
    const { x, y } = p;
    const length = points.length;
    let c = false;
    let i, j;
    for (i = 0, j = length - 1; i < length; i++) {
        if (points[i].y > y !== points[j].y > y &&
            x <
                ((points[j].x - points[i].x) * (y - points[i].y)) /
                    (points[j].y - points[i].y) +
                    points[i].x) {
            c = !c;
        }
        j = i;
    }
    if (c) {
        return true;
    }
    for (i = 0; i < length - 1; i++) {
        let p1, p2;
        if (i === length - 1) {
            p1 = points[i];
            p2 = points[0];
        }
        else {
            p1 = points[i];
            p2 = points[i + 1];
        }
        if (linePoint(p1, p2, p, lineWidth)) {
            return true;
        }
    }
    return false;
}
/**
 * 线和多边形碰撞检测
 * @param p1
 * @param p2
 * @param points
 * @param tolerance 多边形包围线宽
 * @returns
 */
function linePolygon(p1, p2, points, lineWidth, polygonWidth) {
    if (pointPolygon(p1, points, polygonWidth)) {
        return true;
    }
    const length = points.length;
    for (let i = 0; i < length; i++) {
        let pa, pb;
        if (i === length - 1) {
            pa = points[i];
            pb = points[0];
        }
        else {
            pa = points[i];
            pb = points[i + 1];
        }
        // TODO:此处后续需考虑有线宽的情况
        if (lineLine(pa, pb, p1, p2)) {
            return true;
        }
    }
    return false;
}
/**
 * 多边线与多边形碰撞检测
 * @param polylinePoints 多边线所有点坐标
 * @param polygonPoints 多边形所有点坐标
 * @param polylineWidth 多边线的线宽
 * @param polygonWidth 多边形线宽
 * @returns
 */
function polylinePolygon(polylinePoints, polygonPoints, polylineWidth, polygonWidth) {
    const length = polylinePoints.length;
    for (let i = 0; i < length - 1; i++) {
        const p1 = polylinePoints[i];
        const p2 = polylinePoints[i + 1];
        if (linePolygon(p1, p2, polygonPoints, polylineWidth, polygonWidth)) {
            return true;
        }
    }
    return false;
}

function debounce(fn, waitMs = 250) {
    let timeoutId;
    const debouncedFunction = function (context, ...args) {
        const invokeFunction = function () {
            timeoutId = undefined;
            fn.apply(context, args);
        };
        if (timeoutId !== undefined) {
            console.debug('debounce clear timeout', fn);
            clearTimeout(timeoutId);
        }
        timeoutId = setTimeout(invokeFunction, waitMs);
    };
    debouncedFunction.cancel = function () {
        if (timeoutId !== undefined) {
            clearTimeout(timeoutId);
        }
    };
    return debouncedFunction;
}

const UP = new Point(0, -1);
const DOWN = new Point(0, 1);
const LEFT = new Point(-1, 0);
const RIGHT = new Point(1, 0);
/**
 * 越界结果
 */
class OutOfBound {
    constructor(left, top, right, bottom) {
        Object.defineProperty(this, "left", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "top", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "right", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "bottom", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.left = left;
        this.top = top;
        this.right = right;
        this.bottom = bottom;
    }
    static check(rect, bound) {
        const left = rect.left < bound.left;
        const top = rect.top < bound.top;
        const right = rect.right > bound.right;
        const bottom = rect.bottom > bound.bottom;
        return new OutOfBound(left, top, right, bottom);
    }
    static none() {
        return new OutOfBound(false, false, false, false);
    }
    static leftOut() {
        return new OutOfBound(true, false, false, false);
    }
    static topOut() {
        return new OutOfBound(false, true, false, false);
    }
    static rightOut() {
        return new OutOfBound(false, false, true, false);
    }
    static bottomOut() {
        return new OutOfBound(false, false, false, true);
    }
    static leftTopOut() {
        return new OutOfBound(true, true, false, false);
    }
    static rightBottomOut() {
        return new OutOfBound(false, false, true, true);
    }
}

/* eslint-disable @typescript-eslint/no-unused-vars */
/**
 * 可吸附点图形参数
 */
const AbsorbablePointParam = {
    lineWidth: 1,
    lineColor: '#000000',
    fillColor: '#E77E0E',
    radius: 5, // 半径
};
const AbsorbablePointGraphic = new Graphics();
// AbsorbablePointGraphic.lineStyle(
//   AbsorbablePointParam.lineWidth,
//   AbsorbablePointParam.lineColor
// );
AbsorbablePointGraphic.beginFill(AbsorbablePointParam.fillColor);
AbsorbablePointGraphic.drawCircle(0, 0, AbsorbablePointParam.radius);
AbsorbablePointGraphic.endFill();
/**
 * 可吸附线
 */
class AbsorbableLine extends Graphics {
    /**
     *
     * @param p1 画布坐标
     * @param p2 画布坐标
     * @param absorbRange
     */
    constructor(p1, p2, absorbRange = 20) {
        super();
        Object.defineProperty(this, "p1", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "p2", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "absorbRange", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "_color", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: '#E77E0E'
        });
        this.p1 = new Point(p1.x, p1.y);
        this.p2 = new Point(p2.x, p2.y);
        this.absorbRange = absorbRange;
        this.redraw();
    }
    isOverlapping(other) {
        if (other instanceof AbsorbableLine) {
            const contain = isLineContainOther({ p1: this.p1, p2: this.p2 }, { p1: other.p1, p2: other.p2 });
            return contain;
        }
        return false;
    }
    compareTo(other) {
        if (other instanceof AbsorbableLine) {
            return distance2(this.p1, this.p2) - distance2(other.p1, other.p2);
        }
        throw new Error('非可吸附线');
    }
    redraw() {
        this.clear();
        this.lineStyle(1, new Color(this._color));
        this.moveTo(this.p1.x, this.p1.y);
        this.lineTo(this.p2.x, this.p2.y);
    }
    tryAbsorb(...objs) {
        for (let i = 0; i < objs.length; i++) {
            const obj = objs[i];
            const canvasPosition = obj.getPositionOnCanvas();
            if (linePoint(this.p1, this.p2, canvasPosition, this.absorbRange, true)) {
                const fp = calculateFootPointFromPointToLine(this.p1, this.p2, canvasPosition);
                obj.updatePositionByCanvasPosition(fp);
            }
        }
    }
}
/**
 * 可吸附圆
 */
class AbsorbableCircle extends Graphics {
    /**
     *
     * @param p 画布坐标
     * @param radius
     * @param absorbRange
     */
    constructor(p, radius, absorbRange = 10) {
        super();
        Object.defineProperty(this, "absorbRange", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "p0", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "radius", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "_color", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: '#E77E0E'
        });
        this.p0 = new Point(p.x, p.y);
        this.radius = radius;
        this.absorbRange = absorbRange;
        this.redraw();
    }
    isOverlapping(other) {
        if (other instanceof AbsorbableCircle) {
            return this.p0.equals(other.p0) && this.radius === other.radius;
        }
        return false;
    }
    compareTo(other) {
        if (other instanceof AbsorbableCircle) {
            return this.absorbRange - other.absorbRange;
        }
        throw new Error('非可吸附圆');
    }
    redraw() {
        this.clear();
        this.lineStyle(1, new Color(this._color));
        this.drawCircle(this.p0.x, this.p0.y, this.radius);
    }
    tryAbsorb(...objs) {
        for (let i = 0; i < objs.length; i++) {
            const obj = objs[i];
            const canvasPosition = obj.getPositionOnCanvas();
            const len = distance(this.p0.x, this.p0.y, canvasPosition.x, canvasPosition.y);
            if (len > this.radius - this.absorbRange &&
                len < this.radius + this.absorbRange) {
                // 吸附，计算直线与圆交点，更新对象坐标
                const p = calculateIntersectionPointOfCircleAndPoint(this.p0, this.radius, canvasPosition);
                obj.updatePositionByCanvasPosition(p);
            }
        }
    }
}

const DefaultDashedLineOptions = {
    length: 4,
    startSpace: 0,
    space: 4,
    lineWidth: 1,
    color: '#0000ff',
};
class DashedLine extends Container {
    constructor(p1, p2, options) {
        super();
        Object.defineProperty(this, "p1", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "p2", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "_options", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        const config = Object.assign({}, DefaultDashedLineOptions, options);
        this._options = config;
        this.p1 = new Point(p1.x, p1.y);
        this.p2 = new Point(p2.x, p2.y);
        this.redraw();
    }
    setOptions(options) {
        if (options.startSpace != undefined) {
            this._options.startSpace = options.startSpace;
        }
        if (options.length != undefined) {
            this._options.length = options.length;
        }
        if (options.space != undefined) {
            this._options.space = options.space;
        }
        if (options.lineWidth != undefined) {
            this._options.lineWidth = options.lineWidth;
        }
        if (options.color != undefined) {
            this._options.color = options.color;
        }
        this.redraw();
    }
    redraw() {
        this.removeChildren();
        const p1 = this.p1;
        const p2 = this.p2;
        const option = this._options;
        const total = Math.pow(Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2), 0.5);
        let len = option.startSpace;
        while (len < total) {
            let dashedLen = option.length;
            if (len + option.length > total) {
                dashedLen = total - len;
            }
            const line = new Graphics();
            line.lineStyle(option.lineWidth, option.color);
            line.moveTo(len, 0);
            line.lineTo(len + dashedLen, 0);
            this.addChild(line);
            len = len + dashedLen + option.space;
        }
        this.pivot.set(0, option.lineWidth / 2);
        this.position.set(p1.x, p1.y);
        this.angle = angleToAxisx(p1, p2);
    }
}

class GraphicEditPlugin extends Container {
    constructor(g) {
        super();
        Object.defineProperty(this, "graphic", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.graphic = g;
        this.zIndex = 2;
        this.sortableChildren = true;
        this.graphic.on('transformstart', this.hideAll, this);
        this.graphic.on('transformend', this.showAll, this);
        this.graphic.on('repaint', this.updateEditedPointsPosition, this);
    }
    destroy(options) {
        this.graphic.off('transformstart', this.hideAll, this);
        this.graphic.off('transformend', this.showAll, this);
        this.graphic.off('repaint', this.updateEditedPointsPosition, this);
        super.destroy(options);
    }
    hideAll() {
        this.visible = false;
    }
    showAll() {
        this.updateEditedPointsPosition();
        this.visible = true;
    }
}
class LineEditPlugin extends GraphicEditPlugin {
    constructor(g) {
        super(g);
        Object.defineProperty(this, "linePoints", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "editedPoints", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
        this.linePoints = g.linePoints;
        this.graphic.on('dataupdate', this.reset, this);
    }
    destroy(options) {
        this.graphic.off('dataupdate', this.reset, this);
        super.destroy(options);
    }
    reset() {
        this.linePoints = this.graphic.linePoints;
        this.removeChildren();
        this.editedPoints.splice(0, this.editedPoints.length);
        this.initEditPoints();
    }
}
function getWayLineIndex(points, p) {
    let start = 0;
    let end = 0;
    let minDistance = 0;
    for (let i = 1; i < points.length; i++) {
        const sp = points[i - 1];
        const ep = points[i];
        let distance = calculateDistanceFromPointToLine(sp, ep, p);
        distance = Math.round(distance * 100) / 100;
        if (i == 1) {
            minDistance = distance;
        }
        if (distance == minDistance) {
            const minX = Math.min(sp.x, ep.x);
            const maxX = Math.max(sp.x, ep.x);
            const minY = Math.min(sp.y, ep.y);
            const maxY = Math.max(sp.y, ep.y);
            const point = calculateFootPointFromPointToLine(sp, ep, p);
            if (point.x >= minX &&
                point.x <= maxX &&
                point.y >= minY &&
                point.y <= maxY) {
                start = i - 1;
            }
        }
        if (distance < minDistance) {
            minDistance = distance;
            start = i - 1;
        }
    }
    end = start + 1;
    return { start, end };
}
function getWaypointRangeIndex(points, curve, p, lineWidth) {
    let start = 0;
    let end = 0;
    if (!curve) {
        // 直线
        for (let i = 1; i < points.length; i++) {
            const sp = points[i - 1];
            const ep = points[i];
            const fp = calculateFootPointFromPointToLine(sp, ep, p);
            if (linePoint(sp, ep, fp, 1, true)) {
                start = i - 1;
                end = i;
                break;
            }
        }
    }
    else {
        // 贝塞尔曲线
        const bps = convertToBezierParams(points);
        for (let i = 0; i < bps.length; i++) {
            const bp = bps[i];
            if (pointPolygon(p, [bp.p1, bp.cp1, bp.cp2, bp.p2], lineWidth)) {
                start = i * 3;
                end = start + 3;
            }
        }
        // assertBezierPoints(points);
        // for (let i = 0; i < points.length - 3; i += 3) {
        //   const p1 = points[i];
        //   const cp1 = points[i + 1];
        //   const cp2 = points[i + 2];
        //   const p2 = points[i + 3];
        //   if (pointPolygon(p, [p1, cp1, cp2, p2], lineWidth)) {
        //     start = i;
        //     end = i + 3;
        //   }
        // }
    }
    return { start, end };
}
/**
 * 折线编辑(兼容线段)
 */
class PolylineEditPlugin extends LineEditPlugin {
    constructor(g, options) {
        super(g);
        Object.defineProperty(this, "options", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.options = Object.assign({}, options);
        this.name = PolylineEditPlugin.Name;
        this.initEditPoints();
    }
    initEditPoints() {
        const cps = this.graphic.localToCanvasPoints(...this.linePoints);
        for (let i = 0; i < cps.length; i++) {
            const p = cps[i];
            const dp = new DraggablePoint(p);
            dp.on('transforming', () => {
                const tlp = this.graphic.canvasToLocalPoint(dp.position);
                const cp = this.linePoints[i];
                cp.x = tlp.x;
                cp.y = tlp.y;
                this.graphic.repaint();
            });
            if (this.options.onEditPointCreate) {
                this.options.onEditPointCreate(this.graphic, dp, i);
            }
            this.editedPoints.push(dp);
        }
        this.addChild(...this.editedPoints);
    }
    updateEditedPointsPosition() {
        const cps = this.graphic.localToCanvasPoints(...this.linePoints);
        if (cps.length === this.editedPoints.length) {
            for (let i = 0; i < cps.length; i++) {
                const cp = cps[i];
                this.editedPoints[i].position.copyFrom(cp);
            }
        }
    }
}
Object.defineProperty(PolylineEditPlugin, "Name", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'line_points_edit'
});
function addWayPoint(graphic, curve, start, end, p) {
    if (!curve) {
        addLineWayPoint(graphic, start, end, p);
    }
    else {
        addBezierWayPoint(graphic, start, end, p);
    }
}
function addLineWayPoint(graphic, start, end, p) {
    const linePoints = graphic.linePoints;
    const points = linePoints.slice(0, start + 1);
    points.push(new Point(p.x, p.y));
    points.push(...linePoints.slice(end));
    graphic.linePoints = points;
}
function addPolygonSegmentingPoint(graphic, start, end, knife = 2) {
    const linePoints = graphic.linePoints;
    const points = linePoints.slice(0, start + 1);
    points.push(...calculateLineSegmentingPoint(linePoints[start], linePoints[end], knife));
    points.push(...linePoints.slice(end));
    graphic.linePoints = points;
}
function assertBezierWayPoint(i) {
    const c = i % 3;
    if (c !== 0) {
        throw new Error(`i=${i}的点不是路径点`);
    }
}
function addBezierWayPoint(graphic, start, end, p) {
    if (start === end) {
        console.error('添加贝塞尔曲线路径点开始结束点相等', start);
        throw new Error('开始结束点不能一致');
    }
    assertBezierWayPoint(start);
    assertBezierWayPoint(end);
    const linePoints = graphic.linePoints;
    const points = linePoints.slice(0, start + 2);
    const ap = new Point(p.x, p.y);
    points.push(ap.clone(), ap.clone(), ap.clone());
    points.push(...linePoints.slice(end - 1));
    graphic.linePoints = points;
}
function removeWayPoint(graphic, curve, i) {
    if (!curve) {
        removeLineWayPoint(graphic, i);
    }
    else {
        removeBezierWayPoint(graphic, i);
    }
}
function removeLineWayPoint(graphic, i) {
    const linePoints = graphic.linePoints;
    if (linePoints.length > 2) {
        const points = linePoints.slice(0, i);
        points.push(...linePoints.slice(i + 1));
        graphic.linePoints = points;
    }
}
function removeBezierWayPoint(graphic, i) {
    let points;
    const linePoints = graphic.linePoints;
    const c = i % 3;
    if (c !== 0) {
        throw new Error(`i=${i}的点${linePoints[i]}不是路径点`);
    }
    if (i === 0) {
        // 第一个点
        if (linePoints.length > 4) {
            points = linePoints.slice(3);
        }
        else {
            console.error('不能移除:剩余点数不足');
        }
    }
    else if (i === linePoints.length - 1) {
        // 最后一个点
        if (linePoints.length > 4) {
            points = linePoints.slice(0, linePoints.length - 3);
        }
        else {
            console.error('无法移除:剩余点数不足');
        }
    }
    else {
        // 中间点
        points = linePoints.slice(0, i - 1);
        points.push(...linePoints.slice(i + 2));
    }
    if (points) {
        graphic.linePoints = points;
    }
}
/**
 * 清除路径点(只留端点),适用于直线和贝塞尔曲线
 * @param graphic
 * @param curve
 */
function clearWayPoint(graphic, curve) {
    const linePoints = graphic.linePoints;
    if (!curve) {
        if (linePoints.length > 2) {
            const points = linePoints.slice(0, 1);
            points.push(...linePoints.slice(-1));
            graphic.linePoints = points;
        }
    }
    else {
        if (linePoints.length > 4) {
            const points = linePoints.slice(0, 2);
            points.push(...linePoints.slice(-2));
            graphic.linePoints = points;
        }
    }
}
/**
 * 贝塞尔曲线编辑
 */
class BezierCurveEditPlugin extends LineEditPlugin {
    constructor(g, options) {
        super(g);
        Object.defineProperty(this, "options", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        // 曲线控制点辅助线
        Object.defineProperty(this, "auxiliaryLines", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
        this.options = Object.assign({}, { smooth: true }, options);
        this.name = BezierCurveEditPlugin.Name;
        this.initEditPoints();
    }
    reset() {
        this.auxiliaryLines.splice(0, this.auxiliaryLines.length);
        super.reset();
    }
    initEditPoints() {
        const cps = this.graphic.localToCanvasPoints(...this.linePoints);
        for (let i = 0; i < cps.length; i++) {
            const p = cps[i];
            const dp = new DraggablePoint(p);
            const startOrEnd = i == 0 || i == cps.length - 1;
            const c = i % 3;
            if (c === 1) {
                // 前一路径点的控制点
                dp.zIndex = 2;
                const fp = cps[i - 1];
                const line = new Graphics();
                this.drawAuxiliaryLine(line, fp, p);
                this.auxiliaryLines.push(line);
            }
            else if (c === 2) {
                // 后一路径点的控制点
                dp.zIndex = 3;
                const np = cps[i + 1];
                const line = new Graphics();
                this.drawAuxiliaryLine(line, p, np);
                this.auxiliaryLines.push(line);
            }
            dp.on('transforming', (e) => {
                const tlp = this.graphic.canvasToLocalPoint(dp.position);
                const cp = this.linePoints[i];
                cp.x = tlp.x;
                cp.y = tlp.y;
                if (this.options.smooth || this.options.symmetry) {
                    if (c === 0 && !startOrEnd) {
                        const shiftData = e.getData();
                        const fp = this.linePoints[i - 1];
                        const np = this.linePoints[i + 1];
                        fp.x = fp.x + shiftData.dx;
                        fp.y = fp.y + shiftData.dy;
                        np.x = np.x + shiftData.dx;
                        np.y = np.y + shiftData.dy;
                    }
                    else if (c === 1 && i !== 1) {
                        const bp = this.linePoints[i - 1];
                        const fp2 = this.linePoints[i - 2];
                        let mp;
                        if (this.options.symmetry) {
                            mp = calculateMirrorPoint(bp, cp);
                        }
                        else {
                            const distance = distance2(bp, fp2);
                            mp = calculateMirrorPoint(bp, cp, distance);
                        }
                        fp2.x = mp.x;
                        fp2.y = mp.y;
                    }
                    else if (c === 2 && i !== cps.length - 2) {
                        const bp = this.linePoints[i + 1];
                        const np2 = this.linePoints[i + 2];
                        let mp;
                        if (this.options.symmetry) {
                            mp = calculateMirrorPoint(bp, cp);
                        }
                        else {
                            const distance = distance2(bp, np2);
                            mp = calculateMirrorPoint(bp, cp, distance);
                        }
                        np2.x = mp.x;
                        np2.y = mp.y;
                    }
                }
                this.graphic.repaint();
            });
            if (this.options.onEditPointCreate) {
                this.options.onEditPointCreate(this.graphic, dp, i);
            }
            this.editedPoints.push(dp);
            if (this.auxiliaryLines.length > 0) {
                this.addChild(...this.auxiliaryLines);
            }
        }
        this.addChild(...this.editedPoints);
    }
    drawAuxiliaryLine(line, p1, p2) {
        line.clear();
        if (this.options.auxiliaryLineColor) {
            line.lineStyle(1, new Color(this.options.auxiliaryLineColor));
        }
        else {
            line.lineStyle(1, new Color('blue'));
        }
        line.moveTo(p1.x, p1.y);
        line.lineTo(p2.x, p2.y);
    }
    updateEditedPointsPosition() {
        const cps = this.graphic.localToCanvasPoints(...this.linePoints);
        if (cps.length === this.editedPoints.length) {
            for (let i = 0; i < cps.length; i++) {
                const cp = cps[i];
                this.editedPoints[i].position.copyFrom(cp);
                const c = i % 3;
                const d = Math.floor(i / 3);
                if (c === 1 || c === 2) {
                    const li = d * 2 + c - 1;
                    const line = this.auxiliaryLines[li];
                    if (c === 1) {
                        const fp = cps[i - 1];
                        this.drawAuxiliaryLine(line, fp, cp);
                    }
                    else {
                        const np = cps[i + 1];
                        this.drawAuxiliaryLine(line, cp, np);
                    }
                }
            }
        }
    }
}
Object.defineProperty(BezierCurveEditPlugin, "Name", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'bezier_curve_points_edit'
});

/* eslint-disable @typescript-eslint/no-explicit-any */
class ShiftData {
    constructor(startPosition, currentPosition, lastPosition) {
        /**
         * 起始位置
         */
        Object.defineProperty(this, "startPosition", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 上一次终点位置
         */
        Object.defineProperty(this, "lastPosition", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 当前位置
         */
        Object.defineProperty(this, "currentPosition", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.startPosition = startPosition;
        this.lastPosition = lastPosition;
        this.currentPosition = currentPosition;
    }
    static new(startPosition, currentPosition, lastPosition) {
        return new ShiftData(startPosition, currentPosition, lastPosition);
    }
    get dx() {
        if (!this.lastPosition || !this.currentPosition) {
            throw new Error('错误的位移数据或阶段');
        }
        return this.currentPosition.x - this.lastPosition.x;
    }
    get dy() {
        if (!this.lastPosition || !this.currentPosition) {
            throw new Error('错误的位移数据或阶段');
        }
        return this.currentPosition.y - this.lastPosition.y;
    }
    get dsx() {
        if (!this.currentPosition) {
            throw new Error('错误的位移数据或阶段');
        }
        return this.currentPosition.x - this.startPosition.x;
    }
    get dsy() {
        if (!this.currentPosition) {
            throw new Error('错误的位移数据或阶段');
        }
        return this.currentPosition.y - this.startPosition.y;
    }
}
class ScaleData {
    constructor(start, current, last) {
        Object.defineProperty(this, "start", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "current", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "last", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.start = start;
        this.current = current;
        this.last = last;
    }
    static new(start, current, last) {
        return new ScaleData(start, current, last);
    }
}
/**
 * 图形平移事件
 */
class GraphicTransformEvent {
    constructor(target, type, data) {
        /**
         * 图形对象
         */
        Object.defineProperty(this, "target", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "data", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.target = target;
        this.type = type;
        this.data = data;
    }
    getData() {
        return this.data;
    }
    static shift(target, data) {
        return new GraphicTransformEvent(target, 'shift', data);
    }
    static scale(target) {
        return new GraphicTransformEvent(target, 'scale', null);
    }
    static rotate(target) {
        return new GraphicTransformEvent(target, 'rotate', null);
    }
    static skew(target) {
        return new GraphicTransformEvent(target, 'skew', null);
    }
    isShift() {
        return this.type === 'shift';
    }
    isRotate() {
        return this.type === 'rotate';
    }
    isScale() {
        return this.type === 'scale';
    }
    isSkew() {
        return this.type === 'skew';
    }
}
class GraphicTransformPlugin extends InteractionPluginBase {
    constructor(app) {
        super(app, GraphicTransformPlugin.Name, InteractionPluginType.Other);
        /**
         * 可吸附位置列表
         */
        Object.defineProperty(this, "absorbablePositions", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "apContainer", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.apContainer = new Container();
        this.apContainer.name = GraphicTransformPlugin.AbsorbablePosisiontsName;
        this.app.canvas.addAssistantAppend(this.apContainer);
        app.on('options-update', (options) => {
            if (options.absorbablePositions) {
                this.absorbablePositions = this.filterAbsorbablePositions(options.absorbablePositions);
            }
        });
    }
    /**
     * 过滤重复的吸附位置
     * @param positions
     * @returns
     */
    filterAbsorbablePositions(positions) {
        const aps = [];
        for (let i = 0; i < positions.length; i++) {
            const ap1 = positions[i];
            let ap = ap1;
            for (let j = positions.length - 1; j > i; j--) {
                const ap2 = positions[j];
                if (ap.isOverlapping(ap2) && ap.compareTo(ap2) <= 0) {
                    ap = null;
                    break;
                }
            }
            if (ap != null) {
                aps.push(ap);
            }
        }
        return aps;
    }
    static new(app) {
        return new GraphicTransformPlugin(app);
    }
    bind() {
        this.app.on('drag_op_start', this.onDragStart, this);
        this.app.on('drag_op_move', this.onDragMove, this);
        this.app.on('drag_op_end', this.onDragEnd, this);
        this.app.on('graphicselectedchange', this.onGraphicSelectedChange, this);
        this.app.on('graphicchildselectedchange', this.onGraphicSelectedChange, this);
    }
    unbind() {
        this.app.off('drag_op_start', this.onDragStart, this);
        this.app.off('drag_op_move', this.onDragMove, this);
        this.app.off('drag_op_end', this.onDragEnd, this);
        this.app.off('graphicselectedchange', this.onGraphicSelectedChange, this);
        this.app.off('graphicchildselectedchange', this.onGraphicSelectedChange, this);
    }
    getDraggedTargets(e) {
        var _a;
        const targets = [];
        if (e.target.isGraphicChild() && e.target.selected && e.target.draggable) {
            const graphic = e.target.getGraphic();
            // 图形子元素
            recursiveChildren(graphic, (child) => {
                if (child.selected && child.draggable) {
                    targets.push(child);
                }
            });
        }
        else if ((e.target.isGraphic() || e.target.isGraphicChild()) &&
            ((_a = e.target.getGraphic()) === null || _a === void 0 ? void 0 : _a.draggable)) {
            // 图形对象
            targets.push(...this.app.selectedGraphics);
        }
        else if (e.target.draggable) {
            targets.push(e.target);
        }
        return targets;
    }
    onDragStart(e) {
        if (!e.target.isCanvas() && e.isLeftButton) {
            const targets = this.getDraggedTargets(e);
            if (targets.length > 0) {
                targets.forEach((target) => {
                    target.shiftStartPoint = target.position.clone();
                    target.emit('transformstart', GraphicTransformEvent.shift(target, ShiftData.new(target.shiftStartPoint)));
                });
                // 显示吸附图形
                if (this.absorbablePositions && this.absorbablePositions.length > 0) {
                    this.apContainer.removeChildren();
                    this.apContainer.addChild(...this.absorbablePositions);
                }
            }
        }
    }
    onDragMove(e) {
        if (!e.target.isCanvas() && e.isLeftButton) {
            const targets = this.getDraggedTargets(e);
            if (targets.length > 0) {
                // 处理位移
                targets.forEach((target) => {
                    if (target.shiftStartPoint) {
                        target.shiftLastPoint = target.position.clone();
                        const { dx, dy } = e.toTargetShiftLen(target.parent);
                        target.position.set(target.shiftStartPoint.x + dx, target.shiftStartPoint.y + dy);
                    }
                });
                // 处理吸附
                if (this.absorbablePositions) {
                    for (let i = 0; i < this.absorbablePositions.length; i++) {
                        const ap = this.absorbablePositions[i];
                        ap.tryAbsorb(...targets);
                    }
                }
                // const start = new Date().getTime();
                // 事件发布
                targets.forEach((target) => {
                    if (target.shiftStartPoint && target.shiftLastPoint) {
                        target.emit('transforming', GraphicTransformEvent.shift(target, ShiftData.new(target.shiftStartPoint, target.position.clone(), target.shiftLastPoint)));
                    }
                });
            }
        }
    }
    onDragEnd(e) {
        if (!e.target.isCanvas() && e.isLeftButton) {
            const targets = this.getDraggedTargets(e);
            targets.forEach((target) => {
                if (target.shiftStartPoint) {
                    target.emit('transformend', GraphicTransformEvent.shift(target, ShiftData.new(target.shiftStartPoint, target.position.clone())));
                }
                target.shiftStartPoint = null;
            });
        }
        this.clearCache();
    }
    /**
     * 清理缓存
     */
    clearCache() {
        // 移除吸附图形
        this.absorbablePositions = [];
        this.apContainer.removeChildren();
    }
    onGraphicSelectedChange(g, selected) {
        let br = g.getAssistantAppend(BoundsGraphic.Name);
        if (!br) {
            // 绘制辅助包围框
            br = new BoundsGraphic(g);
        }
        if (selected) {
            if (br) {
                br.redraw();
                br.visible = true;
            }
        }
        else {
            if (br) {
                br.visible = false;
            }
        }
        if (g.scalable || g.rotatable) {
            // 缩放点
            let sp = g.getAssistantAppend(TransformPoints.Name);
            if (!sp) {
                sp = new TransformPoints(g);
            }
            if (selected) {
                sp.update();
                sp.visible = true;
            }
            else {
                sp.visible = false;
            }
        }
    }
}
Object.defineProperty(GraphicTransformPlugin, "Name", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: '__graphic_transform_plugin'
});
Object.defineProperty(GraphicTransformPlugin, "AbsorbablePosisiontsName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: '__AbsorbablePosisionts'
});
/**
 * 缩放、旋转辅助
 */
class TransformPoints extends Container {
    constructor(obj) {
        super();
        Object.defineProperty(this, "obj", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "ltScalePoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "ltLocal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "tScalePoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "tLocal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "tCanvas", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "rtScalePoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "rtLocal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "rScalePoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "rLocal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "rbScalePoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "rbLocal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "bScalePoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "bLocal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "lbScalePoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "lbLocal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "lScalePoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "lLocal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "originScale", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        Object.defineProperty(this, "scalePivot", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Point()
        });
        /**
         * 旋转拖拽点
         */
        Object.defineProperty(this, "rotatePoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 旋转中心坐标
         */
        Object.defineProperty(this, "rotatePivot", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 起始旋转坐标
         */
        Object.defineProperty(this, "rotateLastPoint", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 起始图形角度
         */
        Object.defineProperty(this, "startAngle", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 0
        });
        /**
         * 当前角度信息文本辅助
         */
        Object.defineProperty(this, "angleAssistantText", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 旋转角度步长
         */
        Object.defineProperty(this, "angleStep", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 1
        });
        /**
         * 修改旋转步长键盘监听
         */
        Object.defineProperty(this, "rotateAngleStepKeyListeners", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
        this.obj = obj;
        this.name = TransformPoints.Name;
        this.angleAssistantText = new VectorText('', {
            fill: AppConsts.assistantElementColor,
        });
        this.angleAssistantText.setVectorFontSize(16);
        this.angleAssistantText.anchor.set(0.5);
        // 创建缩放拖拽点
        this.ltScalePoint = new DraggablePoint(new Point());
        this.ltScalePoint.name = TransformPoints.LeftTopName;
        this.addChild(this.ltScalePoint);
        this.tScalePoint = new DraggablePoint(new Point());
        this.tScalePoint.name = TransformPoints.TopName;
        this.addChild(this.tScalePoint);
        this.rtScalePoint = new DraggablePoint(new Point());
        this.rtScalePoint.name = TransformPoints.RightTopName;
        this.addChild(this.rtScalePoint);
        this.rScalePoint = new DraggablePoint(new Point());
        this.rScalePoint.name = TransformPoints.RightName;
        this.addChild(this.rScalePoint);
        this.rbScalePoint = new DraggablePoint(new Point());
        this.rbScalePoint.name = TransformPoints.RightBottomName;
        this.addChild(this.rbScalePoint);
        this.bScalePoint = new DraggablePoint(new Point());
        this.bScalePoint.name = TransformPoints.BottomName;
        this.addChild(this.bScalePoint);
        this.lbScalePoint = new DraggablePoint(new Point());
        this.lbScalePoint.name = TransformPoints.LeftBottomName;
        this.addChild(this.lbScalePoint);
        this.lScalePoint = new DraggablePoint(new Point());
        this.lScalePoint.name = TransformPoints.LeftName;
        this.addChild(this.lScalePoint);
        this.obj.on('transformstart', this.onObjTransformStart, this);
        this.obj.on('transformend', this.onObjTransformEnd, this);
        if (this.obj.children && this.obj.children.length > 0) {
            recursiveChildren(this.obj, (child) => {
                child.on('transformstart', this.onObjTransformStart, this);
                child.on('transformend', this.onObjTransformEnd, this);
            });
        }
        const pg = this.obj.getGraphic();
        if (pg != null) {
            pg.on('transformstart', this.onObjTransformStart, this);
            pg.on('transformend', this.onObjTransformEnd, this);
        }
        this.obj.on('repaint', this.onGraphicRepaint, this);
        this.children.forEach((dp) => {
            dp.on('transformstart', this.onScaleDragStart, this);
            dp.on('transforming', this.onScaleDragMove, this);
            dp.on('transformend', this.onScaleDragEnd, this);
        });
        // 创建旋转拖拽点
        this.rotatePoint = new DraggablePoint(new Point());
        this.addChild(this.rotatePoint);
        this.rotatePoint.on('transformstart', this.onRotateStart, this);
        this.rotatePoint.on('transforming', this.onRotateMove, this);
        this.rotatePoint.on('transformend', this.onRotateEnd, this);
        this.rotatePivot = new Point();
        this.rotateLastPoint = new Point();
        // 初始化旋转角度修改键盘监听器
        for (let i = 1; i < 10; i++) {
            this.rotateAngleStepKeyListeners.push(KeyListener.create({
                value: '' + i,
                onPress: () => {
                    this.angleStep = i;
                },
            }));
        }
        this.obj.addAssistantAppend(this);
    }
    onObjTransformStart() {
        this.visible = false;
    }
    onObjTransformEnd() {
        this.update();
        this.visible = true;
    }
    onGraphicRepaint() {
        if (this.visible) {
            this.update();
        }
    }
    /**
     * 旋转开始
     * @param de
     */
    onRotateStart(de) {
        this.hideAll();
        const assistantPoint = this.obj.localToCanvasPoint(this.obj.pivot);
        this.rotatePivot.copyFrom(assistantPoint);
        this.rotateLastPoint.copyFrom(de.target.position);
        this.startAngle = this.obj.angle;
        const app = this.obj.getGraphicApp();
        this.rotateAngleStepKeyListeners.forEach((listener) => app.addKeyboardListener(listener));
        this.obj.emit('transformstart', GraphicTransformEvent.rotate(this.obj));
        // app.emit('transformstart', app.selectedGraphics);
        this.obj.getCanvas().addAssistantAppends(this.angleAssistantText);
        this.updateAngleAssistantText(de);
    }
    updateAngleAssistantText(de) {
        var _a, _b, _c;
        this.angleAssistantText.text = this.obj.angle + '°';
        let cursorPoint = (_a = de.data) === null || _a === void 0 ? void 0 : _a.startPosition;
        if ((_b = de.data) === null || _b === void 0 ? void 0 : _b.currentPosition) {
            cursorPoint = (_c = de.data) === null || _c === void 0 ? void 0 : _c.currentPosition;
        }
        if (cursorPoint) {
            this.angleAssistantText.position.x = cursorPoint.x;
            this.angleAssistantText.position.y = cursorPoint.y - 10;
        }
    }
    /**
     * 旋转移动
     * @param de
     */
    onRotateMove(de) {
        // 旋转角度计算逻辑：取锚点y负方向一点作为旋转点，求旋转点和锚点所形成的直线与x轴角度，此角度+90°即为最终旋转角度，再将旋转角度限制到(-180,180]之间
        let angle = angleToAxisx(this.rotatePivot, de.target.position);
        angle = Math.floor(angle / this.angleStep) * this.angleStep;
        const parentAngle = this.obj.parent.worldAngle;
        angle = (angle + 90 - parentAngle) % 360;
        if (angle > 180) {
            angle = angle - 360;
        }
        this.obj.angle = angle;
        this.updateAngleAssistantText(de);
        // this.obj.emit('rotatemove', this.obj);
    }
    /**
     * 旋转结束
     * @param de
     */
    onRotateEnd() {
        this.showAll();
        this.obj.getCanvas().removeAssistantAppends(this.angleAssistantText);
        this.rotateAngleStepKeyListeners.forEach((listener) => this.obj.getGraphicApp().removeKeyboardListener(listener));
        this.obj.emit('transformend', GraphicTransformEvent.rotate(this.obj));
    }
    /**
     * 缩放开始
     */
    onScaleDragStart() {
        this.hideAll();
        const points = convertRectangleToPolygonPoints(this.obj.getLocalBounds());
        const p0 = points[0];
        const p1 = points[1];
        const p2 = points[2];
        const p3 = points[3];
        this.scalePivot = this.obj.pivot.clone();
        this.ltLocal.copyFrom(p0);
        this.tCanvas.copyFrom(this.obj.localToCanvasPoint(calculateLineMidpoint(p0, p1)));
        this.tLocal.copyFrom(calculateLineMidpoint(p0, p1));
        this.rtLocal.copyFrom(p1);
        this.rLocal.copyFrom(calculateLineMidpoint(p1, p2));
        this.rbLocal.copyFrom(p2);
        this.bLocal.copyFrom(calculateLineMidpoint(p2, p3));
        this.lbLocal.copyFrom(p3);
        this.lLocal.copyFrom(calculateLineMidpoint(p0, p3));
        this.originScale = this.obj.scale.clone();
        this.obj.emit('transformstart', GraphicTransformEvent.scale(this.obj));
    }
    onScaleDragMove(e) {
        // 缩放计算逻辑：共8个方向缩放点，根据所拖拽的方向:
        // 1,计算缩放为1时的此点在拖拽开始时的位置到锚点x、y距离，
        // 2,计算拖拽点的当前位置到锚点的x、y方向距离，
        // PS:以上两个计算都是在local（也就是图形对象本地）坐标系，
        // 用当前距离除以原始距离即为缩放比例
        const defaultScale = new Point(1, 1);
        let originWidth = 0;
        let originHeight = 0;
        let width = 0;
        let height = 0;
        this.obj.scale.copyFrom(defaultScale);
        const point = this.obj.toLocal(e.target.parent.localToScreenPoint(e.target.position));
        if (e.target === this.ltScalePoint) {
            // 左上角
            originWidth = Math.abs(this.ltLocal.x - this.scalePivot.x);
            originHeight = Math.abs(this.ltLocal.y - this.scalePivot.y);
            width = Math.abs(point.x - this.scalePivot.x);
            height = Math.abs(point.y - this.scalePivot.y);
        }
        else if (e.target == this.tScalePoint) {
            // 上
            originHeight = Math.abs(this.tLocal.y - this.scalePivot.y);
            height = Math.abs(point.y - this.scalePivot.y);
        }
        else if (e.target == this.rtScalePoint) {
            // 右上
            originWidth = Math.abs(this.rtLocal.x - this.scalePivot.x);
            originHeight = Math.abs(this.rtLocal.y - this.scalePivot.y);
            width = Math.abs(point.x - this.scalePivot.x);
            height = Math.abs(point.y - this.scalePivot.y);
        }
        else if (e.target == this.rScalePoint) {
            // 右
            originWidth = Math.abs(this.rLocal.x - this.scalePivot.x);
            width = Math.abs(point.x - this.scalePivot.x);
        }
        else if (e.target == this.rbScalePoint) {
            // 右下
            originWidth = Math.abs(this.rbLocal.x - this.scalePivot.x);
            originHeight = Math.abs(this.rbLocal.y - this.scalePivot.y);
            width = Math.abs(point.x - this.scalePivot.x);
            height = Math.abs(point.y - this.scalePivot.y);
        }
        else if (e.target == this.bScalePoint) {
            // 下
            originHeight = Math.abs(this.bLocal.y - this.scalePivot.y);
            height = Math.abs(point.y - this.scalePivot.y);
        }
        else if (e.target == this.lbScalePoint) {
            // 左下
            originWidth = Math.abs(this.lbLocal.x - this.scalePivot.x);
            originHeight = Math.abs(this.lbLocal.y - this.scalePivot.y);
            width = Math.abs(point.x - this.scalePivot.x);
            height = Math.abs(point.y - this.scalePivot.y);
        }
        else {
            // 左
            originWidth = Math.abs(this.lLocal.x - this.scalePivot.x);
            width = Math.abs(point.x - this.scalePivot.x);
        }
        // 计算缩放比例，并根据是否保持纵横比两种情况进行缩放处理
        const sx = originWidth == 0 ? this.originScale.x : width / originWidth;
        const sy = originHeight == 0 ? this.originScale.y : height / originHeight;
        if (this.obj.keepAspectRatio) {
            let max = Math.max(sx, sy);
            if (originWidth == 0) {
                max = sy;
            }
            else if (originHeight == 0) {
                max = sx;
            }
            this.obj.scale.set(max, max);
        }
        else {
            this.obj.scale.x = sx;
            this.obj.scale.y = sy;
        }
    }
    onScaleDragEnd() {
        this.showAll();
        this.obj.emit('transformend', GraphicTransformEvent.scale(this.obj));
    }
    hideOthers(dg) {
        this.children.forEach((child) => {
            if (child.name !== dg.name) {
                child.visible = false;
            }
        });
    }
    hideAll() {
        this.children.forEach((child) => (child.visible = false));
    }
    showAll() {
        this.update();
        this.children.forEach((child) => (child.visible = true));
    }
    getObjBounds() {
        const points = this.obj.localBoundsToCanvasPoints();
        const p0 = points[0];
        const p1 = points[1];
        const p3 = points[3];
        const width = distance(p0.x, p0.y, p1.x, p1.y);
        const height = distance(p0.x, p0.y, p3.x, p3.y);
        return { width, height };
    }
    /**
     * 更新位置和cursor
     * @returns
     */
    update() {
        if (this.obj.scalable) {
            this.updateScalePoints();
        }
        if (this.obj.rotatable) {
            this.updateRotatePoint();
        }
    }
    updateRotatePoint() {
        const rect = this.obj.getLocalBounds();
        const lp = this.obj.pivot.clone();
        const dy = 10 / this.obj.scale.y;
        lp.y = rect.y - dy;
        const p = this.obj.localToCanvasPoint(lp);
        this.rotatePoint.position.copyFrom(p);
    }
    updateScalePoints() {
        const points = this.obj.localBoundsToCanvasPoints();
        this.ltScalePoint.position.copyFrom(points[0]);
        this.tScalePoint.position.copyFrom(calculateLineMidpoint(points[0], points[1]));
        this.rtScalePoint.position.copyFrom(points[1]);
        this.rScalePoint.position.copyFrom(calculateLineMidpoint(points[1], points[2]));
        this.rbScalePoint.position.copyFrom(points[2]);
        this.bScalePoint.position.copyFrom(calculateLineMidpoint(points[2], points[3]));
        this.lbScalePoint.position.copyFrom(points[3]);
        this.lScalePoint.position.copyFrom(calculateLineMidpoint(points[3], points[0]));
        const angle = this.obj.worldAngle;
        const angle360 = (360 + angle) % 360;
        if ((angle >= -22.5 && angle <= 22.5) ||
            (angle360 >= 180 - 22.5 && angle360 <= 180 + 22.5)) {
            this.ltScalePoint.cursor = 'nw-resize';
            this.tScalePoint.cursor = 'n-resize';
            this.rtScalePoint.cursor = 'ne-resize';
            this.rScalePoint.cursor = 'e-resize';
            this.rbScalePoint.cursor = 'se-resize';
            this.bScalePoint.cursor = 's-resize';
            this.lbScalePoint.cursor = 'sw-resize';
            this.lScalePoint.cursor = 'w-resize';
        }
        else if ((angle >= 22.5 && angle <= 67.5) ||
            (angle360 >= 180 + 22.5 && angle360 <= 180 + 67.5)) {
            this.ltScalePoint.cursor = 'n-resize';
            this.tScalePoint.cursor = 'ne-resize';
            this.rtScalePoint.cursor = 'e-resize';
            this.rScalePoint.cursor = 'se-resize';
            this.rbScalePoint.cursor = 's-resize';
            this.bScalePoint.cursor = 'sw-resize';
            this.lbScalePoint.cursor = 'w-resize';
            this.lScalePoint.cursor = 'nw-resize';
        }
        else if ((angle >= 67.5 && angle < 112.5) ||
            (angle360 >= 180 + 67.5 && angle360 <= 180 + 112.5)) {
            this.ltScalePoint.cursor = 'ne-resize';
            this.tScalePoint.cursor = 'e-resize';
            this.rtScalePoint.cursor = 'se-resize';
            this.rScalePoint.cursor = 's-resize';
            this.rbScalePoint.cursor = 'sw-resize';
            this.bScalePoint.cursor = 'w-resize';
            this.lbScalePoint.cursor = 'nw-resize';
            this.lScalePoint.cursor = 'n-resize';
        }
        else {
            this.ltScalePoint.cursor = 'e-resize';
            this.tScalePoint.cursor = 'se-resize';
            this.rtScalePoint.cursor = 's-resize';
            this.rScalePoint.cursor = 'sw-resize';
            this.rbScalePoint.cursor = 'w-resize';
            this.bScalePoint.cursor = 'nw-resize';
            this.lbScalePoint.cursor = 'n-resize';
            this.lScalePoint.cursor = 'ne-resize';
        }
    }
}
Object.defineProperty(TransformPoints, "Name", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'transformPoints'
});
Object.defineProperty(TransformPoints, "MinLength", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 40
});
Object.defineProperty(TransformPoints, "LeftTopName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'lt-scale-point'
});
Object.defineProperty(TransformPoints, "TopName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 't-scale-point'
});
Object.defineProperty(TransformPoints, "RightTopName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'rt-scale-point'
});
Object.defineProperty(TransformPoints, "RightName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'r-scale-point'
});
Object.defineProperty(TransformPoints, "RightBottomName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'rb-scale-point'
});
Object.defineProperty(TransformPoints, "BottomName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'b-scale-point'
});
Object.defineProperty(TransformPoints, "LeftBottomName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'lb-scale-point'
});
Object.defineProperty(TransformPoints, "LeftName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'l-scale-point'
});
Object.defineProperty(TransformPoints, "RotateName", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: 'rotate-point'
});
/**
 * 包围盒矩形图形，现使用外边框转画布多边形实现
 */
class BoundsGraphic extends Graphics {
    constructor(graphic) {
        super();
        Object.defineProperty(this, "obj", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "debouncedRedraw", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.obj = graphic;
        this.name = BoundsGraphic.Name;
        this.visible = false;
        this.debouncedRedraw = debounce(this.doRedraw, 50);
        this.obj.on('transformstart', this.onObjTransformStart, this);
        this.obj.on('transformend', this.onObjTransformEnd, this);
        if (this.obj.children && this.obj.children.length > 0) {
            recursiveChildren(this.obj, (child) => {
                child.on('transformstart', this.onObjTransformStart, this);
                child.on('transformend', this.onObjTransformEnd, this);
            });
        }
        const pg = this.obj.getGraphic();
        if (pg != null) {
            pg.on('transformstart', this.onObjTransformStart, this);
            pg.on('transformend', this.onObjTransformEnd, this);
        }
        this.obj.on('repaint', this.onGraphicRepaint, this);
        graphic.addAssistantAppend(this);
    }
    onObjTransformStart() {
        this.visible = false;
    }
    onObjTransformEnd() {
        this.redraw();
        this.visible = true;
    }
    onGraphicRepaint() {
        if (this.visible) {
            this.redraw();
        }
    }
    destroy(options) {
        if (this.obj.isGraphic()) {
            this.obj.off('repaint', this.onGraphicRepaint, this);
        }
        super.destroy(options);
    }
    redraw() {
        this.debouncedRedraw(this);
    }
    doRedraw() {
        const visible = this.visible;
        this.visible = false; // 屏蔽包围框本身
        const bounds = new Polygon(this.obj.localBoundsToCanvasPoints());
        this.clear().lineStyle(BoundsGraphic.BoundsLineStyle).drawShape(bounds);
        this.visible = visible;
    }
}
Object.defineProperty(BoundsGraphic, "Name", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: '_BoundsRect'
});
Object.defineProperty(BoundsGraphic, "BoundsLineStyle", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: {
        width: 1,
        color: '#1976d2',
        alpha: 1,
    }
});

/**
 * 操作
 */
class JlOperation {
    constructor(app, type) {
        Object.defineProperty(this, "type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 操作类型/名称
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "obj", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 操作对象
        Object.defineProperty(this, "data", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 操作数据
        Object.defineProperty(this, "description", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: ''
        }); // 操作描述
        this.app = app;
        this.type = type;
    }
    undo1() {
        const updates = this.undo();
        if (updates) {
            this.app.updateSelected(...updates);
        }
    }
    redo1() {
        const updates = this.redo();
        if (updates) {
            this.app.updateSelected(...updates);
        }
    }
}
/**
 * 操作记录
 */
class OperationRecord {
    constructor(maxLen = 100) {
        Object.defineProperty(this, "undoStack", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
        Object.defineProperty(this, "redoStack", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
        Object.defineProperty(this, "maxLen", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.maxLen = maxLen;
    }
    get hasUndo() {
        return this.undoStack.length > 0;
    }
    get hasRedo() {
        return this.redoStack.length > 0;
    }
    setMaxLen(v) {
        this.maxLen = v;
        const len = this.undoStack.length;
        if (len > v) {
            const removeCount = len - v;
            this.undoStack.splice(0, removeCount);
        }
    }
    /**
     * 记录
     * @param op
     */
    record(op) {
        if (this.undoStack.length >= this.maxLen) {
            this.undoStack.shift();
        }
        this.undoStack.push(op);
        this.redoStack.splice(0, this.redoStack.length);
    }
    /**
     * 撤销
     */
    undo() {
        const op = this.undoStack.pop();
        if (op) {
            op.undo1();
            this.redoStack.push(op);
        }
    }
    /**
     * 重做
     */
    redo() {
        const op = this.redoStack.pop();
        if (op) {
            op.redo1();
            this.undoStack.push(op);
        }
    }
}

/**
 * 更新画布操作
 */
class UpdateCanvasOperation extends JlOperation {
    constructor(app, obj, old, data) {
        super(app, 'update-canvas');
        Object.defineProperty(this, "obj", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "old", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "data", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "description", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: ''
        });
        this.app = app;
        this.obj = obj;
        this.old = old;
        this.data = data;
    }
    undo() {
        this.obj.update(this.old);
        return [];
    }
    redo() {
        this.obj.update(this.data);
        return [];
    }
}
/**
 * 创建图形操作
 */
class GraphicCreateOperation extends JlOperation {
    constructor(app, obj) {
        super(app, 'graphic-create');
        Object.defineProperty(this, "obj", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "description", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: ''
        });
        this.app = app;
        this.obj = obj;
    }
    undo() {
        this.app.deleteGraphics(...this.obj);
    }
    redo() {
        this.app.addGraphics(...this.obj);
        return this.obj;
    }
}
/**
 * 删除图形操作
 */
class GraphicDeleteOperation extends JlOperation {
    constructor(app, obj) {
        super(app, 'graphic-delete');
        Object.defineProperty(this, "obj", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.app = app;
        this.obj = obj;
    }
    undo() {
        this.app.addGraphics(...this.obj);
        return this.obj;
    }
    redo() {
        this.app.deleteGraphics(...this.obj);
    }
}
class GraphicDataUpdateOperation extends JlOperation {
    constructor(app, obj, oldData, newData) {
        super(app, 'graphic-drag');
        Object.defineProperty(this, "obj", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "oldData", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "newData", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.obj = [...obj];
        this.oldData = oldData;
        this.newData = newData;
    }
    undo() {
        for (let i = 0; i < this.obj.length; i++) {
            const g = this.obj[i];
            // g.exitChildEdit();
            g.updateData(this.oldData[i]);
        }
        return this.obj;
    }
    redo() {
        for (let i = 0; i < this.obj.length; i++) {
            const g = this.obj[i];
            // g.exitChildEdit();
            g.updateData(this.newData[i]);
        }
        return this.obj;
    }
}

/******************************************************************************
Copyright (c) Microsoft Corporation.

Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.

THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
/* global Reflect, Promise, SuppressedError, Symbol */


function __awaiter(thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
}

typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
    var e = new Error(message);
    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
};

/**
 * 图形关系数据
 */
class GraphicRelationParam {
    constructor(g, param = null) {
        Object.defineProperty(this, "g", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "param", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.g = g;
        this.param = param;
    }
    isTheGraphic(g) {
        return this.g.id === g.id;
    }
    getGraphic() {
        return this.g;
    }
    getParam() {
        return this.param;
    }
    equals(other) {
        return this.isTheGraphic(other.g) && this.param === other.param;
    }
}
/**
 * 图形关系
 */
class GraphicRelation {
    constructor(rp1, rp2) {
        Object.defineProperty(this, "rp1", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "rp2", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.rp1 = rp1;
        this.rp2 = rp2;
    }
    contains(g) {
        return this.rp1.isTheGraphic(g) || this.rp2.isTheGraphic(g);
    }
    /**
     * 获取给定图形的关系参数
     * @param g
     * @returns
     */
    getRelationParam(g) {
        if (!this.contains(g)) {
            throw new Error(`图形关系${this.rp1.g.id}-${this.rp2.g.id}中不包含给定图形${g.id}`);
        }
        if (this.rp1.isTheGraphic(g)) {
            return this.rp1;
        }
        else {
            return this.rp2;
        }
    }
    /**
     * 获取关联的另一个图形的关系参数
     * @param g
     * @returns
     */
    getOtherRelationParam(g) {
        if (!this.contains(g)) {
            throw new Error(`图形关系${this.rp1.g.id}-${this.rp2.g.id}中不包含给定图形${g.id}`);
        }
        if (this.rp1.isTheGraphic(g)) {
            return this.rp2;
        }
        else {
            return this.rp1;
        }
    }
    /**
     * 获取关联的另一个图形对象
     * @param g
     * @returns graphic
     */
    getOtherGraphic(g) {
        return this.getOtherRelationParam(g).g;
    }
    equals(orp1, orp2) {
        if (this.rp1.isTheGraphic(orp1.g)) {
            return this.rp1.equals(orp1) && this.rp2.equals(orp2);
        }
        else if (this.rp1.isTheGraphic(orp2.g)) {
            return this.rp1.equals(orp2) && this.rp2.equals(orp1);
        }
        return false;
    }
    isEqualOther(other) {
        return this.equals(other.rp1, other.rp2);
    }
}
/**
 * 图形关系管理
 */
class RelationManage {
    constructor() {
        Object.defineProperty(this, "relations", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
    }
    isContainsRelation(rp1, rp2) {
        const relation = this.relations.find((relation) => relation.equals(rp1, rp2));
        return !!relation;
    }
    addRelation(rp1, rp2) {
        if (!(rp1 instanceof GraphicRelationParam)) {
            rp1 = new GraphicRelationParam(rp1);
        }
        if (!(rp2 instanceof GraphicRelationParam)) {
            rp2 = new GraphicRelationParam(rp2);
        }
        if (!this.isContainsRelation(rp1, rp2)) {
            const relation = new GraphicRelation(rp1, rp2);
            this.relations.push(relation);
        }
    }
    /**
     * 获取图形的所有关系
     * @param g
     * @returns
     */
    getRelationsOfGraphic(g) {
        return this.relations.filter((rl) => rl.contains(g));
    }
    /**
     * 获取指定图形的指定关系图形类型的所有关系
     * @param g 指定图形
     * @param type 关联图形的类型
     * @returns
     */
    getRelationsOfGraphicAndOtherType(g, type) {
        return this.relations.filter((rl) => rl.contains(g) && rl.getOtherGraphic(g).type === type);
    }
    /**
     * 删除关系
     * @param relation
     */
    deleteRelation(relation) {
        const index = this.relations.findIndex((rl) => rl.isEqualOther(relation));
        if (index >= 0) {
            this.relations.splice(index, 1);
        }
    }
    /**
     * 删除指定图形的所有关系
     * @param g
     */
    deleteRelationOfGraphic(g) {
        const relations = this.getRelationsOfGraphic(g);
        relations.forEach((rl) => this.deleteRelation(rl));
    }
    /**
     * 删除指定图形的所有关系
     * @param g
     */
    deleteRelationOfGraphicAndOtherType(g, type) {
        const relations = this.getRelationsOfGraphicAndOtherType(g, type);
        relations.forEach((rl) => this.deleteRelation(rl));
    }
    /**
     * 清空
     */
    clear() {
        this.relations.splice(0, this.relations.length);
    }
}

/**
 * 图形存储
 */
class GraphicStore {
    constructor() {
        Object.defineProperty(this, "store", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "relationManage", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.store = new Map();
        this.relationManage = new RelationManage();
    }
    /**
     * 获取所有图形对象
     */
    getAllGraphics() {
        return [...this.store.values()];
    }
    queryById(id) {
        const graphic = this.store.get(id);
        if (!graphic)
            throw Error(`未找到id为 [${id}] 的图形.`);
        return this.store.get(id);
    }
    queryByIdAmbiguous(id) {
        const list = [];
        this.store.forEach((g) => {
            if (g.id.search(id) >= 0) {
                list.push(g);
            }
        });
        return list;
    }
    queryByType(type) {
        const list = [];
        this.store.forEach((g) => {
            if (g.type === type) {
                list.push(g);
            }
        });
        return list;
    }
    queryByCode(code) {
        const list = [];
        this.store.forEach((g) => {
            if (g.code === code) {
                list.push(g);
            }
        });
        return list;
    }
    queryByCodeAmbiguous(code) {
        const list = [];
        this.store.forEach((g) => {
            if (g.code.search(code) >= 0) {
                list.push(g);
            }
        });
        return list;
    }
    queryByIdOrCode(s) {
        const list = [];
        this.store.forEach((g) => {
            if (g.isIdOrCode(s)) {
                list.push(g);
            }
        });
        return list;
    }
    queryByIdOrCodeAndType(s, type) {
        const list = [];
        this.store.forEach((g) => {
            if (g.isIdOrCode(s) && g.type === type) {
                list.push(g);
            }
        });
        return list;
    }
    queryByCodeAndType(code, type) {
        for (const item of this.store.values()) {
            if (item.code === code && item.type === type) {
                return item;
            }
        }
    }
    queryByCodeAndTypeAmbiguous(code, type) {
        const list = [];
        this.store.forEach((g) => {
            if (g.type === type && g.code.search(code) >= 0) {
                list.push(g);
            }
        });
        return list;
    }
    /**
     * 存储图形对象
     * @param graphics 要存储的图形
     */
    storeGraphics(graphic) {
        if (!graphic.id || graphic.id.trim() === '') {
            throw new Error(`存储图形对象异常: id为空, ${graphic}`);
        }
        if (this.store.has(graphic.id)) {
            // 已经存在
            const exist = this.store.get(graphic.id);
            console.error(`已经存在id=${graphic.id}的设备${exist}`);
            return false;
        }
        else {
            this.store.set(graphic.id, graphic);
            graphic.queryStore = this;
            graphic.relationManage = this.relationManage;
            return true;
        }
    }
    /**
     * 删除图形
     * @param graph 要删除的图形
     */
    deleteGraphics(graphic) {
        const id = graphic.id;
        const remove = this.store.get(id);
        if (remove) {
            this.store.delete(id);
            // 删除图形关系
            this.relationManage.deleteRelationOfGraphic(remove);
        }
        return remove;
    }
    /**
     * 清空
     */
    clear() {
        this.relationManage.clear();
        this.store.clear();
    }
}

//基础图形对象扩展
DisplayObject.prototype._selectable = false; //是否可选中
DisplayObject.prototype._selected = false;
DisplayObject.prototype._childEdit = false;
DisplayObject.prototype._transformSave = false;
DisplayObject.prototype._assistantAppendMap = null;
DisplayObject.prototype._draggable = false;
DisplayObject.prototype._shiftStartPoint = null;
DisplayObject.prototype._shiftLastPoint = null;
DisplayObject.prototype._scalable = false;
DisplayObject.prototype._keepAspectRatio = true;
DisplayObject.prototype._rotatable = false;
Object.defineProperties(DisplayObject.prototype, {
    assistantAppendMap: {
        get() {
            if (this._assistantAppendMap == null) {
                this._assistantAppendMap = new Map();
            }
            return this._assistantAppendMap;
        },
    },
    selectable: {
        get() {
            return this._selectable;
        },
        set(value) {
            this._selectable = value;
        },
    },
    selected: {
        get() {
            return this._selected;
        },
        set(v) {
            this._selected = v;
        },
    },
    childEdit: {
        get() {
            return this._childEdit;
        },
        set(v) {
            this._childEdit = v;
        },
    },
    transformSave: {
        get() {
            return this._transformSave;
        },
        set(v) {
            this._transformSave = v;
        },
    },
    draggable: {
        get() {
            return this._draggable;
        },
        set(v) {
            this._draggable = v;
        },
    },
    shiftStartPoint: {
        get() {
            return this._shiftStartPoint;
        },
        set(v) {
            this._shiftStartPoint = v;
        },
    },
    shiftLastPoint: {
        get() {
            return this._shiftLastPoint;
        },
        set(v) {
            this._shiftLastPoint = v;
        },
    },
    scalable: {
        get() {
            return this._scalable;
        },
        set(v) {
            this._scalable = v;
        },
    },
    keepAspectRatio: {
        get() {
            return this._keepAspectRatio;
        },
        set(v) {
            this._keepAspectRatio = v;
        },
    },
    rotatable: {
        get() {
            return this._rotatable;
        },
        set(v) {
            this._rotatable = v;
        },
    },
    worldAngle: {
        get() {
            let angle = this.angle;
            let parent = this.parent;
            while (parent != undefined && parent != null) {
                angle += parent.angle;
                parent = parent.parent;
            }
            angle = angle % 360;
            if (angle > 180) {
                angle = angle - 360;
            }
            return angle;
        },
    },
});
DisplayObject.prototype.getAllParentScaled =
    function getAllParentScaled() {
        const scaled = new Point(1, 1);
        recursiveParents(this, (parent) => {
            scaled.x *= parent.scale.x;
            scaled.y *= parent.scale.y;
        });
        return scaled;
    };
DisplayObject.prototype.getPositionOnCanvas =
    function getPositionOnCanvas() {
        if (this.parent.isCanvas()) {
            return this.position;
        }
        else {
            return this.parent.localToCanvasPoint(this.position);
        }
    };
DisplayObject.prototype.updatePositionByCanvasPosition =
    function updatePositionByCanvasPosition(p) {
        if (this.parent.isCanvas()) {
            this.position.copyFrom(p);
        }
        else {
            const localPosition = this.parent.canvasToLocalPoint(p);
            this.position.copyFrom(localPosition);
        }
    };
DisplayObject.prototype.saveTransform = function saveTransform() {
    return GraphicTransform.fromObject(this);
};
DisplayObject.prototype.loadTransform = function loadTransform(transfrom) {
    this.position.copyFrom(transfrom.position);
    this.scale.copyFrom(transfrom.scale);
    this.rotation = transfrom.rotation;
    this.skew.copyFrom(transfrom.skew);
};
DisplayObject.prototype.isChild = function isChild(obj) {
    return recursiveFindChild(this, (child) => child == obj) != null;
};
DisplayObject.prototype.isParent = function isParent(obj) {
    return recursiveFindParent(this, (parent) => parent == obj) != null;
};
DisplayObject.prototype.isAssistantAppend =
    function isAssistantAppend() {
        return (recursiveFindParent(this, (parent) => {
            return parent.name === AppConsts.AssistantAppendsName;
        }) != null);
    };
DisplayObject.prototype.addAssistantAppend = function addAssistantAppend(...appends) {
    appends.forEach((append) => {
        if (append.name == null || append.name.trim() == '') {
            throw new Error('辅助附加name不能为空');
        }
        this.assistantAppendMap.set(append.name, append);
        this.getCanvas().addAssistantAppends(append);
    });
};
DisplayObject.prototype.getAssistantAppend = function getAssistantAppend(name) {
    return this.assistantAppendMap.get(name);
};
DisplayObject.prototype.removeAssistantAppend = function removeAssistantAppend(...appends) {
    appends.forEach((append) => {
        if (append.name) {
            this.removeAssistantAppendByName(append.name);
        }
    });
};
DisplayObject.prototype.removeAssistantAppendByName =
    function removeAssistantAppendByName(...names) {
        names.forEach((name) => {
            const append = this.getAssistantAppend(name);
            if (append) {
                this.getCanvas().removeAssistantAppends(append);
                this.assistantAppendMap.delete(name);
                append.destroy();
            }
        });
    };
DisplayObject.prototype.removeAllAssistantAppend =
    function removeAllAssistantAppend() {
        if (this._assistantAppendMap != null) {
            this.assistantAppendMap.forEach((append) => {
                append.getCanvas().removeAssistantAppends(append);
            });
            this.assistantAppendMap.clear();
        }
    };
DisplayObject.prototype.isGraphic = function isGraphic() {
    return Object.hasOwn(this, '__JlGraphic');
};
DisplayObject.prototype.getGraphic = function getGraphic() {
    let graphic = this;
    while (graphic && !Object.hasOwn(graphic, '__JlGraphic')) {
        graphic = graphic.parent;
    }
    if (graphic) {
        return graphic;
    }
    return null;
};
DisplayObject.prototype.isGraphicChild = function isGraphicChild() {
    const g = this.getGraphic();
    return g != null && !this.isAssistantAppend() && g.isChild(this);
};
DisplayObject.prototype.onAddToCanvas = function onAddToCanvas(_canvas) { };
DisplayObject.prototype.onRemoveFromCanvas = function onRemoveFromCanvas(_canvas) { };
DisplayObject.prototype.isInCanvas = function isInCanvas() {
    let graphic = this;
    while (graphic && !Object.hasOwn(graphic, '__JlCanvas')) {
        graphic = graphic.parent;
    }
    if (graphic) {
        return true;
    }
    return false;
};
DisplayObject.prototype.getCanvas = function getCanvas() {
    let graphic = this;
    while (graphic && !Object.hasOwn(graphic, '__JlCanvas')) {
        graphic = graphic.parent;
    }
    if (graphic) {
        return graphic;
    }
    throw new Error(`图形${this.name}不在画布中`);
};
DisplayObject.prototype.isCanvas = function isCanvas() {
    return Object.hasOwn(this, '__JlCanvas');
};
DisplayObject.prototype.getViewport = function getViewport() {
    const canvas = this.getCanvas();
    return canvas.parent;
};
DisplayObject.prototype.getGraphicApp = function getGraphicApp() {
    const canvas = this.getCanvas();
    return canvas.scene.app;
};
DisplayObject.prototype.localToCanvasPoint = function localToCanvasPoint(p) {
    return this.getViewport().toWorld(this.toGlobal(p));
};
DisplayObject.prototype.localToCanvasPoints = function localToCanvasPoints(...points) {
    return points.map((p) => this.localToCanvasPoint(p));
};
DisplayObject.prototype.canvasToLocalPoint = function canvasToLocalPoint(p) {
    return this.toLocal(this.getViewport().toScreen(p));
};
DisplayObject.prototype.canvasToLocalPoints = function canvasToLocalPoints(...points) {
    return points.map((p) => this.canvasToLocalPoint(p));
};
DisplayObject.prototype.localToScreenPoint = function localToScreenPoint(p) {
    return this.toGlobal(p);
};
DisplayObject.prototype.localToScreenPoints = function localToScreenPoints(...points) {
    return points.map((p) => this.toGlobal(p));
};
DisplayObject.prototype.screenToLocalPoint = function screenToLocalPoint(p) {
    return this.toLocal(p);
};
DisplayObject.prototype.screenToLocalPoints = function screenToLocalPoints(...points) {
    return points.map((p) => this.toLocal(p));
};
DisplayObject.prototype.localBoundsToCanvasPoints =
    function localBoundsToCanvasPoints() {
        const rect = this.getLocalBounds();
        const pps = convertRectangleToPolygonPoints(rect);
        return this.localToCanvasPoints(...pps);
    };
// 扩展pixijs图形对象，添加自定义绘制贝塞尔曲线，可自定义分段数
Graphics.prototype.drawBezierCurve = function drawBezierCurve(p1, p2, cp1, cp2, segmentsCount) {
    const fromX = p1.x;
    const fromY = p1.y;
    const n = segmentsCount;
    let dt = 0;
    let dt2 = 0;
    let dt3 = 0;
    let t2 = 0;
    let t3 = 0;
    const cpX = cp1.x;
    const cpY = cp1.y;
    const cpX2 = cp2.x;
    const cpY2 = cp2.y;
    const toX = p2.x;
    const toY = p2.y;
    this.moveTo(p1.x, p1.y);
    for (let i = 1, j = 0; i <= n; ++i) {
        j = i / n;
        dt = 1 - j;
        dt2 = dt * dt;
        dt3 = dt2 * dt;
        t2 = j * j;
        t3 = t2 * j;
        const px = dt3 * fromX + 3 * dt2 * j * cpX + 3 * dt * t2 * cpX2 + t3 * toX;
        const py = dt3 * fromY + 3 * dt2 * j * cpY + 3 * dt * t2 * cpY2 + t3 * toY;
        this.lineTo(px, py);
    }
    return this;
};
/**
 * 图形变换数据
 */
class GraphicTransform {
    constructor(position, scale, rotation, skew) {
        Object.defineProperty(this, "position", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "scale", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "rotation", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "skew", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.position = position;
        this.scale = scale;
        this.rotation = rotation;
        this.skew = skew;
    }
    static default() {
        return new GraphicTransform(new Point(0, 0), new Point(1, 1), 0, new Point(0, 0));
    }
    static fromObject(obj) {
        return new GraphicTransform(obj.position.clone(), obj.scale.clone(), obj.rotation, obj.skew.clone());
    }
    static from(transform) {
        if (transform) {
            return new GraphicTransform(new Point(transform.position.x, transform.position.y), new Point(transform.scale.x, transform.scale.y), transform.rotation, new Point(transform.skew.x, transform.skew.y));
        }
        return GraphicTransform.default();
    }
}
/**
 * 图形子元素变换
 */
class ChildTransform {
    constructor(name, transform) {
        Object.defineProperty(this, "name", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "transform", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.name = name;
        this.transform = transform;
    }
    static fromChild(child) {
        var _a;
        if (child.name == null ||
            child.name == undefined ||
            child.name.trim() == '') {
            throw new Error(`图形type=${(_a = child.getGraphic()) === null || _a === void 0 ? void 0 : _a.type}的子元素${child}name为空，但设置为需要保存变换数据`);
        }
        return new ChildTransform(child.name, GraphicTransform.fromObject(child));
    }
    static from(ct) {
        return new ChildTransform(ct.name, GraphicTransform.from(ct.transform));
    }
}
class GraphicAnimation {
    constructor(options) {
        Object.defineProperty(this, "options", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "_running", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 倍速
         */
        Object.defineProperty(this, "_xSpeed", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.options = options;
        this._running = false;
        this._xSpeed = 1;
    }
    static init(options) {
        return new GraphicAnimation(options);
    }
    pause() {
        this._running = false;
        return this;
    }
    resume() {
        this._running = true;
        return this;
    }
    get name() {
        return this.options.name;
    }
    get running() {
        return this._running;
    }
    get xSpeed() {
        return this._xSpeed;
    }
    set xSpeed(v) {
        this._xSpeed = v;
    }
    run(dt) {
        if (this.options.run) {
            this.options.run(dt * this.xSpeed);
        }
        return this;
    }
}
/**
 * 图形对象基类
 */
class JlGraphic extends Container {
    constructor(type) {
        super();
        Object.defineProperty(this, "__JlGraphic", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: true
        });
        Object.defineProperty(this, "type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 图形类型
        Object.defineProperty(this, "_id", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: ''
        }); // 图形的唯一标识，不具有业务意义，唯一，不可重复,可用做图形数据关联。
        Object.defineProperty(this, "_code", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: ''
        }); // 业务编号/名称，用于标识图形对象，具有业务意义
        Object.defineProperty(this, "_datas", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 图形数据
        Object.defineProperty(this, "_states", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 图形状态数据
        Object.defineProperty(this, "_relationManage", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 图形关系管理
        Object.defineProperty(this, "_queryStore", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 图形对象查询仓库
        this.type = type;
        this.draggable = false;
        this.filters;
    }
    /**
     * 添加图形动画，只有在画布上才能添加
     * @param animation
     */
    addAnimation(animation) {
        const app = this.getGraphicApp();
        app.animationManager.registerAnimation(this, animation);
    }
    removeAnimation(name) {
        const app = this.getGraphicApp();
        app.animationManager.unregisterAnimation(this, name);
    }
    animation(name) {
        const app = this.getGraphicApp();
        return app.animationManager.animation(this, name);
    }
    removeAllAnimation() {
        const app = this.getGraphicApp();
        app.animationManager.unregisterGraphicAnimations(this);
    }
    /**
     * 更新选中状态
     * @param selected
     * @returns 是否更新
     */
    updateSelected(selected) {
        if (this.selected !== selected) {
            this.selected = selected;
            this.fireSelected();
            return true;
        }
        return false;
    }
    invertSelected() {
        this.selected = !this.selected;
        this.fireSelected();
    }
    fireSelected() {
        if (this.selected) {
            this.emit('selected', this);
        }
        else {
            this.exitChildEdit();
            this.removeAllChildSelected();
            this.emit('unselected', this);
        }
        const app = this.getGraphicApp();
        if (app) {
            app.emit('graphicselectedchange', this, this.selected);
        }
    }
    hasSelectedChilds() {
        return (recursiveFindChild(this, (child) => {
            if (child.selected) {
                return true;
            }
            return false;
        }) != null);
    }
    setChildSelected(child) {
        if (child.isGraphicChild() && child.selectable) {
            this.removeAllChildSelected();
            child.selected = true;
            this.fireChildSelected(child);
        }
        return false;
    }
    invertChildSelected(child) {
        if (child.isGraphicChild() && child.selectable) {
            child.selected = !child.selected;
            this.fireChildSelected(child);
        }
        return false;
    }
    removeAllChildSelected() {
        recursiveChildren(this, (child) => {
            if (child.selected) {
                child.selected = false;
                this.fireChildSelected(child);
            }
        });
    }
    fireChildSelected(child) {
        const selected = child.selected;
        if (selected) {
            this.emit('childselected', child);
        }
        else {
            this.emit('childunselected', child);
        }
        const app = this.getGraphicApp();
        if (app) {
            app.emit('graphicchildselectedchange', child, selected);
        }
    }
    exitChildEdit() {
        this.childEdit = false;
        this.removeAllChildSelected();
    }
    /**
     * 是否此对象id/code
     */
    isIdOrCode(s) {
        return this.id === s || this.code === s;
    }
    /**
     * 获取图形id，如果图形数据对象存在，则返回图形数据对象id
     */
    get id() {
        if (this._datas) {
            return this._datas.id;
        }
        return this._id;
    }
    /**
     * 设置图形id，如果图形数据存在，则同时设置图形数据id
     */
    set id(v) {
        this._id = v;
        if (this._datas) {
            this._datas.id = v;
        }
    }
    /**
     * 获取图形业务code，如果业务code在图形数据或图形状态中，则需要重写此方法
     */
    get code() {
        return this._code;
    }
    /**
     * 设置图形业务code，如果业务code在图形数据或图形状态中，则需要重写此方法
     */
    set code(v) {
        this._code = v;
    }
    getDatas() {
        if (this._datas) {
            return this._datas;
        }
        throw new Error(`id=${this.id},type=${this.type}的图形没有数据`);
    }
    getStates() {
        if (this._states) {
            return this._states;
        }
        throw new Error(`id=${this.id},type=${this.type}的的图形没有状态`);
    }
    get queryStore() {
        if (this._queryStore) {
            return this._queryStore;
        }
        throw new Error(`type=${this.type}的图形没有QueryStore`);
    }
    set queryStore(v) {
        this._queryStore = v;
    }
    get relationManage() {
        if (this._relationManage) {
            return this._relationManage;
        }
        throw new Error(`type=${this.type}的图形没有关系管理`);
    }
    set relationManage(v) {
        this._relationManage = v;
    }
    /**
     * 构建图形关系
     * @param g
     */
    buildRelation() { }
    /**
     * 从数据加载恢复图形关系
     */
    loadRelations() { }
    /**
     * 获取当前图形的所有图形关系
     * @returns
     */
    getAllRelations() {
        return this.relationManage.getRelationsOfGraphic(this);
    }
    /**
     * 获取当前图形的所有指定类型图形关系
     * @param type
     * @returns
     */
    queryRelationByType(type) {
        return this.relationManage.getRelationsOfGraphicAndOtherType(this, type);
    }
    /**
     * 删除当前图形关联的指定类型的关系
     * @param type
     */
    deleteRelationByType(type) {
        this.relationManage.deleteRelationOfGraphicAndOtherType(this, type);
    }
    /**
     * 构建并保存关系数据到datas中
     */
    saveRelations() { }
    /**
     * 保存数据，复制，非原始数据
     * @returns
     */
    saveData() {
        this.getDatas().graphicType = this.type;
        this.getDatas().transform = GraphicTransform.fromObject(this);
        this.getDatas().childTransforms = this.buildChildTransforms();
        this.saveRelations();
        return this.getDatas().clone();
    }
    /**
     * 构建子元素变换列表
     * @returns
     */
    buildChildTransforms() {
        const childTransforms = [];
        recursiveChildren(this, (child) => {
            if (child.transformSave) {
                childTransforms.push(ChildTransform.fromChild(child));
            }
        });
        return childTransforms;
    }
    /**
     * 加载数据
     * @param data
     */
    loadData(data) {
        if (data.graphicType !== this.type) {
            throw new Error(`不同的图形类型,请检查数据是否正常: data.graphicType="${data.graphicType}, type="${this.type}`);
        }
        this._datas = data;
        this.loadTransformFrom(data);
    }
    loadTransformFrom(data) {
        if (data.transform) {
            this.loadTransform(data.transform);
        }
        if (data.childTransforms) {
            data.childTransforms.forEach((ct) => {
                const child = this.getChildByName(ct.name, true);
                if (child) {
                    child.loadTransform(ct.transform);
                }
            });
        }
    }
    /**
     * 更新图形数据
     * @param data
     * @returns
     */
    updateData(data) {
        let update = false;
        if (!this.getDatas().eq(data)) {
            update = true;
            const old = this.getDatas().clone();
            this.getDatas().copyFrom(data);
            this.onDataChange(data, old);
            this.loadTransformFrom(data);
            this.emit('dataupdate', this.getDatas(), old);
            this.repaint();
        }
        return update;
    }
    /**
     * 图形数据更新
     */
    onDataChange(newVal, old) { }
    /**
     * 加载状态
     * @param state
     */
    loadState(state) {
        if (state.graphicType !== this.type) {
            throw new Error(`不同的图形类型,请检查数据是否正常: state.graphicType="${state.graphicType}, type="${this.type}`);
        }
        this._states = state;
    }
    /**
     * 更新状态
     * @param state
     * @returns
     */
    updateStates(state) {
        let stateChange = false;
        if (!this.getStates().eq(state)) {
            // 判断并更新状态，默认状态
            const old = this.getStates().clone();
            this.getStates().copyFrom(state);
            this.onStateChange(state, old);
            stateChange = true;
            this.emit('stateupdate', this.getStates(), old);
            // this.repaint();
        }
        return stateChange;
    }
    /**
     * 图形状态更新处理
     */
    onStateChange(newVal, old) { }
    repaint() {
        try {
            this.doRepaint();
            this.emit('repaint', this);
        }
        catch (e) {
            console.error(`设备id=${this.id},type=${this.type}重绘逻辑异常`, e);
        }
    }
    /**
     * 处理删除逻辑
     */
    onDelete() {
        this.removeAllAssistantAppend();
        this.removeAllListeners();
        recursiveChildren(this, (child) => child.removeAllAssistantAppend());
    }
    /**
     * 框选检测,默认取图形包围盒判定,若需要精细判定-子类重写此方法
     * @param box
     * @returns
     */
    boxIntersectCheck(box) {
        return box.intersects(this.getLocalBounds(), this.localTransform);
    }
}
/**
 * 图形对象模板
 */
class JlGraphicTemplate {
    constructor(type, options) {
        Object.defineProperty(this, "type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "options", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.type = type;
        this.options = options;
    }
    get datas() {
        if (this.options.dataTemplate) {
            return this.options.dataTemplate.clone();
        }
        throw new Error(`type=${this.type}的图形模板没有数据模板`);
    }
    get states() {
        if (this.options.stateTemplate) {
            return this.options.stateTemplate.clone();
        }
        throw new Error(`type=${this.type}的图形模板没有状态模板`);
    }
    /**
     * 加载图形对象需要用到的资源
     */
    loadAssets() {
        return __awaiter(this, void 0, void 0, function* () { });
    }
    /**
     * 克隆图形对象
     * @param graphic
     * @returns
     */
    clone(graphic) {
        const g = this.new();
        if (graphic._datas) {
            // 数据克隆
            const datas = graphic.saveData();
            g.loadData(datas);
        }
        if (graphic._states) {
            // 状态克隆
            const state = graphic.getStates().clone();
            g.loadState(state);
        }
        g.id = GraphicIdGenerator.next();
        return g;
    }
}

/* eslint-disable @typescript-eslint/no-explicit-any */
class MessageClient extends EventEmitter {
    constructor(options) {
        super();
        Object.defineProperty(this, "options", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "subClients", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        }); // 订阅客户端
        this.options = options;
    }
    unsubscribe(destination) {
        this.unsubscribe0(destination);
        const idx = this.subClients.findIndex((cli) => cli.destination === destination);
        if (idx >= 0) {
            this.subClients.splice(idx, 1);
        }
    }
    getOrNewSubClient(destination) {
        let cli = this.subClients.find((cli) => cli.destination === destination);
        if (!cli) {
            // 不存在，新建
            cli = new SubscriptionClient(this, destination, this.options.protocol);
            this.subClients.push(cli);
        }
        return cli;
    }
    addSubscription(destination, handler) {
        const cli = this.getOrNewSubClient(destination);
        cli.addHandler(handler);
    }
    removeSubscription(destination, handle) {
        this.getOrNewSubClient(destination).removeHandler(handle);
    }
}
class SubscriptionClient {
    constructor(mc, destination, protocal) {
        Object.defineProperty(this, "mc", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "destination", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "protocol", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "handlers", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
        Object.defineProperty(this, "subscripted", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        this.mc = mc;
        this.destination = destination;
        this.protocol = protocal;
        this.mc.on('disconnected', this.onDisconnect, this);
        this.mc.on('connected', this.trySubscribe, this);
    }
    addHandler(handler) {
        if (this.handlers.filter((h) => h.App === handler.App).length == 0) {
            this.handlers.push(handler);
        }
        if (!this.subscripted) {
            this.trySubscribe();
        }
    }
    removeHandler(handler) {
        const idx = this.handlers.findIndex((h) => h.App === handler.App);
        if (idx >= 0) {
            this.handlers.splice(idx, 1);
        }
        if (this.handlers.length == 0) {
            console.log(`订阅${this.destination}没有消息监听处理,移除订阅`);
            this.unsubscribe();
        }
    }
    trySubscribe() {
        if (this.mc.connected) {
            this.subscripted = this.mc.subscribe(this.destination, (data) => {
                this.handleMessage(data);
            });
        }
    }
    unsubscribe() {
        this.mc.unsubscribe(this.destination);
    }
    handleMessage(data) {
        if (this.protocol === 'json') {
            console.debug('收到消息:', data);
        }
        this.handlers.forEach((handler) => {
            try {
                handler.handle(data);
            }
            catch (error) {
                console.error('图形应用状态消息处理异常', error);
            }
        });
    }
    onDisconnect() {
        this.subscripted = false;
    }
}

const ReconnectDelay = 3000;
const HeartbeatIncoming = 30000;
const HeartbeatOutgoing = 30000;
class StompMessagingClient extends MessageClient {
    constructor(options) {
        super(options);
        Object.defineProperty(this, "cli", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.options = options;
        this.cli = new Client({
            brokerURL: options.wsUrl,
            connectHeaders: {
                Authorization: options.token ? options.token : '',
            },
            reconnectDelay: ReconnectDelay,
            heartbeatIncoming: HeartbeatIncoming,
            heartbeatOutgoing: HeartbeatOutgoing,
        });
        this.cli.onConnect = () => {
            // this.subClients.forEach((cli) => {
            //   this.subscribe(cli.destination, cli.handleMessage);
            // });
            this.emit('connected', '');
        };
        this.cli.onStompError = (frame) => {
            const errMsg = frame.headers['message'];
            if (errMsg === '401') {
                console.warn('认证失败,断开WebSocket连接');
                this.cli.deactivate();
            }
            else {
                console.error('收到Stomp错误消息', frame);
            }
        };
        this.cli.onDisconnect = (frame) => {
            console.log('Stomp 断开连接', frame);
            this.emit('disconnected', frame);
        };
        // websocket错误处理
        this.cli.onWebSocketError = (err) => {
            console.error('websocket错误', err);
        };
        this.cli.activate();
    }
    get connected() {
        return this.cli.connected;
    }
    subscribe(destination, handle) {
        this.cli.subscribe(destination, (frame) => {
            if (this.options.protocol === 'json') {
                const data = JSON.parse(frame.body);
                handle(data);
            }
            else {
                handle(frame.binaryBody);
            }
        }, {
            id: destination,
        });
        return true;
    }
    unsubscribe0(destination) {
        this.cli.unsubscribe(destination);
    }
    close() {
        this.cli.deactivate();
    }
}

class MqttMsgClient extends MessageClient {
    constructor(options) {
        super(options);
        Object.defineProperty(this, "cli", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "retryTimes", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 0
        });
        Object.defineProperty(this, "subMsgHandler", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Map()
        });
        this.options = options;
        try {
            this.cli = mqtt.connect(options.wsUrl, {
                protocolVersion: 5,
                clean: true,
                resubscribe: false,
                keepalive: options.heartbeat, //ms,心跳
                connectTimeout: options.connectTimeout, // ms,连接超时
                reconnectPeriod: options.retryPeriod, // ms,重连间隔
                username: options.clientName || '',
                password: options.token,
            });
            this.cli.on('connect', (packet) => {
                console.log('MQTT 连接成功!');
                this.retryTimes = 0; // 连接成功，重置
                this.emit('connected', packet);
            });
            this.cli.on('disconnect', (packet) => {
                console.log('MQTT 连接断开!');
                this.emit('disconnected', packet);
            });
            this.cli.on('close', () => {
                console.log('MQTT 关闭!');
                this.emit('disconnected', 'close');
            });
            this.cli.on('reconnect', () => {
                this.retryTimes += 1;
                console.log(`MQTT第 ${this.retryTimes} 次尝试重连`);
                if (this.retryTimes > options.retryTimes) {
                    try {
                        this.cli.end();
                        console.error('MQTT 达到重连最大尝试次数，停止重试');
                    }
                    catch (error) {
                        console.error(error);
                    }
                }
            });
            this.cli.on('error', (error) => {
                console.log('MQTT 出现错误', error);
                console.warn(error);
                this.emit('error', error);
            });
            this.cli.on('message', (topic, message) => {
                const handle = this.subMsgHandler.get(topic);
                if (handle) {
                    if (this.options.protocol === 'json') {
                        const data = JSON.parse(message.toString());
                        handle(data);
                    }
                    else {
                        // 字节流
                        handle(message);
                    }
                }
            });
        }
        catch (err) {
            console.error('MQTT connect error', err);
            this.emit('error', err);
            throw err;
        }
    }
    subscribe(destination, handle) {
        console.debug('MQTT订阅执行', destination);
        this.cli.subscribe(destination, { qos: 0 }, (error, res) => {
            if (error) {
                console.warn('MQTT 订阅失败', error);
                return;
            }
            console.debug('MQTT 订阅成功', res);
            return false;
        });
        this.subMsgHandler.set(destination, handle);
        return true;
    }
    unsubscribe0(destination) {
        console.debug('MQTT取消订阅执行', destination);
        this.cli.unsubscribe(destination, (error, packet) => {
            if (error) {
                console.warn('MQTT 取消订阅失败', error);
            }
            else {
                console.debug('MQTT 取消订阅成功', packet);
                this.subMsgHandler.delete(destination);
            }
        });
    }
    get connected() {
        return this.cli.connected;
    }
    close() {
        try {
            console.debug('MQTT关闭执行');
            this.cli.end(true, () => {
                console.debug('MQTT 消息客户端关闭成功');
                this.subMsgHandler.clear();
            });
        }
        catch (error) {
            console.warn('MQTT 消息客户端关闭失败', error);
        }
    }
}

var ClientEngine;
(function (ClientEngine) {
    ClientEngine[ClientEngine["Stomp"] = 0] = "Stomp";
    // Centrifugo,
    ClientEngine[ClientEngine["MQTT"] = 1] = "MQTT";
})(ClientEngine || (ClientEngine = {}));
const DefaultStompOption = {
    engine: ClientEngine.Stomp,
    protocol: 'protobuf',
    wsUrl: '',
    token: '',
    connectTimeout: 30 * 1000,
    heartbeat: 60,
    retryPeriod: 2 * 1000,
    retryTimes: 100,
};
class WsMsgCli {
    static new(options) {
        if (WsMsgCli.client) {
            // 已经创建
            return;
        }
        WsMsgCli.options = Object.assign({}, DefaultStompOption, options);
        switch (WsMsgCli.options.engine) {
            // case ClientEngine.Centrifugo: {
            //   WsMsgCli.client = new CentrifugeMessagingClient(WsMsgCli.options);
            //   break;
            // }
            case ClientEngine.MQTT: {
                WsMsgCli.client = new MqttMsgClient(WsMsgCli.options);
                break;
            }
            case ClientEngine.Stomp: {
                WsMsgCli.client = new StompMessagingClient(WsMsgCli.options);
                break;
            }
            default: {
                throw new Error('未知的消息客户端引擎类型', WsMsgCli.options.engine);
            }
        }
        const cli = WsMsgCli.client;
        cli.on('connected', () => {
            WsMsgCli.emitConnectStateChangeEvent(true);
        });
        cli.on('disconnected', () => {
            WsMsgCli.emitConnectStateChangeEvent(false);
        });
        cli.on('error', (err) => {
            console.warn('websocket 客户端错误消息发布', err);
            WsMsgCli.appMsgBroker.forEach((broker) => {
                broker.app.emit('websocket-error', err);
            });
        });
    }
    static isInitiated() {
        return !!WsMsgCli.client;
    }
    static emitConnectStateChangeEvent(connected) {
        WsMsgCli.appMsgBroker.forEach((broker) => {
            broker.app.emit('websocket-connect-state-change', connected);
        });
    }
    static isConnected() {
        return WsMsgCli.client && WsMsgCli.client.connected;
    }
    static registerSubscription(destination, handler) {
        WsMsgCli.client.addSubscription(destination, handler);
    }
    static unregisterSubscription(destination, handler) {
        WsMsgCli.client.removeSubscription(destination, handler);
    }
    static registerAppMsgBroker(broker) {
        WsMsgCli.appMsgBroker.push(broker);
    }
    static removeAppMsgBroker(broker) {
        const index = WsMsgCli.appMsgBroker.findIndex((mb) => mb == broker);
        if (index >= 0) {
            WsMsgCli.appMsgBroker.splice(index, 1);
        }
    }
    static hasAppMsgBroker() {
        return WsMsgCli.appMsgBroker.length > 0;
    }
    /**
     * 关闭websocket连接
     */
    static close() {
        if (WsMsgCli.client) {
            WsMsgCli.client.close();
        }
    }
}
Object.defineProperty(WsMsgCli, "appMsgBroker", {
    enumerable: true,
    configurable: true,
    writable: true,
    value: []
});
class AppMessageHandler {
    constructor(app, subOptions) {
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "sub", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.app = app;
        if (!subOptions.messageConverter && !subOptions.messageHandle) {
            throw new Error(`没有消息处理器或图形状态消息转换器: ${subOptions}`);
        }
        this.sub = subOptions;
    }
    get App() {
        return this.app;
    }
    handle(data) {
        const sub = this.sub;
        if (sub.messageConverter) {
            const graphicStates = sub.messageConverter(data);
            this.app.handleGraphicStates(graphicStates, sub.graphicQueryer, sub.createOnNotFound);
        }
        else if (sub.messageHandle) {
            sub.messageHandle(data);
        }
    }
}
/**
 * 图形APP的websocket消息代理
 */
class AppWsMsgBroker {
    constructor(app) {
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "subscriptions", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Map()
        });
        this.app = app;
        WsMsgCli.registerAppMsgBroker(this);
    }
    subscribe(sub) {
        const handler = new AppMessageHandler(this.app, sub);
        WsMsgCli.registerSubscription(sub.destination, handler);
        this.subscriptions.set(sub.destination, handler);
    }
    unsbuscribe(destination) {
        const oldSub = this.subscriptions.get(destination);
        if (oldSub) {
            WsMsgCli.unregisterSubscription(destination, oldSub);
        }
    }
    unsubscribeAll() {
        this.subscriptions.forEach((record, destination) => {
            this.unsbuscribe(destination);
        });
    }
    resubscribeAll() {
        this.subscriptions.forEach((handler, destination) => {
            WsMsgCli.registerSubscription(destination, handler);
        });
    }
    /**
     * 取消所有订阅，从通用Stomp客户端移除此消息代理
     */
    close() {
        WsMsgCli.removeAppMsgBroker(this);
        this.unsubscribeAll();
    }
}

/**
 * 默认的白色样式
 */
const DefaultWhiteStyleOptions = {
    titleStyle: {
        fontSize: 16,
        fontColor: '#000000',
        padding: [5, 15],
    },
    backgroundColor: '#ffffff',
    border: true,
    borderWidth: 1,
    borderColor: '#4C4C4C',
    /**
     * 默认圆角
     */
    borderRoundRadius: 5,
    itemStyle: {
        fontSize: 16,
        fontColor: '#000000',
        padding: [5, 25],
        hoverColor: '#1E78DB',
        disabledFontColor: '#9D9D9D',
    },
};
/**
 * 默认的白色菜单配置
 */
const DefaultWhiteMenuOptions = {
    name: '',
    style: DefaultWhiteStyleOptions,
    groups: [],
};

class ContextMenuPlugin {
    constructor(app) {
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "contextMenuMap", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Map()
        });
        this.app = app;
        const canvas = this.app.canvas;
        canvas.on('pointerdown', () => {
            this.contextMenuMap.forEach((menu) => {
                menu.close();
            });
        });
    }
    registerMenu(menu) {
        this.contextMenuMap.set(menu.menuName, menu);
        menu.plugin = this;
    }
    /**
     * 获取视口屏幕宽度
     */
    get screenWidth() {
        return this.app.viewport.screenWidth;
    }
    /**
     * 获取视口屏幕高度
     */
    get screenHeight() {
        return this.app.viewport.screenHeight;
    }
    /**
     * 打开菜单
     * @param menu
     * @param global
     */
    open(menu, global) {
        if (!menu.opened) {
            menu.opened = true;
            this.app.pixi.stage.addChild(menu);
        }
        // 处理超出显示范围
        const screenHeight = this.screenHeight;
        const bottomY = global.y + menu.height;
        let oob = this.oob(menu, global);
        const pos = global.clone();
        if (oob.right) {
            pos.x = global.x - menu.width;
        }
        if (oob.bottom) {
            const py = global.y - menu.height;
            if (py > 0) {
                pos.y = py;
            }
            else {
                pos.y = global.y - (bottomY - screenHeight);
            }
        }
        // 移动后是否左上超出
        oob = this.oob(menu, pos);
        if (oob.left) {
            pos.x = 0;
        }
        if (oob.top) {
            pos.y = 0;
        }
        menu.position.copyFrom(pos);
    }
    /**
     * 关闭菜单
     * @param menu
     */
    close(menu) {
        if (menu.opened) {
            menu.opened = false;
            this.app.pixi.stage.removeChild(menu);
        }
    }
    /**
     * 关闭所有菜单
     */
    closeAll() {
        this.contextMenuMap.forEach((cm) => {
            this.close(cm);
        });
    }
    /**
     * 越界检查
     * @param menu
     * @param global
     * @returns
     */
    oob(menu, global) {
        const screenWidth = this.screenWidth;
        const screenHeight = this.screenHeight;
        const bound = new Rectangle(0, 0, screenWidth, screenHeight);
        const menuRect = new Rectangle(global.x, global.y, menu.width, menu.height);
        return OutOfBound.check(menuRect, bound);
    }
}
/**
 * 上下文菜单,多级嵌套
 */
class ContextMenu extends Container {
    constructor(menuOptions, parentMenuItem) {
        super();
        Object.defineProperty(this, "_plugin", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "parentMenuItem", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "openedSubMenu", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "menuOptions", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "opened", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        Object.defineProperty(this, "bg", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "title", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "groups", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "padding", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 5
        });
        Object.defineProperty(this, "_active", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        }); // 激活状态
        Object.defineProperty(this, "timeoutCloseHandle", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.menuOptions = Object.assign({}, DefaultWhiteMenuOptions, menuOptions);
        this.name = this.menuOptions.name;
        this.bg = new Graphics();
        this.addChild(this.bg);
        this.groups = [];
        this.init();
        this.parentMenuItem = parentMenuItem;
    }
    static init(options) {
        return new ContextMenu(options);
    }
    get style() {
        return this.menuOptions.style;
    }
    /**
     * 父级菜单
     */
    get parentMenu() {
        var _a;
        return (_a = this.parentMenuItem) === null || _a === void 0 ? void 0 : _a.menu;
    }
    /**
     * 最顶级菜单
     */
    get rootMenu() {
        if (this.parentMenu) {
            return this.parentMenu.rootMenu;
        }
        return this;
    }
    /**
     * 是否存在激活的菜单项
     * @returns
     */
    hasActiveItem() {
        for (let i = 0; i < this.groups.length; i++) {
            const group = this.groups[i];
            if (group.hasActiveItem()) {
                return true;
            }
        }
        return false;
    }
    get active() {
        return (this._active ||
            this.hasActiveItem() ||
            (this.parentMenuItem != undefined && this.parentMenuItem._active));
    }
    set active(v) {
        this._active = v;
        this.onActiveChanged();
    }
    onActiveChanged() {
        if (this.parentMenuItem) {
            this.parentMenuItem.onActiveChanged();
            if (!this.active) {
                this.timeoutCloseHandle = setTimeout(() => {
                    this.close();
                }, 500);
            }
            else {
                if (this.timeoutCloseHandle) {
                    clearTimeout(this.timeoutCloseHandle);
                }
            }
        }
    }
    setOptions(menuOptions) {
        this.menuOptions = Object.assign({}, DefaultWhiteMenuOptions, menuOptions);
        this.init();
    }
    /**
     * 初始化
     */
    init() {
        // this.initTitle();
        this.groups = [];
        const options = this.menuOptions;
        options.groups.forEach((group) => {
            const menuGroup = new MenuGroup(this, group);
            this.groups.push(menuGroup);
        });
        const { borderHeight, maxItemWidth } = this.calculateBorderInfo();
        const splitLineWidth = 1;
        const bgWidth = maxItemWidth + this.padding * 2;
        const bgHeight = borderHeight +
            this.groups.length * this.padding * 2 +
            (this.groups.length - 1) * splitLineWidth;
        if (options.style.border) {
            this.bg.lineStyle(options.style.borderWidth, new Color(options.style.borderColor));
        }
        this.bg.beginFill(new Color(options.style.backgroundColor));
        if (options.style.borderRoundRadius > 0) {
            this.bg.drawRoundedRect(0, 0, bgWidth, bgHeight, options.style.borderRoundRadius);
        }
        else {
            this.bg.drawRect(0, 0, bgWidth, bgHeight);
        }
        this.bg.endFill();
        let groupHeight = 0;
        this.bg.lineStyle(splitLineWidth, new Color(options.style.borderColor));
        for (let i = 0; i < this.groups.length; i++) {
            const group = this.groups[i];
            group.updateItemBox(maxItemWidth);
            group.position.set(this.padding, groupHeight + this.padding);
            if (i === this.groups.length - 1) {
                // 最后一个
                break;
            }
            const splitLineY = groupHeight + group.height + this.padding * 2;
            this.bg.moveTo(0, splitLineY);
            this.bg.lineTo(bgWidth, splitLineY);
            groupHeight = splitLineY + splitLineWidth;
        }
        this.addChild(...this.groups);
        this.eventMode = 'static';
        this.on('pointerover', () => {
            this.active = true;
        });
        this.on('pointerout', () => {
            this.active = false;
        });
    }
    initGroups() {
        this.groups = [];
        const options = this.menuOptions;
        options.groups.forEach((group) => {
            const menuGroup = new MenuGroup(this, group);
            this.groups.push(menuGroup);
        });
        this.addChild(...this.groups);
    }
    initTitle() {
        if (this.menuOptions.title) {
            this.title = new Text(this.menuOptions.title, { align: 'left' });
        }
    }
    calculateBorderInfo() {
        let maxItemNameWidth = 0;
        let maxShortcutWidth = 0;
        let maxGutter = 0;
        let borderHeight = 0;
        this.groups.forEach((menuGroup) => {
            borderHeight += menuGroup.totalHeight;
            const maxInw = menuGroup.maxItemNameWidth;
            if (maxInw > maxItemNameWidth) {
                maxItemNameWidth = maxInw;
            }
            const maxSw = menuGroup.maxShortcutWidth;
            if (maxSw > maxShortcutWidth) {
                maxShortcutWidth = maxSw;
            }
            const gutter = menuGroup.totalGutter;
            if (gutter > maxGutter) {
                maxGutter = gutter;
            }
        });
        const maxItemWidth = maxItemNameWidth + maxShortcutWidth + maxGutter;
        return { borderHeight, maxItemWidth };
    }
    updateBg() {
        this.bg.clear();
        const options = this.menuOptions;
        const { borderHeight, maxItemWidth } = this.calculateBorderInfo();
        const splitLineWidth = 1;
        const bgWidth = maxItemWidth + this.padding * 2;
        const bgHeight = borderHeight +
            this.groups.length * this.padding * 2 +
            (this.groups.length - 1) * splitLineWidth;
        if (options.style.border) {
            this.bg.lineStyle(options.style.borderWidth, new Color(options.style.borderColor));
        }
        this.bg.beginFill(new Color(options.style.backgroundColor));
        if (options.style.borderRoundRadius > 0) {
            this.bg.drawRoundedRect(0, 0, bgWidth, bgHeight, options.style.borderRoundRadius);
        }
        else {
            this.bg.drawRect(0, 0, bgWidth, bgHeight);
        }
        this.bg.endFill();
        let groupHeight = 0;
        this.bg.lineStyle(splitLineWidth, new Color(options.style.borderColor));
        for (let i = 0; i < this.groups.length; i++) {
            const group = this.groups[i];
            group.updateItemBox(maxItemWidth);
            group.position.set(this.padding, groupHeight + this.padding);
            if (i === this.groups.length - 1) {
                // 最后一个
                break;
            }
            const splitLineY = groupHeight + group.height + this.padding * 2;
            this.bg.moveTo(0, splitLineY);
            this.bg.lineTo(bgWidth, splitLineY);
            groupHeight = splitLineY + splitLineWidth;
        }
    }
    update() {
        if (this.menuOptions.groups.length !== this.groups.length) {
            this.init();
        }
        else {
            this.groups.forEach((group) => group.update());
            this.updateBg();
        }
    }
    get menuName() {
        return this.menuOptions.name;
    }
    get plugin() {
        if (this.parentMenu) {
            return this.parentMenu.plugin;
        }
        if (this._plugin) {
            return this._plugin;
        }
        throw new Error(`上下文菜单name=${this.menuOptions.name}没有添加到插件中`);
    }
    set plugin(v) {
        this._plugin = v;
    }
    /**
     * 显示菜单
     */
    open(global) {
        if (this.parentMenu) {
            this.parentMenu.openSub(this, global);
        }
        else {
            this.update();
            this.plugin.open(this, global);
        }
    }
    /**
     * 关闭菜单
     */
    close() {
        if (this.openedSubMenu) {
            this.openedSubMenu.close();
            this.openedSubMenu = undefined;
        }
        this.plugin.close(this);
    }
    /**
     * 打开子菜单
     * @param subMenu
     * @param global
     */
    openSub(subMenu, global) {
        if (this.openedSubMenu) {
            this.openedSubMenu.close();
        }
        const pos = global.clone();
        const oob = this.plugin.oob(subMenu, global);
        if (oob.right) {
            pos.x = this.position.x - subMenu.width + this.padding;
        }
        if (oob.bottom) {
            pos.y = this.plugin.screenHeight - subMenu.height - this.padding;
        }
        this.plugin.open(subMenu, pos);
        this.openedSubMenu = subMenu;
    }
}
class MenuGroup extends Container {
    constructor(menu, config) {
        super();
        Object.defineProperty(this, "gutter", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 3
        }); // 名称、快捷键、箭头文本间隙
        Object.defineProperty(this, "config", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "menu", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "items", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
        this.config = config;
        this.menu = menu;
        this.init();
    }
    init() {
        this.items = []; // 清空
        this.config.items.forEach((item) => {
            this.items.push(new ContextMenuItem(this.menu, item));
        });
        if (this.items.length === 0) {
            console.error('菜单group为空', this.config, this.menu);
            throw new Error(`{name=${this.menu.name}}的菜单的group为{name=${this.config.name}}的条目为空!`);
        }
        this.addChild(...this.items);
    }
    hasActiveItem() {
        for (let i = 0; i < this.items.length; i++) {
            const item = this.items[i];
            if (item.active) {
                return true;
            }
        }
        return false;
    }
    get maxItemNameWidth() {
        const maxNameWidth = this.items
            .map((item) => item.nameBounds.width)
            .sort((a, b) => a - b)
            .reverse()[0];
        return maxNameWidth;
    }
    get maxShortcutWidth() {
        const maxShortcutWidth = this.items
            .map((item) => item.shortcutKeyBounds.width)
            .sort((a, b) => a - b)
            .reverse()[0];
        return maxShortcutWidth;
    }
    get totalGutter() {
        return this.gutter + this.items[0].paddingLeft + this.items[0].paddingRight;
    }
    get totalHeight() {
        let total = 0;
        this.items.forEach((item) => (total += item.totalHeight));
        return total;
    }
    update() {
        if (this.items.length !== this.config.items.length) {
            this.init();
        }
        else {
            let i = 0;
            this.items.forEach((item) => {
                item.update();
                if (item.visible) {
                    item.position.y = i * item.totalHeight;
                    i++;
                }
            });
        }
    }
    updateItemBox(maxItemWidth) {
        this.items.forEach((item) => item.updateBox(maxItemWidth, item.totalHeight));
    }
}
/**
 * 菜单项
 */
class ContextMenuItem extends Container {
    constructor(menu, config) {
        super();
        Object.defineProperty(this, "menu", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "config", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 名称文本
         */
        Object.defineProperty(this, "nameText", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        /**
         * 快捷键文本
         */
        Object.defineProperty(this, "shortcutKeyText", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "gutter", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 3
        }); // 名称、快捷键、箭头文本间隙
        Object.defineProperty(this, "arrowText", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "box", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "subMenu", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "_active", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        }); // 激活状态
        this.menu = menu;
        this.config = config;
        this.box = new Graphics();
        this.addChild(this.box);
        this.nameText = new Text(this.config.name, {
            fontSize: this.fontSize,
            fill: this.fontColor,
        });
        this.addChild(this.nameText);
        this.initShortcutKeyText();
        this.initSubMenu();
    }
    registerEventHandler() {
        this.eventMode = 'static';
        this.cursor = 'pointer';
        this.on('pointerover', () => {
            this.active = true;
            if (this.config.disabled) {
                this.cursor = 'not-allowed';
            }
            else {
                this.cursor = 'pointer';
            }
            if (this.subMenu) {
                const p = this.toGlobal(new Point(this.width));
                this.subMenu.open(p);
            }
        });
        this.on('pointerout', () => {
            this.active = false;
        });
        this.on('pointertap', () => {
            if (this.config.disabled) {
                // 禁用，不处理
                return;
            }
            if (this.config.handler) {
                this.menu.plugin.app.emit('pre-menu-handle', this.config);
                this.config.handler();
                this.menu.plugin.app.emit('post-menu-handle', this.config);
            }
            if (!this.config.subMenu || this.config.subMenu.groups.length === 0) {
                this.active = false;
                this.menu.active = false;
                this.menu.rootMenu.close();
            }
        });
    }
    get active() {
        return this._active || (this.subMenu != undefined && this.subMenu.active);
    }
    set active(v) {
        this._active = v;
        if (this.subMenu) {
            this.subMenu.onActiveChanged();
        }
        this.onActiveChanged();
    }
    onActiveChanged() {
        if (this.active) {
            this.box.alpha = 1;
        }
        else {
            this.box.alpha = 0;
        }
    }
    get textWidth() {
        return this.nameBounds.width + this.shortcutKeyBounds.width + this.gutter;
    }
    get nameGraphic() {
        if (this.nameText) {
            return this.nameText;
        }
        throw new Error(`菜单项name=${this.config.name}没有初始化名称图形对象`);
    }
    get totalHeight() {
        if (this.config.visible === false) {
            return 0;
        }
        else {
            return this.paddingTop + this.paddingBottom + this.nameGraphic.height;
        }
    }
    get nameBounds() {
        return this.nameGraphic.getLocalBounds();
    }
    get shortcutKeyBounds() {
        if (this.shortcutKeyText) {
            return this.shortcutKeyText.getLocalBounds();
        }
        else {
            return new Rectangle(0, 0, 0, 0);
        }
    }
    get style() {
        return this.menu.style.itemStyle;
    }
    checkPadding(padding) {
        if (Array.isArray(padding)) {
            if (padding.length !== 2 && padding.length !== 4) {
                throw new Error('错误的padding数据');
            }
        }
    }
    toWholePadding(padding) {
        this.checkPadding(padding);
        if (Array.isArray(padding)) {
            if (padding.length == 2) {
                return [padding[0], padding[1], padding[0], padding[1]];
            }
            else {
                return padding;
            }
        }
        else {
            return [padding, padding, padding, padding];
        }
    }
    get paddingTop() {
        return this.toWholePadding(this.menu.style.itemStyle.padding)[0];
    }
    get paddingBottom() {
        return this.toWholePadding(this.menu.style.itemStyle.padding)[2];
    }
    get paddingLeft() {
        return this.toWholePadding(this.menu.style.itemStyle.padding)[3];
    }
    get paddingRight() {
        return this.toWholePadding(this.menu.style.itemStyle.padding)[1];
    }
    get hoverColor() {
        return this.style.hoverColor;
    }
    get fontSize() {
        return this.style.fontSize;
    }
    get fontColor() {
        if (this.config.disabled) {
            return this.style.disabledFontColor;
        }
        else if (this.config.fontColor) {
            return this.config.fontColor;
        }
        return this.style.fontColor;
    }
    initShortcutKeyText() {
        if (this.config.shortcutKeys && this.config.shortcutKeys.length > 0) {
            this.shortcutKeyText = new Text(this.config.shortcutKeys.join('+'), {
                fontSize: this.fontSize,
                fill: this.fontColor,
            });
            this.addChild(this.shortcutKeyText);
            return this.shortcutKeyText;
        }
        return undefined;
    }
    initSubMenu() {
        if (this.config.subMenu && this.config.subMenu.groups.length > 0) {
            this.arrowText = new Text('>', {
                fontSize: this.fontSize,
                fill: this.fontColor,
            });
            this.addChild(this.arrowText);
            this.subMenu = new ContextMenu(this.config.subMenu, this);
        }
    }
    updateBackground(width, height) {
        this.box.clear();
        const box = this.box;
        const style = this.menu.style;
        if (!style.itemStyle.hoverColor) {
            throw new Error('未设置菜单项的hoverColor');
        }
        let hoverColor = style.itemStyle.hoverColor;
        if (this.style && this.style.hoverColor) {
            hoverColor = this.style.hoverColor;
        }
        box.beginFill(new Color(hoverColor));
        if (style.borderRoundRadius > 0) {
            box.drawRoundedRect(0, 0, width, height, style.borderRoundRadius);
        }
        else {
            box.drawRect(0, 0, width, height);
        }
        box.endFill();
        box.alpha = 0;
    }
    updateBox(width, height) {
        var _a;
        this.removeAllListeners();
        this.updateBackground(width, height);
        (_a = this.nameText) === null || _a === void 0 ? void 0 : _a.position.set(this.paddingLeft, this.paddingTop);
        if (this.shortcutKeyText) {
            const skTextWidth = this.shortcutKeyBounds.width;
            this.shortcutKeyText.position.set(width - skTextWidth - this.paddingRight, this.paddingTop);
        }
        if (this.arrowText) {
            this.arrowText.position.set(width - this.paddingRight - this.gutter, this.paddingTop);
        }
        // 事件监听
        this.hitArea = new Rectangle(0, 0, width, height);
        this.registerEventHandler();
    }
    update() {
        if (this.config.visible === false) {
            this.visible = false;
            return;
        }
        this.visible = true;
        this.nameText.text = this.config.name;
        this.nameText.style.fontSize = this.fontSize;
        this.nameText.style.fill = this.fontColor;
        if (this.shortcutKeyText) {
            if (this.config.shortcutKeys && this.config.shortcutKeys.length > 0) {
                this.shortcutKeyText.text = this.config.shortcutKeys.join('+');
                this.shortcutKeyText.style.fontSize = this.fontSize;
                this.shortcutKeyText.style.fill = this.fontColor;
            }
            else {
                this.shortcutKeyText.visible = false;
            }
        }
        else {
            this.initShortcutKeyText();
        }
        if (this.config.subMenu == undefined && this.subMenu) {
            this.subMenu = undefined;
        }
        else if (this.config.subMenu && this.subMenu == undefined) {
            this.initSubMenu();
        }
        if (this.subMenu) {
            this.subMenu.update();
        }
    }
}

const AppConsts = {
    viewportname: '__viewport',
    canvasname: '__jlcanvas',
    AssistantAppendsName: '__assistantAppends',
    // 辅助元素默认颜色
    assistantElementColor: '#1976d2',
};
class CanvasData {
    constructor(properties = {
        width: 1920,
        height: 1080,
        backgroundColor: '#ffffff',
        viewportTransform: GraphicTransform.default(),
    }) {
        Object.defineProperty(this, "width", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "height", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "backgroundColor", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "viewportTransform", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.width = properties.width;
        this.height = properties.height;
        this.backgroundColor = properties.backgroundColor;
        this.viewportTransform = properties.viewportTransform;
    }
    copyFrom(properties) {
        let sizeChange = false;
        if (properties.width <= 0 || properties.height <= 0) {
            console.error('画布宽度/高度不能小于等于0');
        }
        else {
            const width = Math.floor(properties.width);
            const height = Math.floor(properties.height);
            if (this.width != width) {
                this.width = width;
                sizeChange = true;
            }
            if (this.height != height) {
                this.height = height;
                sizeChange = true;
            }
        }
        this.backgroundColor = properties.backgroundColor;
        this.viewportTransform = properties.viewportTransform;
        return sizeChange;
    }
    clone() {
        const cp = new CanvasData(this);
        return cp;
    }
}
class JlCanvas extends Container {
    constructor(scene, properties = new CanvasData()) {
        super();
        Object.defineProperty(this, "__JlCanvas", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: true
        });
        Object.defineProperty(this, "type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: 'Canvas'
        });
        Object.defineProperty(this, "scene", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "_properties", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "bg", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Graphics()
        }); // 背景
        Object.defineProperty(this, "nonInteractiveContainer", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 无交互对象容器
        Object.defineProperty(this, "assistantAppendContainer", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 辅助附加容器
        this.scene = scene;
        this._properties = properties;
        this.eventMode = 'static';
        this.nonInteractiveContainer = new Container();
        this.nonInteractiveContainer.name = 'non-interactives';
        this.nonInteractiveContainer.eventMode = 'none';
        this.addChild(this.bg);
        this.addChild(this.nonInteractiveContainer);
        this.sortableChildren = true;
        this.assistantAppendContainer = new Container();
        this.assistantAppendContainer.eventMode = 'static';
        this.assistantAppendContainer.name = AppConsts.AssistantAppendsName;
        this.assistantAppendContainer.zIndex = 999;
        this.assistantAppendContainer.sortableChildren = true;
        this.addChild(this.assistantAppendContainer);
        this.repaint();
    }
    /**
     * 图形重绘（数据/状态变化时触发）
     */
    repaint() {
        this.doRepaint();
    }
    get width() {
        return this._properties.width;
    }
    get height() {
        return this._properties.height;
    }
    get backgroundColor() {
        return this._properties.backgroundColor;
    }
    doRepaint() {
        this.bg.clear();
        this.bg
            .beginFill(new Color(this.backgroundColor))
            .drawRect(0, 0, this._properties.width, this._properties.height)
            .endFill();
    }
    get properties() {
        return this._properties;
    }
    saveData() {
        const vp = this.getViewport();
        this.properties.viewportTransform = vp.saveTransform();
        return this.properties.clone();
    }
    update(properties) {
        // 更新画布
        const old = this.properties.clone();
        this._properties.copyFrom(properties);
        this.repaint();
        const vp = this.getViewport();
        vp.loadTransform(properties.viewportTransform);
        this.emit('dataupdate', this.properties, old);
    }
    addChild(...children) {
        const rt = super.addChild(...children);
        children.forEach((g) => {
            g.onAddToCanvas(this);
            recursiveChildren(g, (child) => child.onAddToCanvas(this));
        });
        return rt;
    }
    removeChild(...children) {
        children.forEach((g) => {
            g.onRemoveFromCanvas(this);
            recursiveChildren(g, (child) => child.onRemoveFromCanvas(this));
        });
        return super.removeChild(...children);
    }
    /**
     * 添加无交互Child
     */
    addNonInteractiveChild(...obj) {
        this.nonInteractiveContainer.addChild(...obj);
        obj.forEach((g) => {
            g.onAddToCanvas(this);
            recursiveChildren(g, (child) => child.onAddToCanvas(this));
        });
    }
    removeGraphic(...obj) {
        obj.forEach((g) => {
            g.onRemoveFromCanvas(this);
            recursiveChildren(g, (child) => child.onRemoveFromCanvas(this));
        });
        this.removeChild(...obj);
        this.nonInteractiveContainer.removeChild(...obj);
    }
    /**
     * 移除无交互Child
     */
    removeNonInteractiveChild(...obj) {
        obj.forEach((g) => {
            g.onRemoveFromCanvas(this);
            recursiveChildren(g, (child) => child.onRemoveFromCanvas(this));
        });
        this.nonInteractiveContainer.removeChild(...obj);
    }
    addAssistantAppends(...appends) {
        this.assistantAppendContainer.addChild(...appends);
        appends.forEach((g) => {
            g.onAddToCanvas(this);
            recursiveChildren(g, (child) => child.onAddToCanvas(this));
        });
    }
    removeAssistantAppends(...appends) {
        appends.forEach((g) => {
            g.onRemoveFromCanvas(this);
            recursiveChildren(g, (child) => child.onAddToCanvas(this));
        });
        this.assistantAppendContainer.removeChild(...appends);
    }
    /**
     * 暂停所有可交互对象
     */
    pauseInteractiveChildren() {
        this.interactiveChildren = false;
    }
    /**
     * 恢复所有可交互对象
     */
    resumeInteractiveChildren() {
        this.interactiveChildren = true;
    }
}
class GraphicSceneBase extends EventEmitter {
    constructor(options) {
        super();
        Object.defineProperty(this, "graphicStore", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "_options", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "pixi", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // Pixi 渲染器
        Object.defineProperty(this, "viewport", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 视口
        Object.defineProperty(this, "canvas", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 画布
        Object.defineProperty(this, "_loaded", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        }); // 是否已经加载
        Object.defineProperty(this, "_dom", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 场景绑定到的dom节点
        Object.defineProperty(this, "_viewportResizer", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 自动根据dom大小变化调整视口尺寸
        Object.defineProperty(this, "graphicTemplateMap", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Map()
        }); // 图形对象模板
        Object.defineProperty(this, "interactionPluginMap", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Map()
        }); // 交互插件
        Object.defineProperty(this, "graphicCopyPlugin", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 图形复制操作插件
        Object.defineProperty(this, "animationManager", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 动画管理组件
        Object.defineProperty(this, "menuPlugin", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 菜单插件
        Object.defineProperty(this, "debounceEmitFunc", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "wsMsgBroker", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // websocket消息代理
        this.graphicStore = new GraphicStore();
        this._options = options;
        // 创建pixi渲染app
        this.pixi = new Application({
            antialias: true,
        });
        // 创建画布
        this.canvas = new JlCanvas(this);
        this.canvas.name = AppConsts.canvasname;
        // 创建相机
        this.viewport = new Viewport({
            screenWidth: window.innerWidth,
            screenHeight: window.innerHeight,
            worldWidth: this.canvas._properties.width,
            worldHeight: this.canvas._properties.height,
            passiveWheel: true,
            events: this.pixi.renderer.events,
            disableOnContextMenu: true,
        });
        // 设置视口操作方式
        this.viewport
            .wheel({
            percent: 1,
        })
            .pinch()
            .clampZoom({
            minScale: 0.1,
            maxScale: 8,
        })
            .clamp({
            direction: 'all',
        });
        this.viewport.name = AppConsts.viewportname;
        this.viewport.interactiveChildren = true;
        // 添加视口到渲染器舞台
        this.pixi.stage.addChild(this.viewport);
        // 将画布置于视口
        this.viewport.addChild(this.canvas);
        // 监听并通知缩放变化事件
        this.viewport.on('zoomed-end', () => {
            this.emit('viewport-scaled', this.viewport);
        });
        this.graphicCopyPlugin = new GraphicCopyPlugin(this);
        // 添加通用交互插件
        CommonMouseTool.new(this).resume();
        // drag插件
        DragPlugin.new(this).resume();
        // 视口移动插件
        ViewportMovePlugin.new(this);
        // 图形变换插件
        GraphicTransformPlugin.new(this).resume();
        // 动画管理
        this.animationManager = new AnimationManager(this);
        this.menuPlugin = new ContextMenuPlugin(this);
        this.wsMsgBroker = new AppWsMsgBroker(this);
        this.debounceEmitFunc = debounce(this.doEmitAppGraphicSelected, 50);
        this.on('graphicselectedchange', () => {
            this.debounceEmitFunc(this);
        });
        // 发布选项更新事件
        this.emit('options-update', this._options);
    }
    get appOptions() {
        return this._options;
    }
    get dom() {
        return this._dom;
    }
    get queryStore() {
        return this.graphicStore;
    }
    get selectedGraphics() {
        return this.queryStore.getAllGraphics().filter((g) => g.selected);
    }
    load() {
        return __awaiter(this, void 0, void 0, function* () {
            if (this._options.dataLoader) {
                const storage = yield this._options.dataLoader();
                if (storage.canvasProperty) {
                    this.canvas.update(storage.canvasProperty);
                }
                if (storage.datas) {
                    yield this.loadGraphic(storage.datas);
                }
            }
            this._loaded = true;
        });
    }
    /**
     * 重新加载数据
     */
    reload() {
        return __awaiter(this, void 0, void 0, function* () {
            if (!this._loaded) {
                this.graphicStore.clear();
                yield this.load();
            }
            else {
                console.debug('场景已经加载过数据,不重新加载', this);
            }
        });
    }
    forceReload() {
        return __awaiter(this, void 0, void 0, function* () {
            console.debug('场景强制重新加载数据', this);
            this.graphicStore.clear();
            yield this.load();
        });
    }
    /**
     * 更新选项
     * @param options
     */
    setOptions(options) {
        if (this._options) {
            this._options = Object.assign(this._options, options);
        }
        else {
            this._options = options;
        }
        this.emit('options-update', options);
    }
    toCanvasCoordinates(p) {
        return this.viewport.toWorld(p);
    }
    /**
     * 注册菜单
     * @param menu
     */
    registerMenu(menu) {
        this.menuPlugin.registerMenu(menu);
    }
    /**
     * 注册图形对象模板
     * @param graphicTemplates
     */
    registerGraphicTemplates(...graphicTemplates) {
        graphicTemplates.forEach((graphicTemplate) => {
            this.graphicTemplateMap.set(graphicTemplate.type, graphicTemplate);
        });
    }
    getGraphicTemplatesByType(type) {
        const template = this.graphicTemplateMap.get(type);
        if (!template) {
            throw new Error(`不存在type=${type}的图形对象模板`);
        }
        return template;
    }
    updateViewport(domWidth, domHeight) {
        let screenWidth = this.viewport.screenWidth;
        let screenHeight = this.viewport.screenHeight;
        if (domWidth) {
            screenWidth = domWidth;
        }
        if (domHeight) {
            screenHeight = domHeight;
        }
        const worldWidth = this.canvas._properties.width;
        const worldHeight = this.canvas._properties.height;
        this.pixi.resize();
        this.viewport.resize(screenWidth, screenHeight, worldWidth, worldHeight);
        if (this.viewport.OOB().right) {
            this.viewport.right = this.viewport.right + 1;
        }
        else if (this.viewport.OOB().left) {
            this.viewport.left = this.viewport.left - 1;
        }
        else if (this.viewport.OOB().top) {
            this.viewport.top = this.viewport.top - 1;
        }
        else if (this.viewport.OOB().bottom) {
            this.viewport.bottom = this.viewport.bottom + 1;
        }
    }
    /**
     * 暂停
     */
    pause() {
        // 暂停动画
        this.animationManager.pause();
        // 取消消息订阅
        this.wsMsgBroker.unsubscribeAll();
        // 关闭所有上下文菜单
        this.menuPlugin.closeAll();
    }
    /**
     * 恢复
     */
    resume() {
        // 恢复动画
        this.animationManager.resume();
        // 重新订阅
        this.wsMsgBroker.resubscribeAll();
    }
    bindDom(dom) {
        this._dom = dom;
        this.pixi.resizeTo = dom;
        dom.appendChild(this.pixi.view);
        this._viewportResizer = setInterval(() => {
            this.updateViewport(dom.clientWidth, dom.clientHeight);
        }, 1000);
        // 恢复
        this.resume();
    }
    unbindDom() {
        if (this._dom) {
            clearInterval(this._viewportResizer);
            this._dom.removeChild(this.pixi.view);
            this._dom = undefined;
            // 暂停
            this.pause();
        }
    }
    /**
     * 加载图形,GraphicApp默认添加到无交互容器,DrawApp默认添加到交互容器,如需定制，提供选项配置
     * @param protos
     * @param options 添加到可交互/不可交互容器选项配置
     */
    loadGraphic(protos) {
        var _a;
        return __awaiter(this, void 0, void 0, function* () {
            for (const item of this.graphicTemplateMap) {
                yield item[1].loadAssets();
            }
            // 加载数据到图形存储
            protos.forEach((proto) => {
                const template = this.getGraphicTemplatesByType(proto.graphicType);
                const g = template.new();
                g.loadData(proto);
                this.addGraphics(g);
            });
            // 加载数据关系
            this.queryStore.getAllGraphics().forEach((g) => g.loadRelations());
            // 更新id生成器
            const max = (_a = this.queryStore
                .getAllGraphics()
                .filter((g) => !isNaN(parseInt(g.id)))
                .map((g) => parseInt(g.id))
                .sort((a, b) => a - b)
                .pop()) !== null && _a !== void 0 ? _a : 0;
            GraphicIdGenerator.initSerial(max);
            // 数据加载完成后
            this.emit('postdataloaded');
            // 加载完成通知
            this.emit('loadfinish');
        });
    }
    /**
     * 添加图形前处理
     * @param graphic
     */
    beforeGraphicStore(graphic) {
        const interactiveGraphicTypeIncludes = this._options.interactiveGraphicTypeIncludes || [];
        const interactiveGraphicTypeExcludes = this._options.interactiveGraphicTypeExcludes || [];
        // 默认无交互
        graphic.eventMode = 'auto';
        if (interactiveGraphicTypeIncludes.findIndex((type) => type === graphic.type) >= 0) {
            graphic.eventMode = 'static';
        }
        else if (interactiveGraphicTypeExcludes.findIndex((type) => type === graphic.type) < 0) {
            graphic.eventMode = 'static';
        }
    }
    /**
     * 执行添加图形对象
     * @param graphic
     */
    doAddGraphics(graphic) {
        this.beforeGraphicStore(graphic);
        if (this.graphicStore.storeGraphics(graphic)) {
            // cullable,默认设置剪裁，如果图形包围框不在屏幕内，则不渲染，增加效率用
            if (!this._options || this._options.cullable !== false) {
                graphic.cullable = true;
            }
            if (graphic.eventMode == 'static' || graphic.eventMode == 'dynamic') {
                // 添加为可交互
                this.canvas.addChild(graphic);
            }
            else {
                // 添加到不可交互容器
                this.canvas.addNonInteractiveChild(graphic);
            }
            graphic.repaint();
            this.emit('graphicstored', graphic);
            graphic.on('childselected', (child) => {
                this.emit('graphicchildselectedchange', child, true);
            });
            graphic.on('childunselected', (child) => {
                this.emit('graphicchildselectedchange', child, false);
            });
        }
    }
    doDeleteGraphics(graphic) {
        // 从store中删除
        const g = this.graphicStore.deleteGraphics(graphic);
        if (g) {
            // 清除选中
            g.updateSelected(false);
            // 从画布移除
            this.canvas.removeGraphic(g);
            // 对象删除处理
            g.onDelete();
            this.emit('graphicdeleted', g);
        }
    }
    /**
     * 存储图形
     * @param graphics 图形对象
     */
    addGraphics(...graphics) {
        graphics.forEach((g) => this.doAddGraphics(g));
    }
    /**
     * 删除图形
     * @param graphics 图形对象
     */
    deleteGraphics(...graphics) {
        const dels = graphics.filter((g) => {
            var _a;
            if (((_a = this._options) === null || _a === void 0 ? void 0 : _a.isSupportDeletion) == undefined ||
                this._options.isSupportDeletion(g)) {
                this.doDeleteGraphics(g);
                return true;
            }
            console.debug(`type=${g.type},id=${g.id}的图形不支持删除`);
            return false;
        });
        return dels;
    }
    /**
     * 检测并构建关系
     */
    detectRelations() {
        this.queryStore.getAllGraphics().forEach((g) => g.buildRelation());
    }
    /**
     * 全选
     */
    selectAllGraphics(filter) {
        if (filter == undefined) {
            filter = (g) => g.visible;
        }
        this.updateSelected(...this.queryStore.getAllGraphics().filter(filter));
    }
    /**
     * 更新选中
     */
    updateSelected(...graphics) {
        this.selectedGraphics.forEach((graphic) => {
            if (graphics.findIndex((g) => g.id === graphic.id) >= 0) {
                return;
            }
            if (graphic.selected) {
                graphic.updateSelected(false);
            }
        });
        graphics.forEach((graphic) => {
            graphic.updateSelected(true);
        });
    }
    doEmitAppGraphicSelected() {
        // 场景发布图形选中
        this.emit('graphicselected', this.selectedGraphics);
        // this.app.emit('graphicselected', this.selectedGraphics);
    }
    /**
     * 更新画布
     * @param param
     */
    updateCanvas(param) {
        this.canvas.update(param);
    }
    /**
     * 使图形居中显示(所有图形的外包围盒)
     */
    makeGraphicCenterShow(...group) {
        if (group.length > 0) {
            const bounds0 = group[0].getBounds();
            let lx = bounds0.x;
            let ly = bounds0.y;
            let rx = bounds0.x + bounds0.width;
            let ry = bounds0.y + bounds0.height;
            if (group.length > 1) {
                for (let i = 1; i < group.length; i++) {
                    const g = group[i];
                    const bound = g.getBounds();
                    if (bound.x < lx) {
                        lx = bound.x;
                    }
                    if (bound.y < ly) {
                        ly = bound.y;
                    }
                    const brx = bound.x + bound.width;
                    if (brx > rx) {
                        rx = brx;
                    }
                    const bry = bound.y + bound.height;
                    if (bry > ry) {
                        ry = bry;
                    }
                }
            }
            const { x, y } = getRectangleCenter(new Rectangle(lx, ly, rx - lx, ry - ly));
            const p = this.viewport.toWorld(x, y);
            this.viewport.moveCenter(p.x, p.y);
        }
    }
    /**
     * 注册交互插件,会替换旧的
     */
    registerInteractionPlugin(...plugins) {
        plugins.forEach((plugin) => {
            const old = this.interactionPluginMap.get(plugin.name);
            if (old) {
                console.warn(`已经存在name=${plugin.name}的交互插件,忽略此插件注册!`);
                return;
            }
            this.interactionPluginMap.set(plugin.name, plugin);
        });
    }
    /**
     * 根据名称获取交互插件
     * @param name
     * @returns
     */
    interactionPlugin(name) {
        const plugin = this.interactionPluginMap.get(name);
        if (!plugin) {
            throw new Error(`未找到name=${name}的交互插件`);
        }
        return plugin;
    }
    /**
     * 停止应用交互插件
     */
    pauseAppInteractionPlugins() {
        this.interactionPluginMap.forEach((plugin) => {
            if (plugin.isActive() && plugin._type === InteractionPluginType.App) {
                this.doPauseInteractionPlugin(plugin);
            }
        });
    }
    doPauseInteractionPlugin(plugin) {
        if (plugin && plugin.isActive()) {
            plugin.pause();
            this.emit('interaction-plugin-pause', plugin);
        }
    }
    /**
     * 移除交互插件
     */
    removeInteractionPlugin(plugin) {
        this.interactionPluginMap.delete(plugin.name);
    }
    checkWsMsgCli() {
        if (!WsMsgCli.isInitiated()) {
            throw new Error('订阅消息需先启动消息代理, 执行app.enableWebsocket()');
        }
    }
    /**
     * 订阅websocket消息
     */
    subscribe(sub) {
        this.checkWsMsgCli();
        this.wsMsgBroker.subscribe(sub);
    }
    /**
     * 取消websocket订阅
     */
    unsubscribe(destination) {
        this.checkWsMsgCli();
        this.wsMsgBroker.unsbuscribe(destination);
    }
    /**
     * 处理图形状态
     * @param graphicStates
     */
    handleGraphicStates(graphicStates, queryer, createOnNotFound) {
        graphicStates.forEach((state) => {
            let g;
            if (queryer) {
                g = queryer(state, this.queryStore);
            }
            else {
                g = this.queryStore.queryByCodeAndType(state.code, state.graphicType);
            }
            try {
                if (!g) {
                    // 未找到图形对象
                    if (!state.remove &&
                        createOnNotFound &&
                        createOnNotFound.graphicTypes &&
                        createOnNotFound.graphicTypes.findIndex((v) => v === state.graphicType) >= 0) {
                        const template = this.getGraphicTemplatesByType(state.graphicType);
                        const g = template.new();
                        g.loadState(state);
                        this.addGraphics(g);
                    }
                }
                else {
                    // 找到
                    if (state.remove) {
                        this.deleteGraphics(g);
                        g.destroy({ children: true });
                    }
                    else if (g.updateStates(state)) {
                        g.repaint();
                    }
                }
            }
            catch (err) {
                console.error('图形状态处理异常', g, state, err);
                // throw err;
            }
        });
    }
    /**
     * 销毁
     */
    destroy() {
        console.debug('场景销毁', this);
        this.unbindDom();
        if (this.wsMsgBroker) {
            this.wsMsgBroker.close();
        }
        this.interactionPluginMap.forEach((plugin) => {
            plugin.pause();
        });
        this.animationManager.destroy();
        this.canvas.destroy(true);
        this.viewport.destroy();
        this.pixi.destroy(true, true);
    }
}
/**
 * 图形app基类
 */
class GraphicApp extends GraphicSceneBase {
    constructor(options) {
        super(options);
        /**
         * 场景列表
         */
        Object.defineProperty(this, "scenes", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Map()
        });
        Object.defineProperty(this, "opRecord", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 操作记录
        Object.defineProperty(this, "keyboardPlugin", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 键盘操作处理插件
        this.opRecord = new OperationRecord();
        // 绑定键盘监听
        this.keyboardPlugin = new JlGraphicAppKeyboardPlugin(this);
    }
    get app() {
        return this;
    }
    setOptions(options) {
        if (options.maxOperationRecords && options.maxOperationRecords > 0) {
            this.opRecord.setMaxLen(options.maxOperationRecords);
        }
        super.setOptions(options);
    }
    addGraphicAndRecord(...graphics) {
        this.addGraphics(...graphics);
        this.opRecord.record(new GraphicCreateOperation(this, graphics));
    }
    deleteGraphicAndRecord(...graphics) {
        this.deleteGraphics(...graphics);
        this.opRecord.record(new GraphicDeleteOperation(this, graphics));
    }
    /**
     * 实例化一个场景
     * @param code 场景标识
     * @returns
     */
    initScene(code, options) {
        let scene = this.scenes.get(code);
        if (!scene) {
            scene = new JlScene(this, code, options);
            this.scenes.set(code, scene);
        }
        return scene;
    }
    /**
     * 获取场景
     * @param code
     * @returns
     */
    getScene(code) {
        const scene = this.scenes.get(code);
        if (!scene) {
            throw new Error(`不存在code=${code}的场景`);
        }
        return scene;
    }
    switchScene(code, dom) {
        const scene = this.getScene(code);
        // eslint-disable-next-line @typescript-eslint/no-unused-vars
        for (const [_code, pre] of this.scenes) {
            if (pre.dom === dom) {
                pre.unbindDom();
                break;
            }
        }
        scene.bindDom(dom);
    }
    removeScene(code) {
        const scene = this.scenes.get(code);
        if (scene) {
            this.scenes.delete(code);
            scene.destroy();
        }
    }
    /**
     * 启动websocket消息客户端
     */
    enableWsMassaging(options) {
        WsMsgCli.new(options);
        this.wsMsgBroker = new AppWsMsgBroker(this);
    }
    /**
     * 添加键盘监听器,如果是相同的按键，新注册的会覆盖旧的，当移除新的时，旧的自动生效
     * @param keyListeners
     */
    addKeyboardListener(...keyListeners) {
        keyListeners.forEach((keyListener) => this.keyboardPlugin.addKeyListener(keyListener));
    }
    /**
     * 移除键盘监听器
     * @param keyListeners
     */
    removeKeyboardListener(...keyListeners) {
        keyListeners.forEach((keyListener) => this.keyboardPlugin.removeKeyListener(keyListener));
    }
    /**
     * 销毁
     */
    destroy() {
        console.debug('图形应用销毁', this);
        this.emit('destroy', this);
        super.destroy();
        this.scenes.forEach((scene) => scene.destroy());
    }
}
/**
 * 场景
 */
class JlScene extends GraphicSceneBase {
    constructor(app, code, options) {
        super(options);
        Object.defineProperty(this, "code", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.code = code;
        this.app = app;
    }
}

/* eslint-disable @typescript-eslint/no-unused-vars */
/* eslint-disable @typescript-eslint/no-empty-function */
/**
 * 图形绘制助手
 */
class GraphicDrawAssistant extends AppInteractionPlugin {
    onEsc() {
        this.createAndStore(true);
    }
    constructor(graphicApp, graphicTemplate, icon, description) {
        super(graphicTemplate.type, graphicApp);
        Object.defineProperty(this, "__GraphicDrawAssistant", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: true
        });
        Object.defineProperty(this, "app", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "type", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 图形对象类型
        Object.defineProperty(this, "description", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 描述
        Object.defineProperty(this, "icon", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        }); // 界面显示的图标
        Object.defineProperty(this, "container", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new Container()
        });
        Object.defineProperty(this, "graphicTemplate", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "escListener", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new KeyListener({
                value: 'Escape',
                onRelease: () => {
                    this.onEsc();
                },
            })
        });
        this.app = graphicApp;
        this.type = graphicTemplate.type;
        this.graphicTemplate = graphicTemplate;
        this.icon = icon;
        this.description = description;
        this.app.registerGraphicTemplates(this.graphicTemplate);
    }
    get canvas() {
        return this.app.canvas;
    }
    bind() {
        this.app.drawing = true;
        const canvas = this.canvas;
        canvas.addChild(this.container);
        canvas.on('mousedown', this.onLeftDown, this);
        canvas.on('mousemove', this.onMouseMove, this);
        canvas.on('mouseup', this.onLeftUp, this);
        canvas.on('rightdown', this.onRightDown, this);
        canvas.on('rightup', this.onRightUp, this);
        canvas.on('_rightclick', this.onRightClick, this);
        this.app.viewport.wheel({
            percent: 0.01,
        });
        this.app.addKeyboardListener(this.escListener);
        this.app.viewport.drag({
            mouseButtons: 'right',
        });
    }
    unbind() {
        var _a;
        this.clearCache();
        const canvas = this.canvas;
        if ((_a = this.container) === null || _a === void 0 ? void 0 : _a.parent) {
            canvas.removeChild(this.container);
        }
        canvas.off('mousedown', this.onLeftDown, this);
        canvas.off('mousemove', this.onMouseMove, this);
        canvas.off('mouseup', this.onLeftUp, this);
        canvas.off('rightdown', this.onRightDown, this);
        canvas.off('rightup', this.onRightUp, this);
        this.app.viewport.plugins.remove('wheel');
        this.app.removeKeyboardListener(this.escListener);
        this.app.viewport.plugins.remove('drag');
        this.app.drawing = false;
    }
    onLeftDown(e) { }
    onMouseMove(e) {
        this.redraw(this.toCanvasCoordinates(e.global));
    }
    onLeftUp(e) { }
    onRightDown(e) { }
    onRightUp(e) { }
    onRightClick(e) {
        this.finish();
    }
    /**
     * 获取下一个id
     */
    nextId() {
        return GraphicIdGenerator.next();
    }
    clearCache() { }
    toCanvasCoordinates(p) {
        return this.app.toCanvasCoordinates(p);
    }
    /**
     * 保存创建的图形对象
     */
    storeGraphic(...graphics) {
        this.app.addGraphicAndRecord(...graphics);
    }
    /**
     * 创建并添加到图形App
     */
    createAndStore(finish) {
        const data = this.graphicTemplate.datas;
        data.id = this.nextId();
        data.graphicType = this.graphicTemplate.type;
        if (!this.prepareData(data)) {
            if (finish) {
                this.finish();
            }
            return null;
        }
        const template = this.graphicTemplate;
        const g = template.new();
        g.loadData(data);
        this.storeGraphic(g);
        if (finish) {
            this.finish(g);
        }
        return g;
    }
    /**
     * 绘制完成
     */
    finish(...graphics) {
        this.clearCache();
        this.app.interactionPlugin(CommonMouseTool.Name).resume();
        this.app.updateSelected(...graphics);
    }
}
/**
 * 绘制应用
 */
class JlDrawApp extends GraphicApp {
    get drawing() {
        return this._drawing;
    }
    set drawing(value) {
        this._drawing = value;
    }
    constructor(options) {
        super(options);
        Object.defineProperty(this, "font", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: BitmapFont.from('coordinates', {
                fontFamily: 'Roboto',
                fontSize: 16,
                fill: '#ff2700',
            }, { chars: ['画布坐标:() 屏幕坐标:() 缩放:.,', ['0', '9']] })
        });
        Object.defineProperty(this, "coordinates", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new BitmapText('画布坐标: (0, 0) 屏幕坐标:(0, 0)', {
                fontName: 'coordinates',
            })
        });
        Object.defineProperty(this, "scaleText", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: new BitmapText('缩放: 1', {
                fontName: 'coordinates',
            })
        });
        Object.defineProperty(this, "drawAssistants", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: []
        });
        Object.defineProperty(this, "_drawing", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: false
        });
        Object.defineProperty(this, "debouncedFormDataUpdator", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        Object.defineProperty(this, "formData", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: undefined
        });
        this.appendDrawStatesDisplay();
        // 拖拽操作记录
        this.appOperationRecord();
        // 绑定通用键盘操作
        this.bindKeyboardOperation();
        this.formDataSyncListen();
        this.debouncedFormDataUpdator = debounce(this.doFormDataUpdate, 60);
    }
    setOptions(options) {
        super.setOptions(options);
    }
    registerInteractionPlugin(...plugins) {
        plugins.forEach((plugin) => {
            if (plugin instanceof GraphicDrawAssistant) {
                this.drawAssistants.push(plugin);
            }
            super.registerInteractionPlugin(plugin);
        });
    }
    getDrawAssistant(graphicType) {
        const sda = this.drawAssistants
            .filter((da) => da.type === graphicType)
            .pop();
        if (!sda) {
            throw new Error(`未找到图形绘制助手: ${graphicType}`);
        }
        return sda;
    }
    appOperationRecord() {
        let dragStartDatas = [];
        this.on('drag_op_start', (e) => {
            // 图形拖拽，记录初始数据
            if (!e.target.isCanvas()) {
                dragStartDatas = this.selectedGraphics.map((g) => g.saveData());
            }
        });
        // 图形拖拽操作监听
        this.on('drag_op_end', () => {
            // 图形拖拽，记录操作
            if (dragStartDatas.length > 0) {
                const newData = this.selectedGraphics.map((g) => g.saveData());
                this.opRecord.record(new GraphicDataUpdateOperation(this, this.selectedGraphics, dragStartDatas, newData));
                dragStartDatas = [];
            }
        });
        // 菜单操作
        let preMenuHandleDatas = [];
        this.on('pre-menu-handle', (menu) => {
            if (menu.name === '撤销' || menu.name === '重做') {
                return;
            }
            preMenuHandleDatas = this.selectedGraphics.map((g) => g.saveData());
        });
        this.on('post-menu-handle', () => {
            if (preMenuHandleDatas.length > 0) {
                const newData = this.selectedGraphics.map((g) => g.saveData());
                this.opRecord.record(new GraphicDataUpdateOperation(this, this.selectedGraphics, preMenuHandleDatas, newData));
                preMenuHandleDatas = [];
            }
        });
    }
    /**
     * 绘制状态信息显示
     */
    appendDrawStatesDisplay() {
        this.pixi.stage.addChild(this.coordinates);
        this.pixi.stage.addChild(this.scaleText);
        const bound = this.coordinates.getLocalBounds();
        this.scaleText.position.set(bound.width + 10, 0);
        this.canvas.on('mousemove', (e) => {
            if (e.target) {
                const { x, y } = this.toCanvasCoordinates(e.global);
                const cpTxt = `(${x}, ${y})`;
                const tp = e.global;
                const tpTxt = `(${tp.x}, ${tp.y})`;
                this.coordinates.text = `画布坐标:${cpTxt} 屏幕坐标:${tpTxt}`;
                const bound = this.coordinates.getLocalBounds();
                this.scaleText.position.set(bound.width + 10, 0);
            }
        });
        this.viewport.on('zoomed-end', () => {
            this.scaleText.text = `缩放: ${this.viewport.scaled}`;
        });
    }
    bindKeyboardOperation() {
        this.addKeyboardListener(
        // Ctrl + A
        new KeyListener({
            value: 'KeyA',
            combinations: [CombinationKey.Ctrl],
            onPress: (e, app) => {
                if (e.ctrlKey) {
                    app.selectAllGraphics();
                }
            },
        }));
        // 复制功能
        this.addKeyboardListener(new KeyListener({
            value: 'KeyD',
            combinations: [CombinationKey.Shift],
            onPress: (e, app) => {
                this.graphicCopyPlugin.init();
            },
        }));
        this.addKeyboardListener(new KeyListener({
            // Ctrl + Z
            value: 'KeyZ',
            global: true,
            combinations: [CombinationKey.Ctrl],
            onPress: (e, app) => {
                app.opRecord.undo();
            },
        }));
        this.addKeyboardListener(new KeyListener({
            // Ctrl + Shift + Z
            value: 'KeyZ',
            global: true,
            combinations: [CombinationKey.Ctrl, CombinationKey.Shift],
            onPress: (e, app) => {
                app.opRecord.redo();
            },
        }));
        this.addKeyboardListener(new KeyListener({
            value: 'Delete',
            onPress: (e, app) => {
                app.deleteGraphicAndRecord(...app.selectedGraphics);
            },
        }));
        this.addKeyboardListener(new KeyListener({
            value: 'ArrowUp',
            pressTriggerAsOriginalEvent: true,
            onPress: (e, app) => {
                updateGraphicPositionOnKeyboardEvent(app, UP);
            },
            onRelease: (e, app) => {
                recordGraphicMoveOperation(app);
            },
        }));
        this.addKeyboardListener(new KeyListener({
            value: 'ArrowDown',
            pressTriggerAsOriginalEvent: true,
            onPress: (e, app) => {
                updateGraphicPositionOnKeyboardEvent(app, DOWN);
            },
            onRelease: (e, app) => {
                recordGraphicMoveOperation(app);
            },
        }));
        this.addKeyboardListener(new KeyListener({
            value: 'ArrowLeft',
            pressTriggerAsOriginalEvent: true,
            onPress: (e, app) => {
                updateGraphicPositionOnKeyboardEvent(app, LEFT);
            },
            onRelease: (e, app) => {
                recordGraphicMoveOperation(app);
            },
        }));
        this.addKeyboardListener(new KeyListener({
            value: 'ArrowRight',
            pressTriggerAsOriginalEvent: true,
            onPress: (e, app) => {
                updateGraphicPositionOnKeyboardEvent(app, RIGHT);
            },
            onRelease: (e, app) => {
                recordGraphicMoveOperation(app);
            },
        }));
    }
    /**
     * 图形对象存储处理,默认添加图形交互
     * @param graphic
     */
    beforeGraphicStore(graphic) {
        graphic.eventMode = 'static';
        graphic.selectable = true;
        graphic.draggable = true;
        graphic.on('repaint', () => {
            this.handleFormDataUpdate(graphic);
        });
        graphic.on('transformend', () => {
            this.handleFormDataUpdate(graphic);
        });
    }
    /**
     * 绑定form表单对象
     * @param form
     */
    bindFormData(form) {
        this.formData = form;
        if (this.formData && this.selectedGraphics.length == 1) {
            if (this.formData.graphicType == this.selectedGraphics[0].type) {
                this.formData.copyFrom(this.selectedGraphics[0].saveData());
            }
            else {
                this.formData = undefined;
            }
        }
    }
    /**
     * 移除form绑定
     * @param form
     */
    unbindFormData(form) {
        if (this.formData == form) {
            this.formData = undefined;
        }
    }
    formDataSyncListen() {
        this.on('graphicselected', () => {
            if (this.selectedGraphics.length == 1) {
                this.handleFormDataUpdate(this.selectedGraphics[0]);
            }
        });
    }
    /**
     * 处理表单数据更新（使用debounce限流）
     */
    handleFormDataUpdate(g) {
        this.debouncedFormDataUpdator(this, g);
    }
    doFormDataUpdate(g) {
        if (this.selectedGraphics.length > 1)
            return;
        if (this.formData && g.type === this.formData.graphicType) {
            this.formData.copyFrom(g.saveData());
        }
    }
    updateCanvasAndRecord(data) {
        const old = this.canvas.properties.clone();
        this.canvas.update(data);
        const newVal = this.canvas.properties.clone();
        this.opRecord.record(new UpdateCanvasOperation(this, this.canvas, old, newVal));
    }
    updateGraphicAndRecord(g, data) {
        const old = g.saveData();
        g.updateData(data);
        const newVal = g.saveData();
        this.opRecord.record(new GraphicDataUpdateOperation(this, [g], [old], [newVal]));
    }
}
let dragStartDatas = [];
function handleArrowKeyMoveGraphics(app, handler) {
    if (app.selectedGraphics.length === 1 &&
        app.selectedGraphics[0].hasSelectedChilds()) {
        recursiveChildren(app.selectedGraphics[0], (child) => {
            if (child.selected && child.draggable) {
                handler(child);
            }
        });
    }
    else {
        app.selectedGraphics.forEach((g) => {
            handler(g);
        });
    }
}
function updateGraphicPositionOnKeyboardEvent(app, dp) {
    let dragStart = false;
    if (dragStartDatas.length === 0) {
        dragStartDatas = app.selectedGraphics.map((g) => g.saveData());
        dragStart = true;
    }
    handleArrowKeyMoveGraphics(app, (g) => {
        if (dragStart) {
            g.shiftStartPoint = g.position.clone();
            g.emit('transformstart', GraphicTransformEvent.shift(g, ShiftData.new(g.shiftStartPoint)));
        }
        else {
            g.shiftLastPoint = g.position.clone();
        }
        g.position.x += dp.x;
        g.position.y += dp.y;
        if (!dragStart) {
            if (g.shiftStartPoint && g.shiftLastPoint) {
                g.emit('transforming', GraphicTransformEvent.shift(g, ShiftData.new(g.shiftStartPoint, g.position.clone(), g.shiftLastPoint)));
            }
        }
    });
}
function recordGraphicMoveOperation(app) {
    if (dragStartDatas.length > 0 &&
        dragStartDatas.length === app.selectedGraphics.length) {
        const newData = app.selectedGraphics.map((g) => g.saveData());
        app.opRecord.record(new GraphicDataUpdateOperation(app, app.selectedGraphics, dragStartDatas, newData));
        handleArrowKeyMoveGraphics(app, (g) => {
            if (g.shiftStartPoint) {
                g.emit('transformend', GraphicTransformEvent.shift(g, ShiftData.new(g.shiftStartPoint, g.position.clone())));
            }
        });
    }
    dragStartDatas = [];
}

/**
 * 实例化图形app
 * @param options
 * @returns
 */
function newGraphicApp(options) {
    return new GraphicApp(options);
}
/**
 * 实例化绘图app
 * @param options
 * @returns
 */
function newDrawApp(options) {
    return new JlDrawApp(options);
}

export { AbsorbableCircle, AbsorbableLine, AbsorbablePointParam, AnimationManager, AppConsts, AppDragEvent, AppInteractionPlugin, AppWsMsgBroker, BezierCurveEditPlugin, BoundsGraphic, ChildTransform, ClientEngine, CombinationKey, CommonMouseTool, ContextMenu, ContextMenuPlugin, DOWN, DashedLine, DefaultWhiteMenuOptions, DefaultWhiteStyleOptions, DragPlugin, DraggablePoint, DraggablePointParam, GlobalKeyboardHelper, GraphicAnimation, GraphicCopyPlugin, GraphicDataUpdateOperation, GraphicDrawAssistant, GraphicEditPlugin, GraphicIdGenerator, GraphicInteractionPlugin, GraphicRelation, GraphicRelationParam, GraphicStore, GraphicTransform, GraphicTransformEvent, GraphicTransformPlugin, IdGenerator, InteractionPluginBase, InteractionPluginType, JlGraphic, JlGraphicAppKeyboardPlugin, JlGraphicTemplate, JlOperation, KeyListener, LEFT, LineEditPlugin, OperationRecord, OtherInteractionPlugin, OutOfBound, PolylineEditPlugin, RIGHT, RelationManage, ScaleData, ShiftData, TransformPoints, UP, VectorGraphicUtil, VectorText, ViewportMovePlugin, WsMsgCli, addBezierWayPoint, addLineWayPoint, addPolygonSegmentingPoint, addWayPoint, angleOfIncludedAngle, angleToAxisx, assertBezierPoints, calculateBezierPoints, calculateDistanceFromPointToLine, calculateFootPointFromPointToLine, calculateIntersectionPointOfCircleAndLine, calculateIntersectionPointOfCircleAndPoint, calculateLineMidpoint, calculateLineSegmentingPoint, calculateMirrorPoint, calculateMirrorPointBasedOnAxis, calculateOneBezierPoints, circlePoint, circlePoint2, clearWayPoint, convertLineToPolygonPoints, convertRectangleToPolygonPoints, convertToBezierParams, debounce, deserializeTransformInto, distance, distance2, epsilon, floatEquals, getCenterOfTwoRectangle, getIntersectionPoint, getNormalVector, getParallelOfPolyline, getRectangleCenter, getWayLineIndex, getWaypointRangeIndex, isLineContainOther, isParallelLines, isPointOnLine, isZero, lineBox, lineLine, linePoint, linePolygon, movePointAlongNormal, newDrawApp, newGraphicApp, pointBox, pointPoint, pointPoint2, pointPolygon, polylineBox, polylinePoint, polylinePolygon, recursiveChildren, recursiveFindChild, recursiveFindParent, recursiveParents, removeBezierWayPoint, removeLineWayPoint, removeWayPoint, serializeTransform, splitLineEvenly, splitPolyline };