@eclipse-glsp/client 1.1.0-next.ac7a617.192 → 1.1.0-next.c40feb3.207

package/src/features/bounds/glsp-hidden-bounds-updater.ts

@@ -0,0 +1,88 @@
+/********************************************************************************
+ * Copyright (c) 2022 EclipseSource and others.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License v. 2.0 which is available at
+ * http://www.eclipse.org/legal/epl-2.0.
+ *
+ * This Source Code may also be made available under the following Secondary
+ * Licenses when the conditions for such availability set forth in the Eclipse
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
+ * with the GNU Classpath Exception which is available at
+ * https://www.gnu.org/software/classpath/license.html.
+ *
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+ ********************************************************************************/
+
+import {
+    Action, ComputedBoundsAction, Deferred, ElementAndRoutingPoints, RequestAction,
+    ResponseAction
+} from '@eclipse-glsp/protocol';
+import { inject, injectable, optional } from 'inversify';
+import { VNode } from 'snabbdom';
+import { EdgeRouterRegistry, HiddenBoundsUpdater, IActionDispatcher, SModelElement, SRoutableElement } from 'sprotty';
+import { calcElementAndRoute, isRoutable } from '../../utils/smodel-util';
+
+/**
+ * Grabs the bounds from hidden SVG DOM elements, applies layouts, collects routes and fires {@link ComputedBoundsAction}s.
+ *
+ * The actions will contain the bound, alignment, and routing points of elements.
+ */
+@injectable()
+export class GLSPHiddenBoundsUpdater extends HiddenBoundsUpdater {
+
+    @inject(EdgeRouterRegistry) @optional() protected readonly edgeRouterRegistry?: EdgeRouterRegistry;
+
+    protected element2route: ElementAndRoutingPoints[] = [];
+    protected edges: SRoutableElement[] = [];
+    protected nodes: VNode[] = [];
+
+    override decorate(vnode: VNode, element: SModelElement): VNode {
+        super.decorate(vnode, element);
+        if (isRoutable(element)) {
+            this.element2route.push(calcElementAndRoute(element, this.edgeRouterRegistry));
+        }
+        return vnode;
+    }
+
+    override postUpdate(cause?: Action): void {
+        const actions = this.captureActions(() => super.postUpdate(cause));
+        actions.filter(action => ComputedBoundsAction.is(action))
+            .forEach(action => this.actionDispatcher.dispatch(this.enhanceAction(action as ComputedBoundsAction)));
+        this.element2route = [];
+    }
+
+    protected captureActions(call: () => void): Action[] {
+        const capturingActionDispatcher = new CapturingActionDispatcher();
+        const actualActionDispatcher = this.actionDispatcher;
+        this.actionDispatcher = capturingActionDispatcher;
+        try {
+            call();
+            return capturingActionDispatcher.actions;
+        } finally {
+            this.actionDispatcher = actualActionDispatcher;
+        }
+    }
+
+    protected enhanceAction(action: ComputedBoundsAction): ComputedBoundsAction {
+        action.routes = this.element2route.length === 0 ? undefined : this.element2route;
+        return action;
+    }
+}
+
+class CapturingActionDispatcher implements IActionDispatcher {
+    readonly actions: Action[] = [];
+
+    async dispatch(action: Action): Promise<void> {
+        this.actions.push(action);
+    }
+
+    async dispatchAll(actions: Action[]): Promise<void> {
+        this.actions.push(...actions);
+    }
+
+    async request<Res extends ResponseAction>(action: RequestAction<Res>): Promise<Res> {
+        // ignore, not needed for our purposes
+        return new Deferred<Res>().promise;
+    }
+}

package/src/features/copy-paste/copy-paste-handler.ts

@@ -134,19 +134,15 @@ export class ServerCopyPasteHandler implements ICopyPasteHandler {
         }
     }
 
