private subscribeControlGhostToEvents()

in src/canvastools/ts/CanvasTools/Region/Component/BezierController.ts [184:278]
85 lines of code
11 McCabe index (conditional complexity)

    private subscribeControlGhostToEvents(controlGhostAnchor: Snap.Element) {
        const listeners: EventListeners = [
            {
                event: "pointerleave",
                base: controlGhostAnchor.node,
                listener: (e: PointerEvent) => {
                    if (!this.isDragged) {
                        window.requestAnimationFrame(() => {
                            this.controlGhostAnchor.attr({
                                display: "none",
                            });
                        });
                    }
                },
                bypass: true,
            },
            {
                event: "pointermove",
                base: controlGhostAnchor.node,
                listener: (e: PointerEvent) => {
                    if (this.isDragged) {
                        const ghost = (e.target as HTMLElement).getBoundingClientRect();
                        const rdx = e.clientX - ghost.left;
                        const rdy = e.clientY - ghost.top;

                        const offsetX = e.clientX - (e.target as Element).closest("svg").getBoundingClientRect().left;
                        const offsetY = e.clientY - (e.target as Element).closest("svg").getBoundingClientRect().top;

                        let dx = offsetX - this.dragOrigin.x;
                        let dy = offsetY - this.dragOrigin.y;

                        if ((rdx < 0 && dx > 0) || (rdx > 0 && dx < 0)) {
                            dx = 0;
                        }

                        if ((rdy < 0 && dy > 0) || (rdy > 0 && dy < 0)) {
                            dy = 0;
                        }

                        if (this.activeControlPointId) {
                            const controlPoint = this.getActiveControlPoint();
                            let p = new Point2D(controlPoint.x + dx, controlPoint.y + dy);

                            if (this.paperRect !== null) {
                                p = p.boundToRect(this.paperRect);
                            }
                            window.requestAnimationFrame(() => {
                                this.controlGhostAnchor.attr({ cx: p.x, cy: p.y });
                            });

                            this.updateRegion(p);
                        }

                        this.dragOrigin = new Point2D(offsetX, offsetY);
                    }
                },
                bypass: false,
            },
            {
                event: "pointerdown",
                base: controlGhostAnchor.node,
                listener: (e: PointerEvent) => {
                    this.controlGhostAnchor.node.setPointerCapture(e.pointerId);
                    const offsetX = e.clientX - (e.target as Element).closest("svg").getBoundingClientRect().left;
                    const offsetY = e.clientY - (e.target as Element).closest("svg").getBoundingClientRect().top;
                    this.dragOrigin = new Point2D(offsetX, offsetY);

                    this.isDragged = true;
                    this.callbacks.onManipulationLockRequest(this.anchorComponent);
                    this.callbacks.onChange(this.anchorComponent, this.regionData.copy(), ChangeEventType.MOVEBEGIN);
                },
                bypass: false,
            },
            {
                event: "pointerup",
                base: controlGhostAnchor.node,
                listener: (e: PointerEvent) => {
                    this.controlGhostAnchor.node.releasePointerCapture(e.pointerId);
                    this.callbacks.onManipulationLockRelease(this.anchorComponent);
                    this.callbacks.onChange(this.anchorComponent, this.regionData.copy(), ChangeEventType.MOVEEND);
                    this.activeControlPointId = undefined;
                    this.dragOrigin = null;
                    this.isDragged = false;
                    window.requestAnimationFrame(() => {
                        this.controlGhostAnchor.attr({
                            display: "none",
                        });
                    });
                },
                bypass: false,
            },
        ];

        this.subscribeToEvents(listeners);
    }