GESTURES

GESTURES (in framework/ui-gestures.js) provides gesture recognition.

A simple, no-frills gesture recognizer. Permits long-press recognition, horizontal swipe recognition, and vertical swipe recognition. Recognizing swipes in a particular direction (left, right, up, down) should be easy to add later.

The SimpleGesture class represents the basic recognizer -- it implements all the tracking of touch and mouse events. Every 100ms it calls a recognition function, which by default does nothing. Essentially, SimpleGesture is abstract. This method is expected to be overridden by a specific recognizer, which the LongPressGesture, HorizontalSwipeGesture, and VerticalSwipeGesture do.

The LongPressGesture will fire off an event when a longpress is recognized. How this is recognized is partially defined by the caller -- that is, two durations can be supplied. By default, the long-press is recognized at 1s and cancelled at 3s (assuming no previous recognition). It is also cancelled should any movement outside of a 25px radius occur.

The HorizontalSwipeGesture and VerticalSwipeGesture will fire off an event when a swipe in the given axis is detected. This swipe is detected when the length of the swipe exceeds 75px (or the provided override), and will be fired as long as the duration of the swipe is less than the cancel duration (3s by default). The line must not deviate by more than 25px in the specified axis, or the gesture will fail to be recognized.

Usage

var anElement = document.getElementById("abc");
var aLongPressGesture = new GESTURES.LongPressGesture
                            ( anElement, theFunctionToCallWhenRecognized,
                              [ thePressDuration, [ theCancelDelay ]] );

var aHorizontalSwipeGesture = new GESTURES.HorizontalSwipeGesture
                              ( anElement, theFunctionToCallWhenRecognized,
                                [ theSwipeLength, [ theCancelDelay ]] );

var aVerticalSwipeGesture = new GESTURES.VerticalSwipeGesture
                            ( anElement, theFunctionToCallWhenRecognized,
                              [ theSwipeLength, [ theCancelDelay ]] );

Where: anElement is an HTML DOM element
       theFunctionToCallWhenRecognized is a function that will be called
           when the gesture is recognized. It will be passed the recognizer,
           and as such, one can store & retrieve data in this manner:

                aLongPressGesture.data = "Hello";
                function theFunctionToCallWhenRecognized ( gr )
                { alert (gr.data); }

           This will generate an alert of "Hello" when the element is long-
           pressed.

       thePressDuration: Optional, defaults to 1s. The amount of time required
           to recognize a long-press.
       theSwipeLength: Optional, defaults to 75px. The length of a swipe
           required to recognize a swipe.
       theCancelDelay: Optional, defaults to 3s. If a gesture is not recognized
           prior to this delay, the gesture is cancelled, that is, it will
           never be recognized.

Version

0.1 Introduced

0.2 Docs Valid