From 2ad43094ea661ede856d41d10ee8227d6ef5eaff Mon Sep 17 00:00:00 2001 From: Christopher Chedeau Date: Sat, 14 Mar 2015 11:42:25 -0700 Subject: [PATCH] [ReactNative] OSS Interaction Manager --- Libraries/Interaction/InteractionManager.js | 64 +++++++++++---------- Libraries/react-native/react-native.js | 3 +- 2 files changed, 35 insertions(+), 32 deletions(-) diff --git a/Libraries/Interaction/InteractionManager.js b/Libraries/Interaction/InteractionManager.js index 3e895f3b06..fbdd0cc9f7 100644 --- a/Libraries/Interaction/InteractionManager.js +++ b/Libraries/Interaction/InteractionManager.js @@ -13,6 +13,14 @@ var invariant = require('invariant'); var keyMirror = require('keyMirror'); var setImmediate = require('setImmediate'); +var _emitter = new EventEmitter(); +var _interactionSet = new Set(); +var _addInteractionSet = new Set(); +var _deleteInteractionSet = new Set(); +var _nextUpdateHandle = null; +var _queue = []; +var _inc = 0; + /** * InteractionManager allows long-running work to be scheduled after any * interactions/animations have completed. In particular, this allows JavaScript @@ -20,11 +28,14 @@ var setImmediate = require('setImmediate'); * * Applications can schedule tasks to run after interactions with the following: * - * InteractionManager.runAfterInteractions(() => { - * // ...long-running synchronous task... - * }); + * ``` + * InteractionManager.runAfterInteractions(() => { + * // ...long-running synchronous task... + * }); + * ``` * * Compare this to other scheduling alternatives: + * * - requestAnimationFrame(): for code that animates a view over time. * - setImmediate/setTimeout(): run code later, note this may delay animations. * - runAfterInteractions(): run code later, without delaying active animations. @@ -37,27 +48,32 @@ var setImmediate = require('setImmediate'); * creating an interaction 'handle' on animation start, and clearing it upon * completion: * - * var handle = InteractionManager.createInteractionHandle(); - * // run animation... (`runAfterInteractions` tasks are queued) - * // later, on animation completion: - * InteractionManager.clearInteractionHandle(handle); - * // queued tasks run if all handles were cleared + * ``` + * var handle = InteractionManager.createInteractionHandle(); + * // run animation... (`runAfterInteractions` tasks are queued) + * // later, on animation completion: + * InteractionManager.clearInteractionHandle(handle); + * // queued tasks run if all handles were cleared + * ``` */ - -var _emitter = new EventEmitter(); -var _interactionSet = new Set(); -var _addInteractionSet = new Set(); -var _deleteInteractionSet = new Set(); -var _nextUpdateHandle = null; -var _queue = []; -var _inc = 0; - var InteractionManager = { Events: keyMirror({ interactionStart: true, interactionComplete: true, }), + /** + * Schedule a function to run after all interactions have completed. + */ + runAfterInteractions(callback) { + invariant( + typeof callback === 'function', + 'Must specify a function to schedule.' + ); + scheduleUpdate(); + _queue.push(callback); + }, + /** * Notify manager that an interaction has started. */ @@ -81,20 +97,6 @@ var InteractionManager = { _deleteInteractionSet.add(handle); }, - /** - * Schedule a function to run after all interactions have completed. - * - * @param {function} callback - */ - runAfterInteractions(callback) { - invariant( - typeof callback === 'function', - 'Must specify a function to schedule.' - ); - scheduleUpdate(); - _queue.push(callback); - }, - addListener: _emitter.addListener.bind(_emitter), }; diff --git a/Libraries/react-native/react-native.js b/Libraries/react-native/react-native.js index 6f0b22df5f..00be3f65af 100644 --- a/Libraries/react-native/react-native.js +++ b/Libraries/react-native/react-native.js @@ -7,9 +7,9 @@ var ReactNative = { ...require('React'), - Animation: require('Animation'), ActivityIndicatorIOS: require('ActivityIndicatorIOS'), AlertIOS: require('AlertIOS'), + Animation: require('Animation'), AppRegistry: require('AppRegistry'), AppState: require('AppState'), AppStateIOS: require('AppStateIOS'), @@ -18,6 +18,7 @@ var ReactNative = { DatePickerIOS: require('DatePickerIOS'), ExpandingText: require('ExpandingText'), Image: require('Image'), + InteractionManager: require('InteractionManager'), LayoutAnimation: require('LayoutAnimation'), ListView: require('ListView'), ListViewDataSource: require('ListViewDataSource'),