Pass through gizmo drag observer messages

packages/dev/core/src/Behaviors/Meshes/index.ts

@@ -2,6 +2,7 @@ export * from "./attachToBoxBehavior";
 export * from "./fadeInOutBehavior";
 export * from "./multiPointerScaleBehavior";
 export * from "./pointerDragBehavior";
+export * from "./pointerDragEvents";
 export * from "./sixDofDragBehavior";
 export * from "./surfaceMagnetismBehavior";
 export * from "./baseSixDofDragBehavior";

packages/dev/core/src/Behaviors/Meshes/pointerDragBehavior.ts

@@ -15,6 +15,7 @@ import { CreatePlane } from "../../Meshes/Builders/planeBuilder";
 
 import type { IPointerEvent } from "../../Events/deviceInputEvents";
 import { Epsilon } from "../../Maths/math.constants";
+import type { DragEvent, DragStartEndEvent } from "./pointerDragEvents";
 
 /**
  * A behavior that when attached to a mesh will allow the mesh to be dragged around the screen based on pointer events
@@ -82,35 +83,16 @@ export class PointerDragBehavior implements Behavior<AbstractMesh> {
     private _moving = false;
     /**
      *  Fires each time the attached mesh is dragged with the pointer
-     *  * delta between last drag position and current drag position in world space
-     *  * dragDistance along the drag axis
-     *  * dragPlaneNormal normal of the current drag plane used during the drag
-     *  * dragPlanePoint in world space where the drag intersects the drag plane
-     *
-     *  (if validatedDrag is used, the position of the attached mesh might not equal dragPlanePoint)
      */
-    public onDragObservable = new Observable<{
-        delta: Vector3;
-        dragPlanePoint: Vector3;
-        dragPlaneNormal: Vector3;
-        dragDistance: number;
-        pointerId: number;
-        pointerInfo: Nullable<PointerInfo>;
-    }>();
+    public onDragObservable = new Observable<DragEvent>();
     /**
      *  Fires each time a drag begins (eg. mouse down on mesh)
-     *  * dragPlanePoint in world space where the drag intersects the drag plane
-     *
-     *  (if validatedDrag is used, the position of the attached mesh might not equal dragPlanePoint)
      */
-    public onDragStartObservable = new Observable<{ dragPlanePoint: Vector3; pointerId: number; pointerInfo: Nullable<PointerInfo> }>();
+    public onDragStartObservable = new Observable<DragStartEndEvent>();
     /**
      *  Fires each time a drag ends (eg. mouse release after drag)
-     *  * dragPlanePoint in world space where the drag intersects the drag plane
-     *
-     *  (if validatedDrag is used, the position of the attached mesh might not equal dragPlanePoint)
      */
-    public onDragEndObservable = new Observable<{ dragPlanePoint: Vector3; pointerId: number; pointerInfo: Nullable<PointerInfo> }>();
+    public onDragEndObservable = new Observable<DragStartEndEvent>();
     /**
      *  Fires each time behavior enabled state changes
      */

packages/dev/core/src/Behaviors/Meshes/pointerDragEvents.ts

@@ -0,0 +1,40 @@
+import type { PointerInfo } from "core/Events/pointerEvents";
+import type { Vector3 } from "core/Maths/math.vector";
+import type { Nullable } from "core/types";
+
+/**
+ * Event type for drag move events
+ */
+export type DragEvent = {
+    /**
+     * Delta between last drag position and current drag position in world space
+     */
+    delta: Vector3;
+    /**
+     * Point in world space where the drag intersects the drag plane
+     *
+     * (if validatedDrag is used, the position of the attached mesh might not equal dragPlanePoint)
+     */
+    dragPlanePoint: Vector3;
+    /**
+     * Normal of the current drag plane used during the drag
+     */
+    dragPlaneNormal: Vector3;
+    /**
+     * Distance along the drag axis
+     */
+    dragDistance: number;
+    /**
+     * Pointer id to use
+     */
+    pointerId: number;
+    /**
+     * Pointer info for the event (if any)
+     */
+    pointerInfo: Nullable<PointerInfo>;
+};
+
+/**
+ * Event type for drag start and end events
+ */
+export type DragStartEndEvent = Pick<DragEvent, "dragPlanePoint" | "pointerId" | "pointerInfo">;

packages/dev/core/src/Gizmos/positionGizmo.ts

@@ -18,6 +18,7 @@ import { UtilityLayerRenderer } from "../Rendering/utilityLayerRenderer";
 import type { PointerInfo } from "../Events/pointerEvents";
 import type { GizmoManager } from "./gizmoManager";
 import type { TransformNode } from "../Meshes/transformNode";
+import type { DragEvent, DragStartEndEvent } from "core/Behaviors/Meshes/pointerDragEvents";
 
 /**
  * Interface for position gizmo
@@ -38,11 +39,11 @@ export interface IPositionGizmo extends IGizmo {
     /** True when the mouse pointer is dragging a gizmo mesh */
     readonly isDragging: boolean;
     /** Fires an event when any of it's sub gizmos are dragged */
-    onDragStartObservable: Observable<unknown>;
+    onDragStartObservable: Observable<DragStartEndEvent>;
     /** Fires an event when any of it's sub gizmos are being dragged */
-    onDragObservable: Observable<unknown>;
+    onDragObservable: Observable<DragEvent>;
     /** Fires an event when any of it's sub gizmos are released from dragging */
-    onDragEndObservable: Observable<unknown>;
+    onDragEndObservable: Observable<DragStartEndEvent>;
     /**
      * If the planar drag gizmo is enabled
      * setting this will enable/disable XY, XZ and YZ planes regardless of individual gizmo settings.
@@ -115,11 +116,11 @@ export class PositionGizmo extends Gizmo implements IPositionGizmo {
     protected _gizmoAxisCache: Map<Mesh, GizmoAxisCache> = new Map();
 
     /** Fires an event when any of it's sub gizmos are dragged */
-    public onDragStartObservable = new Observable();
+    public onDragStartObservable = new Observable<DragStartEndEvent>();
     /** Fires an event when any of it's sub gizmos are being dragged */
-    public onDragObservable = new Observable();
+    public onDragObservable = new Observable<DragEvent>();
     /** Fires an event when any of it's sub gizmos are released from dragging */
-    public onDragEndObservable = new Observable();
+    public onDragEndObservable = new Observable<DragStartEndEvent>();
 
     /**
      * If set to true, planar drag is enabled
@@ -209,15 +210,9 @@ export class PositionGizmo extends Gizmo implements IPositionGizmo {
         // Relay drag events
         const gizmos = [this.xGizmo, this.yGizmo, this.zGizmo, this.xPlaneGizmo, this.yPlaneGizmo, this.zPlaneGizmo];
         for (const gizmo of gizmos) {
-            gizmo.dragBehavior.onDragStartObservable.add(() => {
-                this.onDragStartObservable.notifyObservers({});
-            });
-            gizmo.dragBehavior.onDragObservable.add(() => {
-                this.onDragObservable.notifyObservers({});
-            });
-            gizmo.dragBehavior.onDragEndObservable.add(() => {
-                this.onDragEndObservable.notifyObservers({});
-            });
+            gizmo.dragBehavior.onDragStartObservable.add(this.onDragStartObservable.notifyObservers.bind(this.onDragStartObservable));
+            gizmo.dragBehavior.onDragObservable.add(this.onDragObservable.notifyObservers.bind(this.onDragObservable));
+            gizmo.dragBehavior.onDragEndObservable.add(this.onDragEndObservable.notifyObservers.bind(this.onDragEndObservable));
         }
 
         this.attachedMesh = null;

packages/dev/core/src/Gizmos/rotationGizmo.ts

@@ -16,6 +16,7 @@ import type { Node } from "../node";
 import type { PointerInfo } from "../Events/pointerEvents";
 import type { TransformNode } from "../Meshes/transformNode";
 import type { GizmoManager } from "./gizmoManager";
+import type { DragEvent, DragStartEndEvent } from "core/Behaviors/Meshes/pointerDragEvents";
 
 /**
  * Interface for rotation gizmo
@@ -30,11 +31,11 @@ export interface IRotationGizmo extends IGizmo {
     /** Internal gizmo used for interactions on the z axis */
     zGizmo: IPlaneRotationGizmo;
     /** Fires an event when any of it's sub gizmos are dragged */
