@wcardinal/wcardinal-geditor/dist/wcardinal/geditor/tool/e-tool-shape-create-line-connector.js

WebGL-based graphic editor, tester and viewer for supervisory systems

import { __extends } from "tslib";
import { DApplications, DControllers, EShapeAcceptorEdgeSide, EShapeAcceptorEdgeType, EShapeConnectorLine, EShapePointsMarkerType, UtilKeyboardEvent, UtilPointerEvent } from "@wcardinal/wcardinal-ui";
import { Point } from "pixi.js";
import { ECommandShapeCreate } from "../command/e-command-shape-create";
import { EToolImpl } from "./e-tool-impl";
import { EToolShapeAcceptorEdge } from "./e-tool-shape-acceptor-edge";
export var EToolShapeCreateLineConnectorPhase = {
    OFF: -1,
    TAIL: 0,
    HEAD: 1,
    DONE: 2
};
var EToolShapeCreateLineConnector = /** @class */ (function (_super) {
    __extends(EToolShapeCreateLineConnector, _super);
    function EToolShapeCreateLineConnector(options) {
        var _this = _super.call(this) || this;
        _this._options = options;
        _this._selection = options.selection;
        _this._diagram = options.diagram;
        _this._edge = new EToolShapeAcceptorEdge(options.diagram, false);
        _this._newShape = options.newShape || (function () { return _this.newShape(); });
        _this._phase = EToolShapeCreateLineConnectorPhase.OFF;
        _this._work = new Point();
        _this._onDownBound = function (e) {
            _this.onDown(e);
        };
        _this._onMoveBound = function (e) {
            _this.onMove(e);
        };
        _this._onUpBound = function (e) {
            _this.onUp(e);
        };
        _this._onKeyDownBound = function (e) {
            _this.onKeyDown(e);
        };
        _this._onSetBound = function (canvas) {
            _this.onSet(canvas);
        };
        _this._onUnsetBound = function (canvas) {
            _this.onUnset(canvas);
        };
        return _this;
    }
    EToolShapeCreateLineConnector.prototype.onActivate = function () {
        this._phase = EToolShapeCreateLineConnectorPhase.TAIL;
        var diagram = this._diagram;
        var layer = DApplications.getLayer(diagram);
        if (layer) {
            var interactionManager = layer.renderer.plugins.interaction;
            diagram.on(UtilPointerEvent.down, this._onDownBound);
            diagram.on(UtilPointerEvent.move, this._onMoveBound);
            var onUpBound = this._onUpBound;
            interactionManager.on(UtilPointerEvent.up, onUpBound);
            interactionManager.on(UtilPointerEvent.upoutside, onUpBound);
            interactionManager.on(UtilPointerEvent.cancel, onUpBound);
            diagram.on("keydown", this._onKeyDownBound);
            diagram.on("set", this._onSetBound);
            diagram.on("unset", this._onUnsetBound);
        }
        this._edge.begin(diagram.canvas, null);
        var selection = this._selection;
        selection.modifier.disallow();
        selection.updateModifier();
    };
    EToolShapeCreateLineConnector.prototype.onDeactivate = function () {
        var diagram = this._diagram;
        var layer = DApplications.getLayer(diagram);
        if (layer) {
            var interactionManager = layer.renderer.plugins.interaction;
            diagram.off(UtilPointerEvent.down, this._onDownBound);
            diagram.off(UtilPointerEvent.move, this._onMoveBound);
            var onUpBound = this._onUpBound;
            interactionManager.off(UtilPointerEvent.up, onUpBound);
            interactionManager.off(UtilPointerEvent.upoutside, onUpBound);
            interactionManager.off(UtilPointerEvent.cancel, onUpBound);
            diagram.off("keydown", this._onKeyDownBound);
            diagram.off("set", this._onSetBound);
            diagram.off("unset", this._onUnsetBound);
        }
        this._edge.end();
        var selection = this._selection;
        selection.modifier.allow();
        selection.updateModifier();
        var connector = this._connector;
        if (connector != null) {
            this._connector = undefined;
            connector.detach();
            connector.destroy();
        }
        this._phase = EToolShapeCreateLineConnectorPhase.OFF;
    };
    EToolShapeCreateLineConnector.prototype.onSet = function (canvas) {
        this._edge.begin(canvas, null);
    };
    EToolShapeCreateLineConnector.prototype.onUnset = function (canvas) {
        this._edge.end();
        var connector = this._connector;
        if (connector != null) {
            this._connector = undefined;
            connector.detach();
            connector.destroy();
        }
        this._phase = EToolShapeCreateLineConnectorPhase.TAIL;
    };
    EToolShapeCreateLineConnector.prototype.onDown = function (e) {
        var originalEvent = e.data.originalEvent;
        if (originalEvent.altKey) {
            return;
        }
        switch (this._phase) {
            case EToolShapeCreateLineConnectorPhase.OFF:
                break;
            case EToolShapeCreateLineConnectorPhase.TAIL:
                if (this.onTail(e)) {
                    this._phase = EToolShapeCreateLineConnectorPhase.HEAD;
                }
                break;
            case EToolShapeCreateLineConnectorPhase.HEAD:
                if (this.onHead(e)) {
                    this._phase = EToolShapeCreateLineConnectorPhase.DONE;
                }
                break;
            case EToolShapeCreateLineConnectorPhase.DONE:
                break;
        }
    };
    EToolShapeCreateLineConnector.prototype.onMove = function (e) {
        var originalEvent = e.data.originalEvent;
        if (originalEvent.altKey) {
            return;
        }
        switch (this._phase) {
            case EToolShapeCreateLineConnectorPhase.OFF:
                break;
            case EToolShapeCreateLineConnectorPhase.TAIL:
                this.onTail(e);
                break;
            case EToolShapeCreateLineConnectorPhase.HEAD:
                this.onHead(e);
                break;
            case EToolShapeCreateLineConnectorPhase.DONE:
                break;
        }
    };
    EToolShapeCreateLineConnector.prototype.onUp = function (e) {
        this.onDone();
    };
    EToolShapeCreateLineConnector.prototype.onTail = function (e) {
        var diagram = this._diagram;
        var layer = diagram.layer;
        if (layer) {
            var connector = this._connector;
            var global_1 = e.data.global;
            var local = layer.toLocal(global_1, undefined, this._work);
            var edge = this._edge.find(EShapeAcceptorEdgeType.TAIL, local.x, local.y);
            this._edge.update(EShapeAcceptorEdgeType.TAIL, local.x, local.y);
            if (this.isTailAccepted(connector, local, edge)) {
                if (connector == null) {
                    connector = this._newShape();
                    connector.fill.alpha = 1;
                    this._connector = connector;
                    connector.attach(layer);
                }
                this.onTailAccepted(connector, local, edge);
                DApplications.update(diagram);
                return true;
            }
            else {
                if (connector != null) {
                    this.onTailUnaccepted(connector, local);
                    DApplications.update(diagram);
                    return false;
                }
            }
        }
        return false;
    };
    EToolShapeCreateLineConnector.prototype.isDanglingEdgeAllowed = function () {
        var _a;
        return (_a = this._options.dangling) !== null && _a !== void 0 ? _a : false;
    };
    EToolShapeCreateLineConnector.prototype.isTailAccepted = function (connector, local, edge) {
        if (edge == null) {
            return this.isDanglingEdgeAllowed();
        }
        else {
            return true;
        }
    };
    EToolShapeCreateLineConnector.prototype.getTailType = function () {
        return EShapePointsMarkerType.CIRCLE;
    };
    EToolShapeCreateLineConnector.prototype.onTailAccepted = function (connector, local, edge) {
        connector.points.marker.tail.type = this.getTailType();
        if (edge != null) {
            connector.edge.tail.set(edge.shape, edge.id, edge.x, edge.y, 0, edge.local.x, edge.local.y, undefined, undefined, edge.acceptor.side);
            connector.edge.head.local.copyFrom(edge.local);
        }
        else {
            connector.edge.tail.set(null, null, null, null, 0, local.x, local.y, undefined, undefined, EShapeAcceptorEdgeSide.TOP);
            connector.edge.head.local.copyFrom(local);
        }
    };
    EToolShapeCreateLineConnector.prototype.onTailUnaccepted = function (connector, local) {
        connector.points.marker.tail.type = EShapePointsMarkerType.NONE;
        connector.edge.tail.set(null, null, null, null, 0, local.x, local.y, undefined, undefined, EShapeAcceptorEdgeSide.TOP);
        connector.edge.head.local.copyFrom(local);
    };
    EToolShapeCreateLineConnector.prototype.newShape = function () {
        var result = new EShapeConnectorLine();
        result.fill.alpha = 1;
        return result;
    };
    EToolShapeCreateLineConnector.prototype.onHead = function (e) {
        var diagram = this._diagram;
        var layer = diagram.layer;
        if (layer) {
            var connector = this._connector;
            if (connector) {
                var global_2 = e.data.global;
                var local = layer.toLocal(global_2, undefined, this._work);
                var edge = this._edge.find(EShapeAcceptorEdgeType.HEAD, local.x, local.y);
                this._edge.update(EShapeAcceptorEdgeType.HEAD, local.x, local.y);
                if (this.isHeadAccepted(connector, local, edge)) {
                    this.onHeadAccepted(connector, local, edge);
                    DApplications.update(diagram);
                    return true;
                }
                else {
                    this.onHeadUnaccepted(connector, local);
                    DApplications.update(diagram);
                    return false;
                }
            }
        }
        return false;
    };
    EToolShapeCreateLineConnector.prototype.isHeadAccepted = function (connector, local, edge) {
        if (edge == null) {
            return this.isDanglingEdgeAllowed();
        }
        else {
            return !this.isSameAcceptor(connector.edge.tail.acceptor, edge);
        }
    };
    EToolShapeCreateLineConnector.prototype.isSameAcceptor = function (a, b) {
        return a.shape === b.shape && a.edge === b.id && a.x === b.x && a.y === b.y;
    };
    EToolShapeCreateLineConnector.prototype.getHeadType = function () {
        return EShapePointsMarkerType.TRIANGLE;
    };
    EToolShapeCreateLineConnector.prototype.onHeadAccepted = function (connector, local, edge) {
        connector.points.marker.head.type = this.getHeadType();
        if (edge != null) {
            connector.edge.head.set(edge.shape, edge.id, edge.x, edge.y, 10, edge.local.x, edge.local.y, undefined, undefined, edge.acceptor.side);
        }
        else {
            connector.edge.head.set(null, null, null, null, 10, local.x, local.y, undefined, undefined, EShapeAcceptorEdgeSide.TOP);
        }
    };
    EToolShapeCreateLineConnector.prototype.onHeadUnaccepted = function (connector, local) {
        connector.points.marker.head.type = EShapePointsMarkerType.NONE;
        connector.edge.head.set(null, null, null, null, 0, local.x, local.y, undefined, undefined, EShapeAcceptorEdgeSide.TOP);
    };
    EToolShapeCreateLineConnector.prototype.onDone = function () {
        if (this._phase === EToolShapeCreateLineConnectorPhase.DONE) {
            this._phase = EToolShapeCreateLineConnectorPhase.OFF;
            var connector = this._connector;
            if (connector) {
                this._connector = undefined;
                var diagram = this._diagram;
                var layer = diagram.layer;
                if (layer) {
                    connector.edge.attach();
                    DControllers.getCommandController().push(new ECommandShapeCreate([connector], layer, this._selection, true));
                }
                else {
                    connector.detach();
                    connector.destroy();
                }
                this.emit("done", this);
            }
        }
    };
    EToolShapeCreateLineConnector.prototype.onCancel = function () {
        var connector = this._connector;
        if (connector != null) {
            this._connector = undefined;
            connector.detach();
            connector.destroy();
        }
        if (this._phase !== EToolShapeCreateLineConnectorPhase.OFF) {
            this._phase = EToolShapeCreateLineConnectorPhase.OFF;
            this.emit("cancel", this);
        }
    };
    EToolShapeCreateLineConnector.prototype.onKeyDown = function (e) {
        if (UtilKeyboardEvent.isCancelKey(e)) {
            this.onCancel();
        }
    };
    return EToolShapeCreateLineConnector;
}(EToolImpl));
export { EToolShapeCreateLineConnector };
//# sourceMappingURL=e-tool-shape-create-line-connector.js.map