elm / browser

Create Elm programs that run in browsers!
https://package.elm-lang.org/packages/elm/browser/latest/
BSD 3-Clause "New" or "Revised" License
313 stars 64 forks source link

Add and expose screen touch events #116

Open pfcoperez opened 4 years ago

pfcoperez commented 4 years ago

Whereas there is a fantastic Elm library enabling the subscription to touch events https://github.com/mpizenberg/elm-pointer-events/blob/4.0.2/src/Html/Events/Extra/Touch.elm

For example, I've a fork of elm-playground which leverages it to allow the implementation of games with touch inputs: https://github.com/pfcoperez/elm-playground/blob/743f0a51213bba6685352a5d9376fe978c378f60/src/Playground.elm#L1523-L1537

    [ Touch.onStart onTouchEvent
    , Touch.onMove onTouchEvent
    , Touch.onEnd onTouchEvent
    , Touch.onCancel onTouchEvent
    , viewBox (x ++ " " ++ y ++ " " ++ w ++ " " ++ h)
    , H.style "position" "fixed"
    , H.style "top" "0"
    , H.style "left" "0"
    , width "100%"
    , height "100%"
    ]
    (List.map renderShape shapes)

onTouchEvent : Touch.Event -> Msg
onTouchEvent t = TouchMove (Maybe.map (\touch -> touch.clientPos) (List.head t.touches))
    TouchMove maybeTouch ->
      let
        touchPosToPos (pageX, pageY) =
          { x = computer.screen.left + pageX
          , y = computer.screen.top - pageY
          }
        maybePos = Maybe.map touchPosToPos maybeTouch
      in Game vis memory { computer | touch = TouchState maybePos }

It'd be nice to be able to listen to these ones using the core browser library. This would lead to more consistent usage of these events in elm-playground and other libraries and applications.

This PR adds the helper functions to subscribe to touch events.