TransformControls.js: Added reset() method

[vHeemstra]

Description
There was no (easy) way to cancel/abort a transform action. The pull request adds that functionality.

Added method to reset object to state when the transform dragging started. Further transform action can be stopped immediately after resetting the object by using the optional parameter set to true.

Changes from outdated related prior pull request: #21661
The prior pull request involved two methods (cancel and stop). Looking at what the added functionality is, naming it reset seems more appropriate. Also, the added stop method was overly complex, so the optional unbinding of the pointermove event is included in the reset method.

Resolves #21655, closes #21661

[Mugen87]

Also, the added stop method was overly complex, so the optional unbinding of the pointermove event is included in the reset method.

Would it be possible to remove the optional parameter and not touch the event listener?

Other controls also have reset() methods and they do not modify the event listeners, too. Would be good to be consistent in that regard.

[Mugen87]

For testing: https://raw.githack.com/vHeemstra/three.js/dev/examples/misc_controls_transform.html

[Mugen87]

After some tests I'am wondering if it isn't better to reset _positionStart, _quaternionStart and _scaleStart in reset(), too.

If you currently translate an object and call reset(), the object "jumps" to the last translated position when you proceed the transformation. That feels a bit strange.

[vHeemstra]

The idea for this feature was that you had the possibility to cancel the current transform, as a sort of undo. So that you could revert the transform while you are still dragging. I'm not sure if this is similar to the reset methods of other controls, so maybe it needs to be renamed if it isn't consistent?

The jumping of the object is the desired result in this case. The previous (now removed) optional parameter would make it possible to immediately stop any further transform of that dragging action. (Mouse up and a new mouse down would start a new transform if needed.)

What would be the behavior you expected? Or what would feel less strange? Do you mean like a transition animation instead of snapping back? (Option A)
Or do you mean that after the reset the object would transform from that position/scale/rotation onward, like when you would start a new transform drag? (Option B)

[Mugen87]

I think option B would feel best.

[vHeemstra]

Ok, I'll have a go at that.

[vHeemstra]

Updated:
After reset is called, the transform continues from the new (reset) state.

Note:
The downside in ui experience here is that the transform magnitude might me smaller or larger than you would expect, because the pointer starts at a point further from the object. Although this was already the case when starting the dragging further away on the handles, but now it becomes more visible.

For example:

1. Open the example
2. Drag the red transform arrow to the left and keep the mouse button pressed.
3. Press Esc
4. Move the mouse back to the position where you started the dragging.
5. Release the mouse button.

Result
The object will end up further to the right than it started. This is because the traveled mouse distance (after the reset) is scaled proportionally to the 3D position it points to at reset.

[Mugen87]

Thanks for highlighting the details! I think the implemented approach feels good now.

[mrdoob]

Thanks!