Ember-Touch

A lightweight library for using and building touch gestures

Transcript

1. A lightweight library for using and building touch gestures TOUCH
2. www.flickr.com: adactio E M B E R TO U C H 1 3 . 1 2 . 2 0 1 2 P E P E c a no Context
3. TIMELINE 2 • Sproutcore-touch • Emberjs-addons • Use, bug fixes, extend API, docs. E M B E R TO U C H 1 3 . 1 2 . 2 0 1 2 P E P E c a no
4. • Discrete • Continuous Use 3 Em.View.extend({ swipeOptions: { swipeThreshold: 10 }, swipeEnd: function(r){ } }); Em.View.extend({ pinchStart:function(r){ }, pinchChange:function(r){ }, pinchEnd:function(r){ }, pinchCancel:function(r){ } }); E M B E R TO U C H 1 3 . 1 2 . 2 0 1 2 P E P e c a no
5. CREATE (EXTENDS EM.GESTURE) (I) 4 E M B E R TO U C H 1 3 . 1 2 . 2 0 1 2 P E P E c a no eventDispacher gestureManager gesture view [touchEvents] [touchEvents] [gestureEvents]
6. CREATE (EXTENDS EM.GESTURE) (II) 5 E M B E R TO U C H 1 3 . 1 2 . 2 0 1 2 P E P E c a no • IN: touchStart/Move/End/Cancel • OUT: [gesture]Start/Move/End/Cancel • Handle gesture session state • Define common API - didBecomePossible, eventWasRejected - shouldBegin - shouldEnd - didBegin didChange, didEnd, didCancel
7. APP GESTURE COORDINATION (EM. GESTUREMANAGER) 6 E M B E R TO U C H 1 3 . 1 2 . 2 0 1 2 P E P E c a no Handle the touchEvent dispatch • ApplicationGestureManager.isBlocked • Aesture.simultaneously • Gesture.isEnabled • Gesture.gestureDelegate - gestureDelegateRules.shouldReceiveTouch - shouldReceiveTouch
8. #TheWebIsNotGoodEnoughYet 7 • Lack of abstractions • Mobile web is still hard (especially in phones) • Fragmented ecosystem E M B E R TO U C H 1 3 . 1 2 . 2 0 1 2 P E P E c a no click to see the link click to see the link
9. “I want Ember to be a gateway drug for good UI engineering the way Rails was for good application development.” 8 Trek Glowacki E M B E R TO U C H 1 3 . 1 2 . 2 0 1 2 P E P E c a no
10. DESIGN WITH THE GESTURE IN MIND! 9 E M B E R TO U C H 1 3 . 1 2 . 2 0 1 2 P E P E c a no click to see the link
11. Thanks! Design: @alelopbes