-    protected shouldCopy(_event: ClipboardEvent): boolean | null {
+    protected shouldCopy(_event: ClipboardEvent): boolean {
         return this.editorContext.get().selectedElementIds.length > 0 && this.isDiagramActive();
     }
 
-    protected shouldPaste(_event: ClipboardEvent): boolean | null {
+    protected shouldPaste(_event: ClipboardEvent): boolean {
         return this.isDiagramActive();
     }
 
-    private isDiagramActive(): boolean | null {
-        return (
-            document.activeElement instanceof SVGElement &&
-            document.activeElement.parentElement &&
-            document.activeElement.parentElement.id === this.viewerOptions.baseDiv
-        );
+    private isDiagramActive(): boolean {
+        return document.activeElement?.parentElement?.id === this.viewerOptions.baseDiv;
     }
 }

package/src/features/tools/change-bounds-tool.ts

@@ -13,7 +13,7 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import {
+ import {
     Action,
     Bounds,
     ChangeBoundsOperation,
@@ -44,10 +44,10 @@ import { DragAwareMouseListener } from '../../base/drag-aware-mouse-listener';
 import { TYPES } from '../../base/types';
 import { isValidMove, isValidSize } from '../../utils/layout-utils';
 import {
+    calcElementAndRoutingPoints,
     forEachElement,
     isNonRoutableSelectedMovableBoundsAware,
-    toElementAndBounds,
-    toElementAndRoutingPoints
+    toElementAndBounds
 } from '../../utils/smodel-util';
 import { isBoundsAwareMoveable, isResizable, Resizable, ResizeHandleLocation, SResizeHandle } from '../change-bounds/model';
 import {
@@ -237,19 +237,22 @@ export class ChangeBoundsListener extends DragAwareMouseListener implements Sele
     }
 
     protected handleMoveRoutingPointsOnServer(target: SModelElement): Operation[] {
-        const result: Operation[] = [];
         const newRoutingPoints: ElementAndRoutingPoints[] = [];
-        forEachElement(target.index, isNonRoutableSelectedMovableBoundsAware, element => {
+        const routerRegistry = this.tool.edgeRouterRegistry;
+        if (routerRegistry) {
             //  If client routing is enabled -> delegate routingpoints of connected edges to server
-            if (this.tool.edgeRouterRegistry && element instanceof SConnectableElement) {
-                element.incomingEdges.map(toElementAndRoutingPoints).forEach(ear => newRoutingPoints.push(ear));
-                element.outgoingEdges.map(toElementAndRoutingPoints).forEach(ear => newRoutingPoints.push(ear));
-            }
-        });
-        if (newRoutingPoints.length > 0) {
-            result.push(ChangeRoutingPointsOperation.create(newRoutingPoints));
+            forEachElement(target.index, isNonRoutableSelectedMovableBoundsAware, element => {
+                if (element instanceof SConnectableElement) {
+                    element.incomingEdges.map(connectable => calcElementAndRoutingPoints(connectable, routerRegistry))
+                        .forEach(ear => newRoutingPoints.push(ear));
+                    element.outgoingEdges.map(connectable => calcElementAndRoutingPoints(connectable, routerRegistry))
+                        .forEach(ear => newRoutingPoints.push(ear));
+                }
+            });
         }
-        return result;
+        return newRoutingPoints.length > 0
+         ? [ChangeRoutingPointsOperation.create(newRoutingPoints)]
+         : [];
     }
 
     protected handleResize(activeResizeHandle: SResizeHandle): Action[] {

package/src/features/tools/di.config.ts

@@ -15,7 +15,7 @@
  ********************************************************************************/
 import { TriggerEdgeCreationAction, TriggerNodeCreationAction } from '@eclipse-glsp/protocol';
 import { ContainerModule, interfaces } from 'inversify';
-import { configureActionHandler, configureModelElement } from 'sprotty';
+import { configureActionHandler, configureModelElement, ManhattanEdgeRouter } from 'sprotty';
 import { FocusStateChangedAction } from '../../base/actions/focus-change-action';
 import { TYPES } from '../../base/types';
 import { GLSPSvgExporter } from '../export/glsp-svg-exporter';
@@ -25,6 +25,7 @@ import { DelKeyDeleteTool, MouseDeleteTool } from './delete-tool';
 import { EdgeCreationTool } from './edge-creation-tool';
 import { EdgeEditTool } from './edge-edit-tool';
 import { EnableDefaultToolsOnFocusLossHandler } from './enable-default-tools-on-focus-loss';
+import { GSLPManhattanEdgeRouter } from './glsp-manhattan-edge-router';
 import { MarqueeMouseTool } from './marquee-mouse-tool';
 import { MarqueeTool } from './marquee-tool';
 import { MarqueeNode } from './model';
@@ -54,6 +55,9 @@ export const toolsModule = new ContainerModule((bind, _unbind, isBound, rebind)
 
     bind(GLSPSvgExporter).toSelf().inSingletonScope();
     rebind(TYPES.SvgExporter).toService(GLSPSvgExporter);
+
+    bind(GSLPManhattanEdgeRouter).toSelf().inSingletonScope();
+    rebind(ManhattanEdgeRouter).toService(GSLPManhattanEdgeRouter);
 });
 
 export function configureMarqueeTool(context: { bind: interfaces.Bind; isBound: interfaces.IsBound }): void {

package/src/features/tools/edge-edit-tool.ts

@@ -31,7 +31,7 @@ import {
 } from 'sprotty';
 import { DragAwareMouseListener } from '../../base/drag-aware-mouse-listener';
 import { TYPES } from '../../base/types';
-import { isRoutable, isRoutingHandle } from '../../utils/smodel-util';
+import { calcElementAndRoutingPoints, isRoutable, isRoutingHandle } from '../../utils/smodel-util';
 import { isReconnectable, isReconnectHandle, isSourceRoutingHandle, isTargetRoutingHandle, SReconnectHandle } from '../reconnect/model';
 import { SelectionListener, SelectionService } from '../select/selection-service';
 import { DrawFeedbackEdgeAction, feedbackEdgeId, RemoveFeedbackEdgeAction } from '../tool-feedback/creation-tool-feedback';
@@ -53,7 +53,7 @@ export class EdgeEditTool extends BaseGLSPTool {
 
     @inject(TYPES.SelectionService) protected selectionService: SelectionService;
     @inject(AnchorComputerRegistry) protected anchorRegistry: AnchorComputerRegistry;
-    @inject(EdgeRouterRegistry) @optional() protected edgeRouterRegistry?: EdgeRouterRegistry;
+    @inject(EdgeRouterRegistry) @optional() readonly edgeRouterRegistry?: EdgeRouterRegistry;
     @inject(TYPES.ISnapper) @optional() readonly snapper?: ISnapper;
 
     protected feedbackEdgeSourceMovingListener: FeedbackEdgeSourceMovingMouseListener;
@@ -237,16 +237,15 @@ class EdgeEditListener extends DragAwareMouseListener implements SelectionListen
             // reroute actions
             const latestEdge = target.index.getById(this.edge.id);
             if (latestEdge && isRoutable(latestEdge)) {
-                result.push(
-                    ChangeRoutingPointsOperation.create([{ elementId: latestEdge.id, newRoutingPoints: latestEdge.routingPoints }])
-                );
+                const newRoutingPoints = calcElementAndRoutingPoints(latestEdge, this.tool.edgeRouterRegistry);
+                result.push(ChangeRoutingPointsOperation.create([newRoutingPoints]));
                 this.routingHandle = undefined;
             }
         }
         return result;
     }
 
-    override mouseOver(target: SModelElement, event: MouseEvent): Action[] {
+    override mouseOver(target: SModelElement, _event: MouseEvent): Action[] {
         if (this.edge && this.isReconnecting()) {
             const currentTarget = findParentByFeature(target, isConnectable);
             if (!this.newConnectable || currentTarget !== this.newConnectable) {

package/src/features/tools/glsp-manhattan-edge-router.ts

@@ -0,0 +1,57 @@
+/********************************************************************************
+ * Copyright (c) 2022 EclipseSource and others.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License v. 2.0 which is available at
+ * http://www.eclipse.org/legal/epl-2.0.
+ *
+ * This Source Code may also be made available under the following Secondary
+ * Licenses when the conditions for such availability set forth in the Eclipse
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
+ * with the GNU Classpath Exception which is available at
+ * https://www.gnu.org/software/classpath/license.html.
+ *
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+ ********************************************************************************/
+
+import { almostEquals } from '@eclipse-glsp/protocol';
+import { ManhattanEdgeRouter, ResolvedHandleMove, SRoutableElement } from 'sprotty';
+
+export class GSLPManhattanEdgeRouter extends ManhattanEdgeRouter {
+    protected override applyInnerHandleMoves(edge: SRoutableElement, moves: ResolvedHandleMove[]): void {
+        const route = this.route(edge);
+        const routingPoints = edge.routingPoints;
+        const minimalPointDistance = this.getOptions(edge).minimalPointDistance;
+        moves.forEach(move => {
+            const handle = move.handle;
+            const index = handle.pointIndex;
+            const correctedX = this.correctX(routingPoints, index, move.toPosition.x, minimalPointDistance);
+            const correctedY = this.correctY(routingPoints, index, move.toPosition.y, minimalPointDistance);
+            switch (handle.kind) {
+                case 'manhattan-50%':
+                    if (index < 0) {
+                        if (routingPoints.length === 0) {
+                            routingPoints.push({ x: correctedX, y: correctedY });
+                            move.handle.pointIndex = 0;
+                        }
+                        else if (almostEquals(route[0].x, route[1].x)) { this.alignX(routingPoints, 0, correctedX); }
+                        else { this.alignY(routingPoints, 0, correctedY); }
+                    } else if (index < routingPoints.length - 1) {
+                        if (almostEquals(routingPoints[index].x, routingPoints[index + 1].x)) {
+                            this.alignX(routingPoints, index, correctedX);
+                            this.alignX(routingPoints, index + 1, correctedX);
+                        } else {
+                            this.alignY(routingPoints, index, correctedY);
+                            this.alignY(routingPoints, index + 1, correctedY);
+                        }
+                    } else {
+                        if (almostEquals(route[route.length - 2].x, route[route.length - 1].x)) {
+                            this.alignX(routingPoints, routingPoints.length - 1, correctedX);
+                        }
+                        else { this.alignY(routingPoints, routingPoints.length - 1, correctedY); }
+                    }
+                    break;
+            }
+        });
+    }
+}

package/src/utils/smodel-util.ts

@@ -13,14 +13,18 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { distinctAdd, ElementAndBounds, ElementAndRoutingPoints, remove, SModelElementSchema, TypeGuard } from '@eclipse-glsp/protocol';
+import {
+    distinctAdd, ElementAndBounds, ElementAndRoutingPoints, Point, remove, SModelElementSchema,
+    TypeGuard
+} from '@eclipse-glsp/protocol';
 import {
     BoundsAware,
+    EdgeRouterRegistry,
     isBoundsAware,
     isMoveable,
     isSelectable,
-    isSelected,
-    ModelIndexImpl,
+    isSelected, ModelIndexImpl,
+    RoutedPoint,
     Selectable,
     SModelElement,
     SRoutableElement,
@@ -214,7 +218,7 @@ export function toElementAndBounds(element: BoundsAwareModelElement): ElementAnd
 
 /**
  * Helper function to translate a given {@link SRoutableElement} into its corresponding
- * {@ElementAndRoutingPoints ElementAndBounds} representation.
+ * {@link ElementAndRoutingPoints} representation.
  * @param element The element to translate.
  * @returns The corresponding {@link ElementAndRoutingPoints} for the given element.
  */
@@ -225,6 +229,57 @@ export function toElementAndRoutingPoints(element: SRoutableElement): ElementAnd
     };
 }
 
+/** Pure routing point data kinds. */
+export const ROUTING_POINT_KINDS = ['linear', 'bezier-junction'];
+
+/** Pure route data kinds. */
+export const ROUTE_KINDS = [...ROUTING_POINT_KINDS, 'source', 'target'];
+
+/**
+ * Helper function to calculate the {@link ElementAndRoutingPoints} for a given {@link SRoutableElement}.
+ * If client layout is activated, i.e., the edge routing registry is given and has a router for the element, then the routing
+ * points from the calculated route are used, otherwise we use the already specified routing points of the {@link SRoutableElement}.
+ * @param element The element to translate.
+ * @param routerRegistry the edge router registry.
+ * @returns The corresponding {@link ElementAndRoutingPoints} for the given element.
+ */
+export function calcElementAndRoutingPoints(element: SRoutableElement, routerRegistry?: EdgeRouterRegistry): ElementAndRoutingPoints {
+    const newRoutingPoints = routerRegistry ? calcRoute(element, routerRegistry, ROUTING_POINT_KINDS) : element.routingPoints;
+    return { elementId: element.id, newRoutingPoints };
+}
+
+/**
+ * Helper function to calculate the route for a given {@link SRoutableElement}.
+ * If client layout is activated, i.e., the edge routing registry is given and has a router for the element, then the points
+ * from the calculated route are used, otherwise we use the already specified routing points of the {@link SRoutableElement}.
+ * @param element The element to translate.
+ * @param routerRegistry the edge router registry.
+ * @returns The corresponding route for the given element.
+ */
+export function calcElementAndRoute(element: SRoutableElement, routerRegistry?: EdgeRouterRegistry): ElementAndRoutingPoints {
+    let route: Point[] | undefined = routerRegistry ? calcRoute(element, routerRegistry, ROUTE_KINDS) : undefined;
+    if (!route) {
+        // add source and target to the routing points
+        route = [...element.routingPoints];
+        route.splice(0, 0, element.source?.position || Point.ORIGIN);
+        route.push(element.target?.position || Point.ORIGIN);
+    }
+    return { elementId: element.id, newRoutingPoints: route };
+}
+
+/**
+ * Helper function to calculate the route for a given {@link SRoutableElement}.
+ * @param element The element to translate.
+ * @param routerRegistry the edge router registry.
+ * @param pointKinds the routing point kinds that should be considered.
+ * @returns The corresponding route for the given element.
+ */
+export function calcRoute(element: SRoutableElement, routerRegistry: EdgeRouterRegistry, pointKinds?: string[]): RoutedPoint[] | undefined {
+    return routerRegistry?.get(element.routerKind).route(element)
+        .filter((point, idx, fullRoute) => idx === fullRoute.findIndex(otherPoint => otherPoint.x === point.x && otherPoint.y === point.y))
+        .filter(point => !pointKinds || pointKinds.includes(point.kind));
+}
+
 /**
  * Checks if the model is compatible with the passed type string.
  * (either has the same type or a subtype of this type)
@@ -247,3 +302,4 @@ export function getElementTypeId(input: SModelElement | SModelElementSchema | st
         return (input as any)['type'] as string;
     }
 }
+