Drag & Drop and inertia user experience on mobiles

[mpetroff]

Drag & Drop and inertia user experience on mobiles

[mpetroff]

That's the only value associated with the inertia effect. If it stops almost immediately on mobile, I'm guessing the touch input code is causing the speed drop right before / as one's finger is lifted.

[umbreak]

Could you find out something more using the iPhone?

[mpetroff]

I was right. The speed was often zeroed right before one's finger was lifted. In JavaScript, the mouse / touch position can't be polled at a set interval; one has to use the mousemove / touchmove events, which don't fire when the mouse / touch is stationary. This causes problems when a user rapidly moves the mouse, quickly stops, and then releases the mouse button, as the last move event that fired showed a large movement, even though the pointer has actually stopped. If not handled, this causes inertia to be applied, and the panorama jumps when the mouse button is released. To remedy this, I zero the pitch and yaw speeds when the button is released if the last move event was too long ago. This works well on the Desktop, but the zeroing delay was too aggressive on mobile, so I lengthened it. Doing so fixes this issue, but if I try to, I can cause the jumps this zeroing was meant to prevent. However, on touch screens, people usually flick instead of move-stop-release, so this shouldn't be an issue in practice.

[umbreak]

Now the jumps on the Desktop version are happening much often.

If this jump is caused by that last if (Date.now() - latestInteraction > 15) probably this value (15 or 150) have to be different depending on the device (ugly user agent check).

[mpetroff]

On the Desktop, nothing should have changed. I only changed the touch value, not the mouse value.

[umbreak]

Related with the Drag & Drop experience: testing with Android and iPhone it looks like when you drag a point and move it through the screen, your finger moves faster than the point you dragged.

In pannellum.js, inside the method onDocumentTouchMove there are those two constants 0.1 and 0.2 used for those events. If i change the 0.1 constant there for 0.25 it already feel much more responsive and smoother on Mobile devices, and almost the same on Desktop.

I guess those multiplier values are there to select the degree of relevance of each part of the equation, but I don't make a pull request cause you know better which values are working better. However, you should try with those 0.25 (or even more) and see If the result is as you like.

[umbreak]

And about the "jumping", we experience it now more often than before. I'm not sure if is due to those latest changes or something else.

[mpetroff]

I didn't actually write the touch code; it's from a pull request. I've also noticed the issue with the difference in movement between one's finger and the panorama, but haven't tried to fix it yet. On the desktop, things aren't perfect, but they're much better.

I need to look at how Leaflet does things, since it doesn't have an issue with jumping.