Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix double-tap zoom (#6217) #8086

Merged
merged 9 commits into from
Apr 9, 2019
Merged

Fix double-tap zoom (#6217) #8086

merged 9 commits into from
Apr 9, 2019

Conversation

vakila
Copy link

@vakila vakila commented Mar 27, 2019

Hi folks! Per chat with @asheemmamoowala I'm jumping in on a good first issue, trying to fix the double-tap zoom issues described in #6217. Thanks in advance for the feedback 🙏

Changes:

  • Add tests for existing double-click zoom functionality & fix up existing spuriously-passing test
  • Prevent zooming when two taps are within 300ms but in different locations (based on best-guess threshold; see below), & add tests
  • Zoom on the second touchend event (not touchstart) of double-tap within the time threshold, & add tests

Known issues/questions:

  • I've set the maxDelta between tap locations (in both x & y) to 30, rather arbitrarily based on my manual tests - happy to use a different value if there is some standard for this.
  • On the Android device I manually tested with, in addition to touch events being fired a dblclick event is also fired when the double-tap points are within a distance threshold, which is somewhat higher than the threshold I set ☝️ - this means it's possible for two slightly-farther-apart touch events to trigger zoom via the dblclick handler, rather than the double-tap handler. That behavior seems OK to me, but just wanted to flag it.
  • The "Size" check shows this as adding +483 B - Is that normal/OK for such a small fix? If there are ways I can improve this I'm all ears

Launch Checklist

  • briefly describe the changes in this PR
  • write tests for all new functionality
  • document any changes to public APIs N/A afaict
  • post benchmark scores 👉 screenshot (charts seem broken in Firefox 😢 )
  • manually test the debug page - didn't notice any breakage on debug or events pages on desktop (Chrome & Firefox on Linux) or mobile (Chrome on Android)

Copy link
Member

@mourner mourner left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added a few nits but looks great overall! Especially love the extensive tests. Thanks for working on this!

src/ui/handler/dblclick_zoom.js Outdated Show resolved Hide resolved
};

this._map.on('touchend', onTouchEnd);
this._map.on('touchcancel', onTouchCancel);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

To simplify this a bit, you can do this._map.once(...) instead of on — this way listener doesn't have to manually remove itself. It also ensures touchcancel listeners are not accumulated if they never happen.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, disregard the last sentence — it seems like we still need to make sure touchcancel listeners don't accumulate with every tap when touches are not cancelled.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 thanks for catching the missing touchcancel removal! I've now used .once() for both listeners and still manually remove the other listener in each handler, so I think all bases should be covered.

test/unit/ui/handler/dblclick_zoom.test.js Outdated Show resolved Hide resolved
src/ui/handler/dblclick_zoom.js Outdated Show resolved Hide resolved
test/unit/ui/handler/dblclick_zoom.test.js Show resolved Hide resolved
test/unit/ui/handler/dblclick_zoom.test.js Outdated Show resolved Hide resolved
src/ui/handler/dblclick_zoom.js Outdated Show resolved Hide resolved
@vakila
Copy link
Author

vakila commented Apr 1, 2019

Thanks for the reviews @mourner @asheemmamoowala ! I'll take all your comments into account & push a new set of changes that incorporates both.

- Use proper Point obj w/ .dist() method
- Remove touchcancel handler on touchend
- Attach touchend/cancel handlers with .once()
- Move distance threshold to top-level constant, add doc comment
- Refactor tests to avoid repetition
src/ui/handler/dblclick_zoom.js Outdated Show resolved Hide resolved
src/ui/handler/dblclick_zoom.js Outdated Show resolved Hide resolved
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants