ShiftKey is not updated in onDragObservable

Bugs
1

Hi,
I am creating a graphics-editor-like application and I want to make an object moveable with the mouse. Further, I want to limit the movement along the dominant axis when the user presses shift, so the user can move the object only either along the X or Y.

I got this mostly working using a pointer drag behavior. I was positively surprised that I already get shiftKey within event.pointerInfo.event.shiftKey from the event that is passed to onDragObservable. However, this shiftKey field is not updated when moving the mouse but it only carries the state of the shift key when the mouse was pressed. For me, this is not intuitive as there is a separate event handler for onDragStartObservable and I consider every move as a separate new event.

So here is a playground: https://playground.babylonjs.com/#YEZPVT#2176
You can move the sphere freely around. When you press shift before mouse down, you can only move the sphere along the x-axis. I’d like to switch whether I want the restriction or not during the active move operation.

Bonus questions:

  • In order to implement the behavior, I stored the original position. Is there a way to archive this without adding my own piece of state here? Maybe by somehow dynamically update what was passed to the constructor, i.e. the dragPlane or dragAxis?
  • Even if babylon updated the shiftKey, it would not send an “event”, so the user would have to slightly move the mouse in order to get some visual feedback. Any thoughts on this? Currently, I fear I have to listen to shift from some other place and then merge both event streams. I am also missing a manual method to issue onDragObservable. There are methods for manually sending the start and stop events though.

Thank everyone for your thoughts.

2

Adding @Cedric and @PolygonalSun our behavior and inputs guru to the thread

3
  • In order to implement the behavior, I stored the original position. Is there a way to archive this without adding my own piece of state here? Maybe by somehow dynamically update what was passed to the constructor, i.e. the dragPlane or dragAxis?

I would do the same way because of the dynamic nature.
Maybe I would try to get an event when shift key is pressed/release and I would create/delete an axisDragGizmo/planeDragGizmo. I think this would work properly until you dynamicly change the behavior. I don’t think it’s possible to have a dragstart in a gizmo and continue having dragmove in another one.

I’ll let @PolygonalSun answer the second question :slight_smile:

4

Pinging @PolygonalSun