@eclipse-glsp/client 2.2.0-next.329 → 2.2.0-next.330

package/src/features/tools/node-creation/node-creation-tool.ts

@@ -18,20 +18,25 @@ import {
     CreateNodeOperation,
     GModelElement,
     GNode,
+    GhostElement,
     Point,
     TYPES,
     TriggerNodeCreationAction,
     findParentByFeature,
-    isCtrlOrCmd
+    isCtrlOrCmd,
+    isMoveable
 } from '@eclipse-glsp/sprotty';
 import { inject, injectable, optional } from 'inversify';
 import '../../../../css/ghost-element.css';
+import { FeedbackEmitter } from '../../../base';
 import { DragAwareMouseListener } from '../../../base/drag-aware-mouse-listener';
 import { CSS_GHOST_ELEMENT, CSS_HIDDEN, CursorCSS, cursorFeedbackAction } from '../../../base/feedback/css-feedback';
 import { EnableDefaultToolsAction } from '../../../base/tool-manager/tool';
+import { MoveableElement, isValidMove } from '../../../utils';
 import { getAbsolutePosition } from '../../../utils/viewpoint-util';
 import { IMovementRestrictor } from '../../change-bounds/movement-restrictor';
 import { PositionSnapper } from '../../change-bounds/position-snapper';
+import { RemoveTemplateElementsAction } from '../../element-template';
 import { AddTemplateElementsAction, getTemplateElementId } from '../../element-template/add-template-element';
 import { MouseTrackingElementPositionListener, PositioningTool } from '../../element-template/mouse-tracking-element-position-listener';
 import { Containable, isContainable } from '../../hints/model';
@@ -53,34 +58,39 @@ export class NodeCreationTool extends BaseCreationTool<TriggerNodeCreationAction
     doEnable(): void {
         let trackingListener: MouseTrackingElementPositionListener | undefined;
         const ghostElement = this.triggerAction.ghostElement;
-        if (ghostElement) {
-            trackingListener = new MouseTrackingElementPositionListener(getTemplateElementId(ghostElement.template), this, 'middle');
-            this.toDisposeOnDisable.push(
-                this.registerFeedback(
-                    [AddTemplateElementsAction.create({ templates: [ghostElement.template], addClasses: [CSS_HIDDEN, CSS_GHOST_ELEMENT] })],
-                    ghostElement
-                ),
-                this.mouseTool.registerListener(trackingListener)
-            );
+        const ghostElementId = ghostElement ? getTemplateElementId(ghostElement.template) : undefined;
+        if (ghostElement && ghostElementId) {
+            trackingListener = new MouseTrackingElementPositionListener(ghostElementId, this, 'middle');
+            this.toDisposeOnDisable.push(trackingListener, this.mouseTool.registerListener(trackingListener));
         }
 
+        const toolListener = new NodeCreationToolMouseListener(this.triggerAction, this, ghostElement);
         this.toDisposeOnDisable.push(
-            this.mouseTool.registerListener(new NodeCreationToolMouseListener(this.triggerAction, this, trackingListener)),
-            this.registerFeedback([cursorFeedbackAction(CursorCSS.NODE_CREATION)], this, [cursorFeedbackAction()])
+            toolListener,
+            this.mouseTool.registerListener(toolListener),
+            this.createFeedbackEmitter().add(cursorFeedbackAction(CursorCSS.NODE_CREATION), cursorFeedbackAction()).submit()
         );
     }
 }
 
