Don't lose selection when clicking over root #302

eclipse-sprotty · Feb 13, 2023 · 8a9044e · 8a9044e
1 parent e195a1c
commit 8a9044e
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 19 deletions.
diff --git a/packages/sprotty/src/features/select/select.ts b/packages/sprotty/src/features/select/select.ts
@@ -36,6 +36,7 @@ import { SButton } from '../button/model';
 import { SwitchEditModeAction } from '../edit/edit-routing';
 import { SRoutingHandle } from '../routing/model';
 import { SRoutableElement } from '../routing/model';
+import { getScrollbar } from '../viewport/scroll';
 import { isSelectable, Selectable } from './model';
 
 /**
@@ -212,12 +213,12 @@ export class SelectMouseListener extends MouseListener {
         const selectableTarget = findParentByFeature(target, isSelectable);
         if (selectableTarget !== undefined || target instanceof SModelRoot) {
             this.hasDragged = false;
+        }
+        if (selectableTarget !== undefined) {
             let deselectedElements: SModelElement[] = [];
             // multi-selection?
             if (!isCtrlOrCmd(event)) {
-                deselectedElements = toArray(target.root.index.all()
-                    .filter(element => isSelectable(element) && element.selected
-                        && !(selectableTarget instanceof SRoutingHandle && element === selectableTarget.parent as SModelElement)));
+                deselectedElements = this.collectElementsToDeselect(target, selectableTarget);
             }
             if (selectableTarget !== undefined) {
                 if (!selectableTarget.selected) {
@@ -236,6 +237,12 @@ export class SelectMouseListener extends MouseListener {
         return [];
     }
 
+    protected collectElementsToDeselect(target: SModelElement, selectableTarget: (SModelElement & Selectable) | undefined): SModelElement[] {
+        return toArray(target.root.index.all()
+        .filter(element => isSelectable(element) && element.selected
+            && !(selectableTarget instanceof SRoutingHandle && element === selectableTarget.parent as SModelElement)));
+    }
+
     protected handleButton(target: SModelElement, event: MouseEvent): (Action | Promise<Action>)[] | undefined {
         if (this.buttonHandlerRegistry !== undefined && target instanceof SButton && target.enabled) {
             const buttonHandler = this.buttonHandlerRegistry.get(target.type);
@@ -283,12 +290,17 @@ export class SelectMouseListener extends MouseListener {
         return [];
     }
 
-    override mouseUp(target: SModelElement, event: MouseEvent): Action[] {
+    override mouseUp(target: SModelElement, event: MouseEvent): (Action | Promise<Action>)[] {
         if (event.button === 0) {
             if (!this.hasDragged) {
                 const selectableTarget = findParentByFeature(target, isSelectable);
-                if (selectableTarget !== undefined && this.wasSelected) {
-                    return [new SelectAction([selectableTarget.id], [])];
+                if (selectableTarget !== undefined) {
+                    if (this.wasSelected) {
+                        return [new SelectAction([selectableTarget.id], [])];
+                    }
+                } else if (target instanceof SModelRoot && !getScrollbar(event)) {
+                    // Mouse up on root but not over ViewPort's scroll bars > deselect all
+                    return this.handleDeselectAll(this.collectElementsToDeselect(target, undefined), event);
                 }
             }
         }

diff --git a/packages/sprotty/src/features/viewport/scroll.ts b/packages/sprotty/src/features/viewport/scroll.ts
@@ -54,7 +54,7 @@ export class ScrollMouseListener extends MouseListener {
             const viewport = findParentByFeature(target, isViewport);
             if (viewport) {
                 this.lastScrollPosition = { x: event.pageX, y: event.pageY };
-                this.scrollbar = this.getScrollbar(event);
+                this.scrollbar = getScrollbar(event);
                 if (this.scrollbar) {
                     window.clearTimeout(this.scrollbarMouseDownTimeout);
                     return this.moveScrollBar(viewport, event, this.scrollbar, true)
@@ -106,7 +106,7 @@ export class ScrollMouseListener extends MouseListener {
     override doubleClick(target: SModelElement, event: MouseEvent): Action[] {
         const viewport = findParentByFeature(target, isViewport);
         if (viewport) {
-            const scrollbar = this.getScrollbar(event);
+            const scrollbar = getScrollbar(event);
             if (scrollbar) {
                 window.clearTimeout(this.scrollbarMouseDownTimeout);
                 const targetElement = this.findClickTarget(scrollbar, event);
@@ -179,17 +179,6 @@ export class ScrollMouseListener extends MouseListener {
         return [SetViewportAction.create(model.id, { scroll: newScroll, zoom: model.zoom }, { animate })];
     }
 
-    protected getScrollbar(event: MouseEvent): HTMLElement | undefined {
-        let element = event.target as HTMLElement | null;
-        while (element) {
-            if (element.classList && element.classList.contains('sprotty-projection-bar')) {
-                return element;
-            }
-            element = element.parentElement;
-        }
-        return undefined;
-    }
-
     protected getScrollbarOrientation(scrollbar: HTMLElement): 'horizontal' | 'vertical' {
         if (scrollbar.classList.contains('horizontal')) {
             return 'horizontal';
@@ -209,3 +198,13 @@ export class ScrollMouseListener extends MouseListener {
     }
 
 }
+export function getScrollbar(event: MouseEvent): HTMLElement | undefined {
+    let element = event.target as HTMLElement | null;
+    while (element) {
+        if (element.classList && element.classList.contains('sprotty-projection-bar')) {
+            return element;
+        }
+        element = element.parentElement;
+    }
+    return undefined;
+}