GLSP-1531: Introduce viewport change event

Fixes eclipse-glsp/glsp/issues/1531

Author: tortmayr

packages/client/src/base/command-stack.ts

@@ -1,5 +1,5 @@
 /********************************************************************************
- * Copyright (c) 2019-2024 EclipseSource and others.
+ * Copyright (c) 2019-2025 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
@@ -14,6 +14,7 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 import {
+    BoundsAwareViewportCommand,
     CommandExecutionContext,
     CommandStack,
     Disposable,
@@ -23,7 +24,11 @@ import {
     ICommand,
     LazyInjector,
     SetModelCommand,
-    UpdateModelCommand
+    SetViewportCommand,
+    UpdateModelCommand,
+    Viewport,
+    almostEquals,
+    isViewport
 } from '@eclipse-glsp/sprotty';
 import { inject, injectable, preDestroy } from 'inversify';
 import { EditorContextService } from './editor-context-service';
@@ -33,6 +38,7 @@ export class GLSPCommandStack extends CommandStack implements Disposable {
     @inject(LazyInjector)
     protected lazyInjector: LazyInjector;
     protected toDispose = new DisposableCollection();
+    protected currentViewport?: Readonly<Viewport>;
 
     @preDestroy()
     dispose(): void {
@@ -95,13 +101,40 @@ export class GLSPCommandStack extends CommandStack implements Disposable {
     }
     override async execute(command: ICommand): Promise<GModelRoot> {
         const result = await super.execute(command);
-        if (command instanceof SetModelCommand || command instanceof UpdateModelCommand) {
+        if (this.isModelChangeCommand(command)) {
             this.notifyListeners(result);
+        } else if (this.isViewportChangeCommand(command)) {
+            this.notifyListeners(result, true);
         }
         return result;
     }
 
-    protected notifyListeners(root: Readonly<GModelRoot>): void {
-        this.editorContext.notifyModelRootChanged(root, this);
+    protected isModelChangeCommand(command: ICommand): boolean {
+        return command instanceof SetModelCommand || command instanceof UpdateModelCommand;
+    }
+
+    protected isViewportChangeCommand(command: ICommand): boolean {
+        return command instanceof SetViewportCommand || command instanceof BoundsAwareViewportCommand;
+    }
+
+    protected notifyListeners(root: Readonly<GModelRoot>, isViewportChange = false): void {
+        if (!isViewportChange) {
+            this.currentViewport = isViewport(root) ? { scroll: root.scroll, zoom: root.zoom } : undefined;
+            this.editorContext.notifyModelRootChanged(root, this);
+        } else if (isViewport(root) && this.hasViewportChanged(root)) {
+            this.currentViewport = { scroll: root.scroll, zoom: root.zoom };
+            this.editorContext.notifyViewportChanged(root, this);
+        }
+    }
+
+    protected hasViewportChanged(newViewport: Readonly<Viewport>): boolean {
+        if (!this.currentViewport) {
+            return true;
+        }
+        return !(
+            almostEquals(newViewport.zoom, this.currentViewport.zoom) &&
+            almostEquals(newViewport.scroll.x, this.currentViewport.scroll.x) &&
+            almostEquals(newViewport.scroll.y, this.currentViewport.scroll.y)
+        );
     }
 }

packages/client/src/base/editor-context-service.ts

@@ -143,6 +143,15 @@ export class EditorContextService implements IActionHandler, Disposable, IDiagra
         return this.selectionService.onSelectionChanged;
     }
 
+    protected onViewportChangedEmitter = new Emitter<Readonly<Viewport>>();
+    /**
+     * Event that is fired when the viewport of the diagram changes i.e. after the `CommandStack` has processed a viewport update.
+     * By default, this event is only fired if the viewport was changed via a `SetViewportCommand` or `BoundsAwareViewportCommand`
+     */
+    get onViewportChanged(): Event<Readonly<Viewport>> {
+        return this.onViewportChangedEmitter.event;
+    }
+
     protected toDispose = new DisposableCollection();
 
     @postConstruct()
@@ -196,6 +205,21 @@ export class EditorContextService implements IActionHandler, Disposable, IDiagra
         this.onModelRootChangedEmitter.fire(root);
     }
 
+    /**
+     * Notifies the service about a viewport change. This method should not be called
+     * directly. It is called by the `CommandStack` after a viewport modifying command has been processed.
+     * @throws an error if the notifier is not a `CommandStack`
+     * @param viewport the new viewport
+     * @param notifier the object that triggered the viewport change
+     */
+    notifyViewportChanged(viewport: Readonly<Viewport>, notifier: AnyObject): void {
+        if (!(notifier instanceof CommandStack)) {
+            throw new Error('Invalid viewport change notification. Notifier is not an instance of `CommandStack`.');
+        }
+
+        this.onViewportChangedEmitter.fire(viewport);
+    }
+
     handle(action: Action): void {
         if (SetEditModeAction.is(action)) {
             this.handleSetEditModeAction(action);