Package for Mouse, Touch, Pointer, Wheel and Drag APIs

Show and Tell
1

Here it is: mpizenberg/elm-pointer-events

As pointed out in this reddit post there are currently at least 7 packages dealing with mouse/touch/pointer interactions:

  • knledg/touch-events
  • mbr/elm-mouse-events
  • mpizenberg/elm-touch-events
  • mpizenberg/elm-mouse-events
  • Elm-Canvas/element-relative-mouse-events
  • zwilias/elm-touch-events
  • mpizenberg/elm-pointer-events

I’m trying to reduce the count and end the name conflicts by merging all mpizenberg packages into elm-pointer-events. My mouse and touch packages will not be updated to elm 0.19.

This version 2.0.0 has a much better cover of mouse/touch/pointer APIs. In addition, it covers Wheel events and partial support of Drag events (for file dropping use cases).

Regarding the Pointer API, a polyfill is also provided at mpizenberg/elm-pep to support Firefox < 59 and Safari. Thanks a lot to Rob for his contribution in making this apple-friendly!

This package aims at being a solid base for pointer-like events but does not go beyond. Meaning that gestures (swipe, pinch, …) are not directly supported. For those, I suggest looking at zwilias package.

Version 2.0.0 is focused on almost full cover of APIs. In future work, I’ll focus on being gesture-friendly, meaning work on performances and API suitability for implementing gesture packages on top of this.

17 Likes
2

This looks great, I’m looking forward to transitioning some of my internal code over to using it!

It seems to me that one possibly controversial choice is the inclusion of pagePos, screenPos and clientPos in the returned records, but I think this is the right decision for a relatively low-level package that others can build on top of. I’ve certainly run into cases where I needed to use multiple different kinds of event coordinates in internal code in order to be able to expose a nicer high-level API.

My only suggestion would be to rename typeMIME to mimeType in the File record =)

2 Likes
3

I spotted your package some time ago and have been using an earlier version in fury for a couple months now.

I’ve built the rudimentary start of gesture controls on top and so far things seem to be working quite well for my very specific use cases.

The polyfill was the crucial missing piece for me compared to the other packages, will be checking out 2.0.0 shortly.

Thanks for your (and Rob’s) work on this!

1 Like
4

@ianmackenzie Thanks! I added an issue with the mimeType change. It makes sense for consistency.

@supermario Thanks for the kind words! Rob significantly improved the polyfill last December and came up with the pointer capture trick to behave like touch. Beware that due to the more complete API, the models/decoders are quite bigger than they used to be. It might impact gesture processing but I hope not too much.

PS: the polyfill is independent from this package so you can use it with others, even pure JS if you want ^^

1 Like
5

Looks neat, I didn’t know listening to Mouse events is possible without using subscriptions. I would definitely use this library to replace my subscription base drag listener. Thanks for this!