-@injectable()
 export class NodeCreationToolMouseListener extends DragAwareMouseListener {
     protected container?: GModelElement & Containable;
+    protected cursorFeedback: FeedbackEmitter;
+    protected ghostElementFeedback: FeedbackEmitter;
+    protected ghostElementId?: string;
 
     constructor(
         protected triggerAction: TriggerNodeCreationAction,
         protected tool: NodeCreationTool,
-        protected trackingListener?: MouseTrackingElementPositionListener
+        protected ghostElement?: GhostElement
     ) {
         super();
+        this.cursorFeedback = tool.createFeedbackEmitter();
+        this.ghostElementFeedback = tool.createFeedbackEmitter();
+        if (ghostElement) {
+            this.ghostElementId = getTemplateElementId(ghostElement.template);
+        }
+        this.createGhostElement();
     }
 
     protected creationAllowed(elementTypeId: string): boolean | undefined {
@@ -98,24 +108,48 @@ export class NodeCreationToolMouseListener extends DragAwareMouseListener {
         }
 
         if (this.creationAllowed(this.elementTypeId)) {
-            const containerId = this.container ? this.container.id : undefined;
-            const location = this.getInsertPosition(target, event);
-            result.push(CreateNodeOperation.create(this.elementTypeId, { location, containerId, args: this.triggerAction.args }));
+            const location = this.getValidInsertPosition(target, event);
+            if (location) {
+                const containerId = this.container?.id;
+                result.push(CreateNodeOperation.create(this.elementTypeId, { location, containerId, args: this.triggerAction.args }));
+            }
             if (!isCtrlOrCmd(event)) {
+                // we no longer want to show the ghost element AFTER the next update
+                this.ghostElementFeedback.discard();
                 result.push(EnableDefaultToolsAction.create());
             } else {
-                this.tool.deregisterFeedback(this);
+                // we continue in stamp mode so we keep the ghost but dispose everything else
+                this.disposeAllButGhostElement();
             }
         }
         return result;
     }
 
-    protected getInsertPosition(target: GModelElement, event: MouseEvent): Point {
-        if (this.trackingListener) {
-            const trackedPosition = this.trackingListener.currentPosition;
-            if (trackedPosition) {
-                return trackedPosition;
-            }
+    protected createGhostElement(): void {
+        if (!this.ghostElement) {
+            return;
+        }
+        const templates = [this.ghostElement.template];
+        this.ghostElementFeedback
+            .add(
+                AddTemplateElementsAction.create({ templates, addClasses: [CSS_HIDDEN, CSS_GHOST_ELEMENT] }),
+                RemoveTemplateElementsAction.create({ templates })
+            )
+            .submit();
+    }
+
+    protected getGhostElement(): MoveableElement | undefined {
+        if (!this.ghostElementId) {
+            return undefined;
+        }
+        const ghostElement = this.container?.index.getById(this.ghostElementId);
+        return ghostElement && isMoveable(ghostElement) ? ghostElement : undefined;
+    }
+
+    protected getValidInsertPosition(target: GModelElement, event: MouseEvent): Point | undefined {
+        const ghostElement = this.getGhostElement();
+        if (ghostElement) {
+            return isValidMove(ghostElement, ghostElement.position, this.tool.movementRestrictor) ? ghostElement.position : undefined;
         }
         const location = getAbsolutePosition(target, event);
 
@@ -132,8 +166,18 @@ export class NodeCreationToolMouseListener extends DragAwareMouseListener {
             const feedback = this.creationAllowed(this.elementTypeId)
                 ? cursorFeedbackAction(CursorCSS.NODE_CREATION)
                 : cursorFeedbackAction(CursorCSS.OPERATION_NOT_ALLOWED);
-            this.tool.registerFeedback([feedback]);
+            this.cursorFeedback.add(feedback).submit();
         }
         return [];
     }
+
+    protected disposeAllButGhostElement(): void {
+        this.cursorFeedback.dispose();
+        super.dispose();
+    }
+
+    override dispose(): void {
+        this.ghostElementFeedback.dispose();
+        this.disposeAllButGhostElement();
+    }
 }

package/src/features/validation/marker-navigator.ts

@@ -15,7 +15,6 @@
  ********************************************************************************/
 import {
     Action,
-    BoundsAware,
     CenterAction,
     GIssueSeverity,
     GModelElement,
@@ -26,7 +25,6 @@ import {
     MenuItem,
     Point,
     SelectAction,
-    Selectable,
     TYPES,
     findParentByFeature,
     hasArrayProp,
@@ -38,7 +36,7 @@ import {
 import { inject, injectable } from 'inversify';
 import { GLSPActionDispatcher } from '../../base/action-dispatcher';
 import { SelectionService } from '../../base/selection-service';
-import { getElements, isSelectableAndBoundsAware } from '../../utils/gmodel-util';
+import { BoundsAwareModelElement, SelectableElement, getElements, isSelectableAndBoundsAware } from '../../utils/gmodel-util';
 import { MarkerPredicates, collectIssueMarkers } from '../../utils/marker';
 import { GIssueMarker } from './issue-marker';
 
@@ -110,7 +108,7 @@ export class MarkerNavigator {
 
     next(
         root: Readonly<GModelRoot>,
-        current?: GModelElement & BoundsAware,
+        current?: BoundsAwareModelElement,
         predicate: (marker: GIssueMarker) => boolean = MarkerPredicates.ALL
     ): GIssueMarker | undefined {
         const markers = this.getMarkers(root, predicate);
@@ -122,7 +120,7 @@ export class MarkerNavigator {
 
     previous(
         root: Readonly<GModelRoot>,
-        current?: GModelElement & BoundsAware,
+        current?: BoundsAwareModelElement,
         predicate: (marker: GIssueMarker) => boolean = MarkerPredicates.ALL
     ): GIssueMarker | undefined {
         const markers = this.getMarkers(root, predicate);
@@ -137,7 +135,7 @@ export class MarkerNavigator {
         return markers.filter(predicate).sort(this.markerComparator.compare);
     }
 
-    protected getNextIndex(current: GModelElement & BoundsAware, markers: GIssueMarker[]): number {
+    protected getNextIndex(current: BoundsAwareModelElement, markers: GIssueMarker[]): number {
         for (let index = 0; index < markers.length; index++) {
             if (this.markerComparator.compare(markers[index], current) > 0) {
                 return index;
@@ -146,7 +144,7 @@ export class MarkerNavigator {
         return 0;
     }
 
-    protected getPreviousIndex(current: GModelElement & BoundsAware, markers: GIssueMarker[]): number {
+    protected getPreviousIndex(current: BoundsAwareModelElement, markers: GIssueMarker[]): number {
         for (let index = markers.length - 1; index >= 0; index--) {
             if (this.markerComparator.compare(markers[index], current) < 0) {
                 return index;
@@ -182,7 +180,7 @@ export class NavigateToMarkerActionHandler implements IActionHandler {
         }
     }
 
-    protected getSelectedElements(action: NavigateToMarkerAction): (GModelElement & Selectable)[] {
+    protected getSelectedElements(action: NavigateToMarkerAction): SelectableElement[] {
         if (action.selectedElementIds && action.selectedElementIds.length > 0) {
             return getElements(this.selectionService.getModelRoot().index, action.selectedElementIds, isSelectable);
         }

package/src/features/validation/validate.ts

@@ -28,6 +28,7 @@ import {
     hasArrayProp
 } from '@eclipse-glsp/sprotty';
 import { inject, injectable, optional } from 'inversify';
+import { FeedbackEmitter } from '../../base';
 import { EditorContextService } from '../../base/editor-context-service';
 import { IFeedbackActionDispatcher, IFeedbackEmitter } from '../../base/feedback/feedback-action-dispatcher';
 import { FeedbackCommand } from '../../base/feedback/feedback-command';
@@ -42,7 +43,7 @@ import { GIssueMarker, createGIssue, getGIssueMarker, getOrCreateGIssueMarker, g
 export class ValidationFeedbackEmitter implements IFeedbackEmitter {
     @inject(TYPES.IFeedbackActionDispatcher) protected feedbackActionDispatcher: IFeedbackActionDispatcher;
 
-    protected registeredFeedbackByReason: Map<string, { action: ApplyMarkersAction; emitter: IFeedbackEmitter }> = new Map();
+    protected registeredFeedbackByReason: Map<string, FeedbackEmitter> = new Map();
 
     /**
      * Register the action that should be emitted for visualizing validation feedback.
@@ -51,25 +52,9 @@ export class ValidationFeedbackEmitter implements IFeedbackEmitter {
      */
     registerValidationFeedbackAction(action: ApplyMarkersAction, reason = ''): void {
         // De-register feedback and clear existing markers with the same reason
-        const previousFeedbackWithSameReason = this.registeredFeedbackByReason.get(reason);
-        let emitter: IFeedbackEmitter | undefined;
-        if (previousFeedbackWithSameReason) {
-            emitter = previousFeedbackWithSameReason.emitter;
-            const deleteMarkersAction = DeleteMarkersAction.create(previousFeedbackWithSameReason.action.markers);
-            this.feedbackActionDispatcher.deregisterFeedback(emitter, [deleteMarkersAction]);
-        }
-
-        if (!emitter) {
-            emitter = this.createEmitter(reason);
-        }
-
-        // Register new action responsible for applying markers and re-applying them when the model is updated
-        this.registeredFeedbackByReason.set(reason, { action, emitter });
-        this.feedbackActionDispatcher.registerFeedback(emitter, [action]);
-    }
-
-    protected createEmitter(reason: string): IFeedbackEmitter {
-        return { id: 'validationFeedbackEmitter_' + reason };
+        const emitter = this.registeredFeedbackByReason.get(reason)?.dispose() ?? this.feedbackActionDispatcher.createEmitter();
+        emitter.add(action, () => DeleteMarkersAction.create(action.markers)).submit();
+        this.registeredFeedbackByReason.set(reason, emitter);
     }
 }
 

package/src/utils/gmodel-util.ts

@@ -25,6 +25,7 @@ import {
     GParentElement,
     GRoutableElement,
     GRoutingHandle,
+    Locateable,
     ModelIndexImpl,
     Point,
     RoutedPoint,
@@ -194,17 +195,30 @@ export function isRoutingHandle(element: GModelElement | undefined): element is
 export function isSelectableAndBoundsAware(element: GModelElement): element is SelectableBoundsAware {
     return isSelectable(element) && isBoundsAware(element);
 }
+/**
+ * Union type to describe {@link GModelElement}s that implement the {@link Selectable} feature.
+ */
+export type SelectableElement = GModelElement & Selectable;
 
 /**
  * Union type to describe {@link GModelElement}s that implement the {@link Selectable} and {@link BoundsAware} feature.
  */
-export type SelectableBoundsAware = GModelElement & BoundsAware & Selectable;
+export type SelectableBoundsAware = SelectableElement & BoundsAware;
 
 /**
  * Union type to describe {@link GModelElement}s that implement the {@link BoundsAware} feature.
  */
 export type BoundsAwareModelElement = GModelElement & BoundsAware;
 
+/**
+ * Union type to describe {@link GModelElement}s that implement the {@link Locateable} feature.
+ */
+export type MoveableElement = GModelElement & Locateable;
+
+export interface Resizable extends BoundsAware, Selectable {}
+
+export interface ResizableModelElement extends GParentElement, Resizable {}
+
 /**
  * Helper function to translate a given {@link GModelElement} into its corresponding {@link ElementAndBounds} representation.
  * @param element The element to translate.
@@ -373,3 +387,32 @@ export function getDescendantIds(element?: GModelElement, skip?: (t: GModelEleme
     }
     return ids;
 }
+
+/**
+ * Returns a filter function that checks if the given element is not a descendant of any of the given elements.
+ *
+ * @param elements  The elements that the element should not be a descendant of.
+ * @returns the filter function
+ */
+export function isNotDescendantOfAnyElement<T extends GModelElement>(elements: FluentIterable<T>): (element: T) => boolean {
+    const elementsSet = new Set<GModelElement>(elements);
+    return (element: T): boolean => {
+        let parent: GModelElement = element;
+        while (parent instanceof GChildElement) {
+            parent = parent.parent;
+            if (elementsSet.has(parent)) {
+                return false;
+            }
+        }
+        return true;
+    };
+}
+
+/**
+ * Removes any descendants of the given elements from the given elements.
+ * @param elements The elements to filter.
+ * @returns the filtered elements
+ */
+export function removeDescendants<T extends GModelElement>(elements: FluentIterable<T>): FluentIterable<T> {
+    return elements.filter(isNotDescendantOfAnyElement(elements));
+}

package/src/utils/layout-utils.ts

@@ -13,19 +13,11 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import {
-    BoundsAware,
-    Dimension,
-    ElementAndBounds,
-    ElementMove,
-    ModelLayoutOptions,
-    Point,
-    GModelElement,
-    Writable
-} from '@eclipse-glsp/sprotty';
+import { Dimension, ElementAndBounds, ElementMove, GModelElement, ModelLayoutOptions, Point, Writable } from '@eclipse-glsp/sprotty';
 import { IMovementRestrictor } from '../features/change-bounds/movement-restrictor';
+import { BoundsAwareModelElement } from './gmodel-util';
 
-export function minWidth(element: GModelElement & BoundsAware): number {
+export function minWidth(element: BoundsAwareModelElement): number {
     const layoutOptions = getLayoutOptions(element);
     if (layoutOptions !== undefined && typeof layoutOptions.minWidth === 'number') {
         return layoutOptions.minWidth;
@@ -33,7 +25,7 @@ export function minWidth(element: GModelElement & BoundsAware): number {
     return 1;
 }
 
-export function minHeight(element: GModelElement & BoundsAware): number {
+export function minHeight(element: BoundsAwareModelElement): number {
     const layoutOptions = getLayoutOptions(element);
     if (layoutOptions !== undefined && typeof layoutOptions.minHeight === 'number') {
         return layoutOptions.minHeight;
@@ -49,19 +41,16 @@ export function getLayoutOptions(element: GModelElement): ModelLayoutOptions | u
     return undefined;
 }
 
-export function isValidSize(element: GModelElement & BoundsAware, size: Dimension): boolean {
+export function isValidSize(element: BoundsAwareModelElement, size: Dimension): boolean {
     return size.width >= minWidth(element) && size.height >= minHeight(element);
 }
 
-export function isValidMove(element: GModelElement & BoundsAware, newPosition?: Point, movementRestrictor?: IMovementRestrictor): boolean {
-    if (movementRestrictor) {
-        return movementRestrictor.validate(element, newPosition);
-    }
-    return true;
+export function isValidMove(element: GModelElement, newPosition?: Point, movementRestrictor?: IMovementRestrictor): boolean {
+    return movementRestrictor?.validate(element, newPosition) ?? true;
 }
 
 export function toValidElementMove(
-    element: GModelElement & BoundsAware,
+    element: BoundsAwareModelElement,
     move: ElementMove,
     movementRestrictor?: IMovementRestrictor
 ): ElementMove | undefined {
@@ -72,7 +61,7 @@ export function toValidElementMove(
 }
 
 export function toValidElementAndBounds(
-    element: GModelElement & BoundsAware,
+    element: BoundsAwareModelElement,
     bounds: Writable<ElementAndBounds>,
     movementRestrictor?: IMovementRestrictor
 ): ElementAndBounds | undefined {

package/src/utils/viewpoint-util.ts

@@ -16,7 +16,6 @@
 
 import {
     Bounds,
-    BoundsAware,
     Dimension,
     GChildElement,
     GModelElement,
@@ -74,7 +73,7 @@ export function getViewportBounds(target: GModelElement, bounds: Bounds): Bounds
  *
  * @param target  A bounds-aware element from the diagram
  */
-export function toAbsoluteBounds(element: GModelElement & BoundsAware): Bounds {
+export function toAbsoluteBounds(element: BoundsAwareModelElement): Bounds {
     const location = isAlignable(element) ? element.alignment : Point.ORIGIN;
     const x = location.x;
     const y = location.y;
@@ -89,7 +88,7 @@ export function toAbsoluteBounds(element: GModelElement & BoundsAware): Bounds {
  *
  * @param target  A bounds-aware element from the diagram
  */
-export function toAbsolutePosition(target: GModelElement & BoundsAware): Point {
+export function toAbsolutePosition(target: BoundsAwareModelElement): Point {
     return toAbsoluteBounds(target);
 }
 
@@ -99,7 +98,7 @@ export function toAbsolutePosition(target: GModelElement & BoundsAware): Point {
  *
  * @param target  A bounds-aware element from the diagram
  */
-export function toAbsoluteSize(target: GModelElement & BoundsAware): Dimension {
+export function toAbsoluteSize(target: BoundsAwareModelElement): Dimension {
     return toAbsoluteBounds(target);
 }