Apply a drag threshold to make clicking sprites easier

[paulkaplan]

Use the same drag threshold as from the blocks. It may need to be dialed
in further, but testing will be needed.

Resolves

What Github issue does this resolve (please include link)?

Resolvers #1408, but may need further refinements to the drag threshold to dial it in.

Proposed Changes

Describe what this Pull Request does

Reason for Changes

Explain why these changes should be made

Use a 3 px drag threshold before starting a drag on sprites. This gives a bit of breathing space for an unintentional movement while the mouse/touchpoint is down.

Test Coverage

Please show how you have added tests to cover your changes

This will require a fair bit of manual testing on different devices / pointers. I'll mark it "needs-qa" so we can make sure to dial it in.

[hedgehog125]

What if you wanted to move a sprite less than 3 pixels though?

[towerofnix]

@hedgehog125 You could start by moving the sprite more than 3 pixels, then move it backwards to the desired position.. or you could just use the set/change x/y blocks :)

[hedgehog125]

@towerofnix Oh, ok. I didn't think of that.

[towerofnix]

This is our new favorite commit ever.

We're implementing sprite drag and drop for Leopard: leopard-js/leopard#201 - modeled right after Scratch's code/behavior, since we try to have equal runtime mechanics.

Scratch runs this "should we start dragging because we moved the mouse past a certain threshold?" operation every frame that the mouse is down and we're not currently in a drag. If the condition is met (your mouse is far from where you pressed it down), then it will attempt to start a drag... every frame... based on where you pressed it down.

This means you can press down where a draggable sprite is going to end up, move the mouse away, dance it around in place, and teleport the draggable sprite to the mouse once it comes by.

scratch-drag-clear.mp4

Pretty beautiful. LOL