1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 | 'use strict';
|
10 |
|
11 | var EventPropagators = require('./EventPropagators');
|
12 | var ExecutionEnvironment = require('fbjs/lib/ExecutionEnvironment');
|
13 | var FallbackCompositionState = require('./FallbackCompositionState');
|
14 | var SyntheticCompositionEvent = require('./SyntheticCompositionEvent');
|
15 | var SyntheticInputEvent = require('./SyntheticInputEvent');
|
16 |
|
17 | var END_KEYCODES = [9, 13, 27, 32];
|
18 | var START_KEYCODE = 229;
|
19 |
|
20 | var canUseCompositionEvent = ExecutionEnvironment.canUseDOM && 'CompositionEvent' in window;
|
21 |
|
22 | var documentMode = null;
|
23 | if (ExecutionEnvironment.canUseDOM && 'documentMode' in document) {
|
24 | documentMode = document.documentMode;
|
25 | }
|
26 |
|
27 |
|
28 |
|
29 |
|
30 | var canUseTextInputEvent = ExecutionEnvironment.canUseDOM && 'TextEvent' in window && !documentMode && !isPresto();
|
31 |
|
32 |
|
33 |
|
34 |
|
35 | var useFallbackCompositionData = ExecutionEnvironment.canUseDOM && (!canUseCompositionEvent || documentMode && documentMode > 8 && documentMode <= 11);
|
36 |
|
37 |
|
38 |
|
39 |
|
40 |
|
41 | function isPresto() {
|
42 | var opera = window.opera;
|
43 | return typeof opera === 'object' && typeof opera.version === 'function' && parseInt(opera.version(), 10) <= 12;
|
44 | }
|
45 |
|
46 | var SPACEBAR_CODE = 32;
|
47 | var SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE);
|
48 |
|
49 |
|
50 | var eventTypes = {
|
51 | beforeInput: {
|
52 | phasedRegistrationNames: {
|
53 | bubbled: 'onBeforeInput',
|
54 | captured: 'onBeforeInputCapture'
|
55 | },
|
56 | dependencies: ['topCompositionEnd', 'topKeyPress', 'topTextInput', 'topPaste']
|
57 | },
|
58 | compositionEnd: {
|
59 | phasedRegistrationNames: {
|
60 | bubbled: 'onCompositionEnd',
|
61 | captured: 'onCompositionEndCapture'
|
62 | },
|
63 | dependencies: ['topBlur', 'topCompositionEnd', 'topKeyDown', 'topKeyPress', 'topKeyUp', 'topMouseDown']
|
64 | },
|
65 | compositionStart: {
|
66 | phasedRegistrationNames: {
|
67 | bubbled: 'onCompositionStart',
|
68 | captured: 'onCompositionStartCapture'
|
69 | },
|
70 | dependencies: ['topBlur', 'topCompositionStart', 'topKeyDown', 'topKeyPress', 'topKeyUp', 'topMouseDown']
|
71 | },
|
72 | compositionUpdate: {
|
73 | phasedRegistrationNames: {
|
74 | bubbled: 'onCompositionUpdate',
|
75 | captured: 'onCompositionUpdateCapture'
|
76 | },
|
77 | dependencies: ['topBlur', 'topCompositionUpdate', 'topKeyDown', 'topKeyPress', 'topKeyUp', 'topMouseDown']
|
78 | }
|
79 | };
|
80 |
|
81 |
|
82 | var hasSpaceKeypress = false;
|
83 |
|
84 |
|
85 |
|
86 |
|
87 |
|
88 |
|
89 | function isKeypressCommand(nativeEvent) {
|
90 | return (nativeEvent.ctrlKey || nativeEvent.altKey || nativeEvent.metaKey) &&
|
91 |
|
92 | !(nativeEvent.ctrlKey && nativeEvent.altKey);
|
93 | }
|
94 |
|
95 |
|
96 |
|
97 |
|
98 |
|
99 |
|
100 |
|
101 | function getCompositionEventType(topLevelType) {
|
102 | switch (topLevelType) {
|
103 | case 'topCompositionStart':
|
104 | return eventTypes.compositionStart;
|
105 | case 'topCompositionEnd':
|
106 | return eventTypes.compositionEnd;
|
107 | case 'topCompositionUpdate':
|
108 | return eventTypes.compositionUpdate;
|
109 | }
|
110 | }
|
111 |
|
112 |
|
113 |
|
114 |
|
115 |
|
116 |
|
117 |
|
118 |
|
119 |
|
120 | function isFallbackCompositionStart(topLevelType, nativeEvent) {
|
121 | return topLevelType === 'topKeyDown' && nativeEvent.keyCode === START_KEYCODE;
|
122 | }
|
123 |
|
124 |
|
125 |
|
126 |
|
127 |
|
128 |
|
129 |
|
130 |
|
131 | function isFallbackCompositionEnd(topLevelType, nativeEvent) {
|
132 | switch (topLevelType) {
|
133 | case 'topKeyUp':
|
134 |
|
135 | return END_KEYCODES.indexOf(nativeEvent.keyCode) !== -1;
|
136 | case 'topKeyDown':
|
137 |
|
138 |
|
139 | return nativeEvent.keyCode !== START_KEYCODE;
|
140 | case 'topKeyPress':
|
141 | case 'topMouseDown':
|
142 | case 'topBlur':
|
143 |
|
144 | return true;
|
145 | default:
|
146 | return false;
|
147 | }
|
148 | }
|
149 |
|
150 |
|
151 |
|
152 |
|
153 |
|
154 |
|
155 |
|
156 |
|
157 |
|
158 |
|
159 | function getDataFromCustomEvent(nativeEvent) {
|
160 | var detail = nativeEvent.detail;
|
161 | if (typeof detail === 'object' && 'data' in detail) {
|
162 | return detail.data;
|
163 | }
|
164 | return null;
|
165 | }
|
166 |
|
167 |
|
168 | var currentComposition = null;
|
169 |
|
170 |
|
171 |
|
172 |
|
173 | function extractCompositionEvent(topLevelType, targetInst, nativeEvent, nativeEventTarget) {
|
174 | var eventType;
|
175 | var fallbackData;
|
176 |
|
177 | if (canUseCompositionEvent) {
|
178 | eventType = getCompositionEventType(topLevelType);
|
179 | } else if (!currentComposition) {
|
180 | if (isFallbackCompositionStart(topLevelType, nativeEvent)) {
|
181 | eventType = eventTypes.compositionStart;
|
182 | }
|
183 | } else if (isFallbackCompositionEnd(topLevelType, nativeEvent)) {
|
184 | eventType = eventTypes.compositionEnd;
|
185 | }
|
186 |
|
187 | if (!eventType) {
|
188 | return null;
|
189 | }
|
190 |
|
191 | if (useFallbackCompositionData) {
|
192 |
|
193 |
|
194 | if (!currentComposition && eventType === eventTypes.compositionStart) {
|
195 | currentComposition = FallbackCompositionState.getPooled(nativeEventTarget);
|
196 | } else if (eventType === eventTypes.compositionEnd) {
|
197 | if (currentComposition) {
|
198 | fallbackData = currentComposition.getData();
|
199 | }
|
200 | }
|
201 | }
|
202 |
|
203 | var event = SyntheticCompositionEvent.getPooled(eventType, targetInst, nativeEvent, nativeEventTarget);
|
204 |
|
205 | if (fallbackData) {
|
206 |
|
207 |
|
208 | event.data = fallbackData;
|
209 | } else {
|
210 | var customData = getDataFromCustomEvent(nativeEvent);
|
211 | if (customData !== null) {
|
212 | event.data = customData;
|
213 | }
|
214 | }
|
215 |
|
216 | EventPropagators.accumulateTwoPhaseDispatches(event);
|
217 | return event;
|
218 | }
|
219 |
|
220 |
|
221 |
|
222 |
|
223 |
|
224 |
|
225 | function getNativeBeforeInputChars(topLevelType, nativeEvent) {
|
226 | switch (topLevelType) {
|
227 | case 'topCompositionEnd':
|
228 | return getDataFromCustomEvent(nativeEvent);
|
229 | case 'topKeyPress':
|
230 | |
231 |
|
232 |
|
233 |
|
234 |
|
235 |
|
236 |
|
237 |
|
238 |
|
239 |
|
240 |
|
241 |
|
242 |
|
243 |
|
244 | var which = nativeEvent.which;
|
245 | if (which !== SPACEBAR_CODE) {
|
246 | return null;
|
247 | }
|
248 |
|
249 | hasSpaceKeypress = true;
|
250 | return SPACEBAR_CHAR;
|
251 |
|
252 | case 'topTextInput':
|
253 |
|
254 | var chars = nativeEvent.data;
|
255 |
|
256 |
|
257 |
|
258 |
|
259 | if (chars === SPACEBAR_CHAR && hasSpaceKeypress) {
|
260 | return null;
|
261 | }
|
262 |
|
263 | return chars;
|
264 |
|
265 | default:
|
266 |
|
267 | return null;
|
268 | }
|
269 | }
|
270 |
|
271 |
|
272 |
|
273 |
|
274 |
|
275 |
|
276 |
|
277 |
|
278 |
|
279 | function getFallbackBeforeInputChars(topLevelType, nativeEvent) {
|
280 |
|
281 |
|
282 |
|
283 |
|
284 | if (currentComposition) {
|
285 | if (topLevelType === 'topCompositionEnd' || !canUseCompositionEvent && isFallbackCompositionEnd(topLevelType, nativeEvent)) {
|
286 | var chars = currentComposition.getData();
|
287 | FallbackCompositionState.release(currentComposition);
|
288 | currentComposition = null;
|
289 | return chars;
|
290 | }
|
291 | return null;
|
292 | }
|
293 |
|
294 | switch (topLevelType) {
|
295 | case 'topPaste':
|
296 |
|
297 |
|
298 | return null;
|
299 | case 'topKeyPress':
|
300 | |
301 |
|
302 |
|
303 |
|
304 |
|
305 |
|
306 |
|
307 |
|
308 |
|
309 |
|
310 |
|
311 |
|
312 |
|
313 |
|
314 |
|
315 |
|
316 | if (nativeEvent.which && !isKeypressCommand(nativeEvent)) {
|
317 | return String.fromCharCode(nativeEvent.which);
|
318 | }
|
319 | return null;
|
320 | case 'topCompositionEnd':
|
321 | return useFallbackCompositionData ? null : nativeEvent.data;
|
322 | default:
|
323 | return null;
|
324 | }
|
325 | }
|
326 |
|
327 |
|
328 |
|
329 |
|
330 |
|
331 |
|
332 |
|
333 | function extractBeforeInputEvent(topLevelType, targetInst, nativeEvent, nativeEventTarget) {
|
334 | var chars;
|
335 |
|
336 | if (canUseTextInputEvent) {
|
337 | chars = getNativeBeforeInputChars(topLevelType, nativeEvent);
|
338 | } else {
|
339 | chars = getFallbackBeforeInputChars(topLevelType, nativeEvent);
|
340 | }
|
341 |
|
342 |
|
343 |
|
344 | if (!chars) {
|
345 | return null;
|
346 | }
|
347 |
|
348 | var event = SyntheticInputEvent.getPooled(eventTypes.beforeInput, targetInst, nativeEvent, nativeEventTarget);
|
349 |
|
350 | event.data = chars;
|
351 | EventPropagators.accumulateTwoPhaseDispatches(event);
|
352 | return event;
|
353 | }
|
354 |
|
355 |
|
356 |
|
357 |
|
358 |
|
359 |
|
360 |
|
361 |
|
362 |
|
363 |
|
364 |
|
365 |
|
366 |
|
367 |
|
368 |
|
369 |
|
370 |
|
371 |
|
372 |
|
373 | var BeforeInputEventPlugin = {
|
374 | eventTypes: eventTypes,
|
375 |
|
376 | extractEvents: function (topLevelType, targetInst, nativeEvent, nativeEventTarget) {
|
377 | return [extractCompositionEvent(topLevelType, targetInst, nativeEvent, nativeEventTarget), extractBeforeInputEvent(topLevelType, targetInst, nativeEvent, nativeEventTarget)];
|
378 | }
|
379 | };
|
380 |
|
381 | module.exports = BeforeInputEventPlugin; |
\ | No newline at end of file |