[ReactNative] OSS Interaction Manager

This commit is contained in:
Christopher Chedeau 2015-03-14 11:42:25 -07:00
parent 66bb821a31
commit 2ad43094ea
2 changed files with 35 additions and 32 deletions

View File

@ -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),
};

View File

@ -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'),