Pausing impetus causes it to preventDefault on document

[iest]

I'm using pan-zoom to help with pinch/panning/zooming a tiled image on a page (a map). It works very well, however I ran into a weird issue...

Problem

When on a touch device and following a pinch on the pan-zoom'd element, the outer document does not respond to pinch or pan gestures — so the page becomes un-scrollable. If you tap inside the element following the pinch, it's then possible to pinch/scroll the page as you'd expect.

I tracked the issue down to how impetus is used:
So when impetus gets a touchstart event on the source element, it adds document-level event listeners: one for touchmove (where e.preventDefault is called), and one for touchend which removes the document listeners.

The problem comes down to what happens with touch-pinch module: It's touchstart event listener on the source element is called at the same time as impetus' — however when pan-zoom gets the start event from touch-pinch, we call impetus.pause(). Impetus has already set up it's document event listeners at this point because it already detected the event, but doesn't have a chance to tear them down.
Although impetus.resume() is called when the pinch is ended, it's too late as it's after the touchend event has been fired on the source element — so the document-level, preventDefault-calling event listeners remain.

Solution

Removing the calls to impetus' pause and resume methods solves it, and doesn't seem to have any bad side-effects. In fact, it seems to also add support for 2-finger panning...?

Hope this all makes sense... I'd open a pull request but figured you paused/resumed impetus for a reason.

Anyway, thanks for the great lib!

[dy]

@iest the desired effect was to stop panning during the 2-finger pinch-zoom. If we remove pause/resume, then moving a finger during 2-finger zoom also pans the contents, which seems rather distracting. If you know any workaround to that, I'd definitely take a PR.

I tried impetus.setMultiplier(0), impetus.setMultiplier(1), but that creates a glitch once panning continues.

[dy]

@iest can you possibly show a test case code with the problem? That will be easier for me to track down the problem. I am thinking if it is possible to disable impetus manually and track it's shift during pinch-zoom, or maybe disable it in setTimeout.

[firasdib]

This seems related to my issue #13 -- perhaps we should look into refactoring this impetus library into one with less issues.

[cazala]

✋ I'm having the exact same issue. I have a tiled map rendered on a canvas and after pinching on mobile the document cannot be scrolled until tapping/scrolling the map again. You can see the issue live here for example: https://market.decentraland.org/parcels/13/2/detail