1

I found this little gem from Koen Bok that integrates Hammer.js Events into Framer.js a couple of weeks ago. However, it's made for an older version of Hammer, which has been rewritten since. Theoretically, I can port it to the new version quite easily by adapting the HammerEvents and everything seems to be working fine for pan and swipe events. But I can for some reason not get the pinch or rotate Events to work with the most recent Hammer-script (2.0.4).

This is the original snippet, for Hammer.js 1.1.3:

HammerEvents =

    Tap: 'tap'
    DoubleTap: 'doubletap'
    Hold: 'hold'
    Touch: 'touch'
    Release: 'release'
    Gesture: 'gesture'

    Swipe: 'swipe'
    SwipeUp: 'swipeup'
    SwipeDown: 'swipedown'
    SwipeLeft: 'swipeleft'
    SwipeRight: 'swiperight'

    Transform: 'transform'
    TransformStart: 'transformstart'
    TransformEnd: 'transformend'

    Rotate: 'rotate'

    Pinch: 'pinch'
    PinchIn: 'pinchin'
    PinchOut: 'pinchout'

window.Events = _.extend Events, HammerEvents

class HammerLayer extends Framer.Layer

    on: (eventName, f) ->

        if eventName in _.values(HammerEvents)
            @ignoreEvents = false
            hammer = Hammer(@_element).on eventName, f

        else
            super eventName, f

window.Layer = HammerLayer

Does anybody have an idea what's wrong? Thanks a bunch!

Maxi
  • 23
  • 3

1 Answers1

0

Just tried the snippet. It seems to be working just fine. I tried it with this code:

doubleTap = new HammerLayer

doubleTap.on HammerEvents.DoubleTap, ->
    print "You just doubletapped me."

Did you make sure to include the Hammer.js javascript library into your Framer prototype?

  1. Save http://hammerjs.github.io/dist/hammer.min.js into your Framer project. I put it in a sub-folder called js.
  2. Open index.html inside the Framer folder and add the line <script src="js/hammer.min.js"></script> after all the other <script> inclusions.
  3. Your Hammer events should now be triggering in Framer.
alexismorin
  • 787
  • 1
  • 6
  • 21