-    onDragStartObservable: Observable<unknown>;
+    onDragStartObservable: Observable<DragStartEndEvent>;
     /** Fires an event when any of it's sub gizmos are being dragged */
-    onDragObservable: Observable<unknown>;
+    onDragObservable: Observable<DragEvent>;
     /** Fires an event when any of it's sub gizmos are released from dragging */
-    onDragEndObservable: Observable<unknown>;
+    onDragEndObservable: Observable<DragStartEndEvent>;
     /** Drag distance in babylon units that the gizmo will snap to when dragged */
     snapDistance: number;
     /** Custom sensitivity value for the drag strength */
@@ -113,11 +114,11 @@ export class RotationGizmo extends Gizmo implements IRotationGizmo {
     public zGizmo: IPlaneRotationGizmo;
 
     /** Fires an event when any of it's sub gizmos are dragged */
-    public onDragStartObservable = new Observable();
+    public onDragStartObservable = new Observable<DragStartEndEvent>();
     /** Fires an event when any of it's sub gizmos are being dragged */
-    public onDragObservable = new Observable();
+    public onDragObservable = new Observable<DragEvent>();
     /** Fires an event when any of it's sub gizmos are released from dragging */
-    public onDragEndObservable = new Observable();
+    public onDragEndObservable = new Observable<DragStartEndEvent>();
 
     protected _meshAttached: Nullable<AbstractMesh>;
     protected _nodeAttached: Nullable<Node>;
@@ -243,15 +244,9 @@ export class RotationGizmo extends Gizmo implements IRotationGizmo {
             if (options && options.updateScale != undefined) {
                 gizmo.updateScale = options.updateScale;
             }
-            gizmo.dragBehavior.onDragStartObservable.add(() => {
-                this.onDragStartObservable.notifyObservers({});
-            });
-            gizmo.dragBehavior.onDragObservable.add(() => {
-                this.onDragObservable.notifyObservers({});
-            });
-            gizmo.dragBehavior.onDragEndObservable.add(() => {
-                this.onDragEndObservable.notifyObservers({});
-            });
+            gizmo.dragBehavior.onDragStartObservable.add(this.onDragStartObservable.notifyObservers.bind(this.onDragStartObservable));
+            gizmo.dragBehavior.onDragObservable.add(this.onDragObservable.notifyObservers.bind(this.onDragObservable));
+            gizmo.dragBehavior.onDragEndObservable.add(this.onDragEndObservable.notifyObservers.bind(this.onDragEndObservable));
         }
 
         this.attachedMesh = null;

packages/dev/core/src/Gizmos/scaleGizmo.ts

@@ -18,6 +18,7 @@ import type { PointerInfo } from "../Events/pointerEvents";
 import { StandardMaterial } from "../Materials/standardMaterial";
 import type { GizmoManager } from "./gizmoManager";
 import type { TransformNode } from "../Meshes/transformNode";
+import type { DragEvent, DragStartEndEvent } from "core/Behaviors/Meshes/pointerDragEvents";
 
 /**
  * Interface for scale gizmo
@@ -34,11 +35,11 @@ export interface IScaleGizmo extends IGizmo {
     /** Internal gizmo used to scale all axis equally*/
     uniformScaleGizmo: IAxisScaleGizmo;
     /** Fires an event when any of it's sub gizmos are dragged */
-    onDragStartObservable: Observable<unknown>;
+    onDragStartObservable: Observable<DragStartEndEvent>;
     /** Fires an event when any of it's sub gizmos are being dragged */
-    onDragObservable: Observable<unknown>;
+    onDragObservable: Observable<DragEvent>;
     /** Fires an event when any of it's sub gizmos are released from dragging */
-    onDragEndObservable: Observable<unknown>;
+    onDragEndObservable: Observable<DragStartEndEvent>;
     /** Drag distance in babylon units that the gizmo will snap to when dragged */
     snapDistance: number;
     /** Incremental snap scaling. When true, with a snapDistance of 0.1, scaling will be 1.1,1.2,1.3 instead of, when false: 1.1,1.21,1.33,... */
@@ -128,11 +129,11 @@ export class ScaleGizmo extends Gizmo implements IScaleGizmo {
         return this._disableMaterial;
     }
     /** Fires an event when any of it's sub gizmos are dragged */
-    public onDragStartObservable = new Observable();
+    public onDragStartObservable = new Observable<DragStartEndEvent>();
     /** Fires an event when any of it's sub gizmos are being dragged */
-    public onDragObservable = new Observable();
+    public onDragObservable = new Observable<DragEvent>();
     /** Fires an event when any of it's sub gizmos are released from dragging */
-    public onDragEndObservable = new Observable();
+    public onDragEndObservable = new Observable<DragStartEndEvent>();
 
     public override get attachedMesh() {
         return this._meshAttached;
@@ -220,15 +221,9 @@ export class ScaleGizmo extends Gizmo implements IScaleGizmo {
         // Relay drag events
         const gizmos = [this.xGizmo, this.yGizmo, this.zGizmo, this.uniformScaleGizmo];
         for (const gizmo of gizmos) {
-            gizmo.dragBehavior.onDragStartObservable.add(() => {
-                this.onDragStartObservable.notifyObservers({});
-            });
-            gizmo.dragBehavior.onDragObservable.add(() => {
-                this.onDragObservable.notifyObservers({});
-            });
-            gizmo.dragBehavior.onDragEndObservable.add(() => {
-                this.onDragEndObservable.notifyObservers({});
-            });
+            gizmo.dragBehavior.onDragStartObservable.add(this.onDragStartObservable.notifyObservers.bind(this.onDragStartObservable));
+            gizmo.dragBehavior.onDragObservable.add(this.onDragObservable.notifyObservers.bind(this.onDragObservable));
+            gizmo.dragBehavior.onDragEndObservable.add(this.onDragEndObservable.notifyObservers.bind(this.onDragEndObservable));
         }
 
         this.attachedMesh = null;

packages/dev/inspector/src/components/sceneExplorer/entities/sceneTreeItemComponent.tsx

@@ -23,6 +23,7 @@ import type { Bone } from "core/Bones/bone";
 
 import { setDebugNode } from "../treeNodeDebugger";
 import { FrameGraphUtils } from "core/FrameGraph/frameGraphUtils";
+import type { DragStartEndEvent } from "core/Behaviors/Meshes/pointerDragEvents";
 
 interface ISceneTreeItemComponentProps {
     scene: Scene;
@@ -43,9 +44,9 @@ export class SceneTreeItemComponent extends React.Component<
     private _onSelectionChangeObserver: Nullable<Observer<any>>;
     private _selectedEntity: any;
 
-    private _posDragEnd: Nullable<Observer<PropertyChangedEvent>> = null;
-    private _scaleDragEnd: Nullable<Observer<PropertyChangedEvent>> = null;
-    private _rotateDragEnd: Nullable<Observer<PropertyChangedEvent>> = null;
+    private _posDragEnd: Nullable<Observer<DragStartEndEvent>> = null;
+    private _scaleDragEnd: Nullable<Observer<DragStartEndEvent>> = null;
+    private _rotateDragEnd: Nullable<Observer<DragStartEndEvent>> = null;
 
     constructor(props: ISceneTreeItemComponentProps) {
         super(props);