Proyectos de Subversion Moodle

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 efrain 1
YUI.add('event-tap', function (Y, NAME) {
2
 
3
/**
4
The tap module provides a gesture events, "tap", which normalizes user interactions
5
across touch and mouse or pointer based input devices.  This can be used by application developers
6
to build input device agnostic components which behave the same in response to either touch or mouse based
7
interaction.
8
 
9
'tap' is like a touchscreen 'click', only it requires much less finger-down time since it listens to touch events,
10
but reverts to mouse events if touch is not supported.
11
 
12
@example
13
 
14
    YUI().use('event-tap', function (Y) {
15
        Y.one('#my-button').on('tap', function (e) {
16
        });
17
    });
18
 
19
@module event
20
@submodule event-tap
21
@author Andres Garza, matuzak and tilo mitra
22
@since 3.7.0
23
 
24
*/
25
var doc = Y.config.doc,
26
    GESTURE_MAP = Y.Event._GESTURE_MAP,
27
    EVT_START = GESTURE_MAP.start,
28
    EVT_TAP = 'tap',
29
    POINTER_EVENT_TEST = /pointer/i,
30
 
31
    HANDLES = {
32
        START: 'Y_TAP_ON_START_HANDLE',
33
        END: 'Y_TAP_ON_END_HANDLE',
34
        CANCEL: 'Y_TAP_ON_CANCEL_HANDLE'
35
    };
36
 
37
function detachHandles(subscription, handles) {
38
    handles = handles || Y.Object.values(HANDLES);
39
 
40
    Y.Array.each(handles, function (item) {
41
        var handle = subscription[item];
42
        if (handle) {
43
            handle.detach();
44
            subscription[item] = null;
45
        }
46
    });
47
 
48
}
49
 
50
 
51
/**
52
Sets up a "tap" event, that is fired on touch devices in response to a tap event (finger down, finder up).
53
This event can be used instead of listening for click events which have a 500ms delay on most touch devices.
54
This event can also be listened for using node.delegate().
55
 
56
@event tap
57
@param type {string} "tap"
58
@param fn {function} The method the event invokes. It receives the event facade of the underlying DOM event.
59
@for Event
60
@return {EventHandle} the detach handle
61
*/
62
Y.Event.define(EVT_TAP, {
63
    publishConfig: {
64
        preventedFn: function (e) {
65
            var sub = e.target.once('click', function (click) {
66
                click.preventDefault();
67
            });
68
 
69
            // Make sure to detach the subscription during the next event loop
70
            // so this doesn't `preventDefault()` on the wrong click event.
71
            setTimeout(function () {
72
                sub.detach();
73
            //Setting this to `0` causes the detachment to occur before the click
74
            //comes in on Android 4.0.3-4.0.4. 100ms seems to be a reliable number here
75
            //that works across the board.
76
            }, 100);
77
        }
78
    },
79
 
80
    processArgs: function (args, isDelegate) {
81
 
82
        //if we return for the delegate use case, then the `filter` argument
83
        //returns undefined, and we have to get the filter from sub._extra[0] (ugly)
84
 
85
        if (!isDelegate) {
86
            var extra = args[3];
87
            // remove the extra arguments from the array as specified by
88
            // http://yuilibrary.com/yui/docs/event/synths.html
89
            args.splice(3,1);
90
            return extra;
91
        }
92
    },
93
    /**
94
    This function should set up the node that will eventually fire the event.
95
 
96
    Usage:
97
 
98
        node.on('tap', function (e) {
99
        });
100
 
101
    @method on
102
    @param {Node} node
103
    @param {Array} subscription
104
    @param {Boolean} notifier
105
    @public
106
    @static
107
    **/
108
    on: function (node, subscription, notifier) {
109
        subscription[HANDLES.START] = node.on(EVT_START, this._start, this, node, subscription, notifier);
110
    },
111
 
112
    /**
113
    Detaches all event subscriptions set up by the event-tap module
114
 
115
    @method detach
116
    @param {Node} node
117
    @param {Array} subscription
118
    @param {Boolean} notifier
119
    @public
120
    @static
121
    **/
122
    detach: function (node, subscription, notifier) {
123
        detachHandles(subscription);
124
    },
125
 
126
    /**
127
    Event delegation for the 'tap' event. The delegated event will use a
128
    supplied selector or filtering function to test if the event references at least one
129
    node that should trigger the subscription callback.
130
 
131
    Usage:
132
 
133
        node.delegate('tap', function (e) {
134
        }, 'li a');
135
 
136
    @method delegate
137
    @param {Node} node
138
    @param {Array} subscription
139
    @param {Boolean} notifier
140
    @param {String | Function} filter
141
    @public
142
    @static
143
    **/
144
    delegate: function (node, subscription, notifier, filter) {
145
        subscription[HANDLES.START] = Y.delegate(EVT_START, function (e) {
146
            this._start(e, node, subscription, notifier, true);
147
        }, node, filter, this);
148
    },
149
 
150
    /**
151
    Detaches the delegated event subscriptions set up by the event-tap module.
152
    Only used if you use node.delegate(...) instead of node.on(...);
153
 
154
    @method detachDelegate
155
    @param {Node} node
156
    @param {Array} subscription
157
    @param {Boolean} notifier
158
    @public
159
    @static
160
    **/
161
    detachDelegate: function (node, subscription, notifier) {
162
        detachHandles(subscription);
163
    },
164
 
165
    /**
166
    Called when the monitor(s) are tapped on, either through touchstart or mousedown.
167
 
168
    @method _start
169
    @param {DOMEventFacade} event
170
    @param {Node} node
171
    @param {Array} subscription
172
    @param {Boolean} notifier
173
    @param {Boolean} delegate
174
    @protected
175
    @static
176
    **/
177
    _start: function (event, node, subscription, notifier, delegate) {
178
 
179
        var context = {
180
                canceled: false,
181
                eventType: event.type
182
            },
183
            preventMouse = subscription.preventMouse || false;
184
 
185
        //move ways to quit early to the top.
186
        // no right clicks
187
        if (event.button && event.button === 3) {
188
            return;
189
        }
190
 
191
        // for now just support a 1 finger count (later enhance via config)
192
        if (event.touches && event.touches.length !== 1) {
193
            return;
194
        }
195
 
196
        context.node = delegate ? event.currentTarget : node;
197
 
198
        //There is a double check in here to support event simulation tests, in which
199
        //event.touches can be undefined when simulating 'touchstart' on touch devices.
200
        if (event.touches) {
201
          context.startXY = [ event.touches[0].pageX, event.touches[0].pageY ];
202
        }
203
        else {
204
          context.startXY = [ event.pageX, event.pageY ];
205
        }
206
 
207
        //If `onTouchStart()` was called by a touch event, set up touch event subscriptions.
208
        //Otherwise, set up mouse/pointer event event subscriptions.
209
        if (event.touches) {
210
 
211
            subscription[HANDLES.END] = node.once('touchend', this._end, this, node, subscription, notifier, delegate, context);
212
            subscription[HANDLES.CANCEL] = node.once('touchcancel', this.detach, this, node, subscription, notifier, delegate, context);
213
 
214
            //Since this is a touch* event, there will be corresponding mouse events
215
            //that will be fired. We don't want these events to get picked up and fire
216
            //another `tap` event, so we'll set this variable to `true`.
217
            subscription.preventMouse = true;
218
        }
219
 
220
        //Only add these listeners if preventMouse is `false`
221
        //ie: not when touch events have already been subscribed to
222
        else if (context.eventType.indexOf('mouse') !== -1 && !preventMouse) {
223
            subscription[HANDLES.END] = node.once('mouseup', this._end, this, node, subscription, notifier, delegate, context);
224
            subscription[HANDLES.CANCEL] = node.once('mousecancel', this.detach, this, node, subscription, notifier, delegate, context);
225
        }
226
 
227
        //If a mouse event comes in after a touch event, it will go in here and
228
        //reset preventMouse to `true`.
229
        //If a mouse event comes in without a prior touch event, preventMouse will be
230
        //false in any case, so this block doesn't do anything.
231
        else if (context.eventType.indexOf('mouse') !== -1 && preventMouse) {
232
            subscription.preventMouse = false;
233
        }
234
 
235
        else if (POINTER_EVENT_TEST.test(context.eventType)) {
236
            subscription[HANDLES.END] = node.once(GESTURE_MAP.end, this._end, this, node, subscription, notifier, delegate, context);
237
            subscription[HANDLES.CANCEL] = node.once(GESTURE_MAP.cancel, this.detach, this, node, subscription, notifier, delegate, context);
238
        }
239
 
240
    },
241
 
242
 
243
    /**
244
    Called when the monitor(s) fires a touchend event (or the mouse equivalent).
245
    This method fires the 'tap' event if certain requirements are met.
246
 
247
    @method _end
248
    @param {DOMEventFacade} event
249
    @param {Node} node
250
    @param {Array} subscription
251
    @param {Boolean} notifier
252
    @param {Boolean} delegate
253
    @param {Object} context
254
    @protected
255
    @static
256
    **/
257
    _end: function (event, node, subscription, notifier, delegate, context) {
258
        var startXY = context.startXY,
259
            endXY,
260
            clientXY,
261
            sensitivity = 15;
262
 
263
        if (subscription._extra && subscription._extra.sensitivity >= 0) {
264
            sensitivity = subscription._extra.sensitivity;
265
        }
266
 
267
        //There is a double check in here to support event simulation tests, in which
268
        //event.touches can be undefined when simulating 'touchstart' on touch devices.
269
        if (event.changedTouches) {
270
          endXY = [ event.changedTouches[0].pageX, event.changedTouches[0].pageY ];
271
          clientXY = [event.changedTouches[0].clientX, event.changedTouches[0].clientY];
272
        }
273
        else {
274
          endXY = [ event.pageX, event.pageY ];
275
          clientXY = [event.clientX, event.clientY];
276
        }
277
 
278
        // make sure mouse didn't move
279
        if (Math.abs(endXY[0] - startXY[0]) <= sensitivity && Math.abs(endXY[1] - startXY[1]) <= sensitivity) {
280
 
281
            event.type = EVT_TAP;
282
            event.pageX = endXY[0];
283
            event.pageY = endXY[1];
284
            event.clientX = clientXY[0];
285
            event.clientY = clientXY[1];
286
            event.currentTarget = context.node;
287
 
288
            notifier.fire(event);
289
        }
290
 
291
        detachHandles(subscription, [HANDLES.END, HANDLES.CANCEL]);
292
    }
293
});
294
 
295
 
296
}, '3.18.1', {"requires": ["node-base", "event-base", "event-touch", "event-synthetic"]});