unexpected zoom/scroll behavior in gallery

[r10s]

in the gallery, images can be zoom meanwhile, which is great.

however, the used gestures are not standard and unexpected:

• the pinch/punch gesture works as expected and zoom the image
• once zoomed, however, a two finger slide does not move the image as usual but zooms further in and out or jitters around, depending on the direction

we should either disable two finger sliding at all (i would not like that), or, much better, move the zoomed image around so that the user can actually enlarger every detail of an image and not only the center. the latter is also what eg. telegram is doing and most other apps i know about.

[Simon-Laux]

this might be difficult because there are multiple targets:

• mouse (scroll to zoom; drag to move)
• fancy gesture touchpad (pinch to zoom, two finger drag to move)
• standard touchpad without gestures (what's expected here? same as with mouse?)

also we used a library and did not implement it ourselves so we gotta fork that library I guess.

[r10s]

yip, mouse works as expected, at a first glance (i do not have a mouse, but click-move on the touchpad moves the image around).

maybe the library just treats "scrollwheel == two finger gesture "- and devices to zoom in this case. which might be okayish for mouse, but is definitely wrong for touchpad. (even for mouse, usually zoom is sth. as ctrl+wheel, wheel usually just moves up/down)

maybe we can disable the two-finger thingie but keep scrollwheel? the library should treat that differently, however.

also we used a library and did not implement it ourselves so we gotta fork that library I guess.

of do a change upstream? or file a bug there?

[Simon-Laux]

https://prc5.github.io/react-zoom-pan-pinch/?path=/story/examples-big-image--big-image

wheel.wheelDisabled fixes the strange behaviour on fancy apple touchpads, but then scrolling to zoom with a mouse does not work anymore. wheel.touchPadDisabled could be what we need in theory but does not work on their demo site :(.

if you want to file a bug, upstream is here: https://github.com/prc5/react-zoom-pan-pinch

I think the expected behaviour for the Mac touchpad would be:

• 2 finger diagonal pinching (moving together) for zooming
• 2 finger panning (moving together in one direction) for moving around in the zoomed in image

[r10s]

I think the expected behaviour for the Mac touchpad would be:

2 finger diagonal pinching (moving together) for zooming 2 finger panning (moving together in one direction) for moving around in the zoomed in image

yes. but that is not limited to mac, there is nothing fancy in that any longer :) windows uses the same gestures (pinch/punch to zoom and two-fingers to scroll) and iirc i also used the same in many ubuntu apps.

also, Delta Chat supports two-finger-panning in the chat-and in the message-lists.

wheel.wheelDisabled fixes the strange behaviour [...]

so, pinch-to-zoom and two-finger-scroll works then?

i would go for disabling wheel then, this is the minor issue. wheel zooming without a qualifier key is a bit special anyway (there is sth. as wheel.activationKeys, however, not sure about all these interactions :)

[r10s]

to sum up: to fix the bug:

• disable zooming-jittering when doing two-finger-panning
• scrollwheel-zooming could be done by adding a qualifier - maybe wheel.activationKeys solves both points.
• alternatively: maybe we can disallow the x-axis on zooming? that is still not great, but better as before as the jitter comes exactly from there.

that would still not allow two-finger-panning, but also would not result in unexpected jittering when trying so.

panning can still be done by dragging.

of course, having real two-finger-panning would be nice as well, but that is beyond the bug fix.

[Jikstra]

Sorry but I don't really see this as an issue with any priority (not that you communicated this directly, but this issue already got quite some detailed replies from you so it feels like its an important one for you). If anyone feels like working on this that's of course appreciated but besides this it's an annoyance that only sooome people will experience. I think besides @treefits mac no other dev device even supports multi gestures on the hardware side. Plus I for myself wouldnt even know with which browser apis a gesture slide would be detectable. For sure possible but probably would need some learning of new apis. So I think there's a looot of other things that have more value for more people then this bug.

[r10s]

this issue is not more important to me than other ones :) but i agree that this is not the most important bug. and yes, it is hard to target for devs not using touchpads supporting gestures.

but it is still pretty annoying and unusual ui/ux - and not only for sooome mac (or only for me :), but for most ppl using a touchpad - gestures are quite usual on all systems nowadays :)

as one probably cannot really see the issue when not using touchpads, here is a little video showing how things look like when zooming to a point (works) and then try to pan around (works not - results in zooming and jittering):

https://user-images.githubusercontent.com/9800740/159467122-d8b14765-5b68-4599-a428-409aa9e2b92e.mov

so, i think, that should be targeted somehow, see details and suggestions to solve it above above - but we can do that later and we can remove it from the 1.30 project to make room for more important bugs.

[Simon-Laux]

so you want two fingers to be panning additionally to not be scrolling?

[Simon-Laux]

https://github.com/prc5/react-zoom-pan-pinch/issues/113 https://github.com/prc5/react-zoom-pan-pinch/issues/370