Merge branch 'master' into ActivityIndicator/add-size-prop

.flowconfig

@@ -47,8 +47,8 @@ suppress_type=$FlowIssue
 suppress_type=$FlowFixMe
 suppress_type=$FixMe
 
-suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-8]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
-suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-8]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-9]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
+suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-9]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
 suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
 
 unsafe.enable_getters_and_setters=true

Examples/UIExplorer/UIExplorer.xcodeproj/project.pbxproj

@@ -902,7 +902,7 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
-			shellScript = "export NODE_BINARY=node\n$SRCROOT/../../packager/react-native-xcode.sh Examples/UIExplorer/UIExplorerApp.ios.js";
+			shellScript = "export NODE_BINARY=node\n$SRCROOT/../../packager/react-native-xcode.sh Examples/UIExplorer/js/UIExplorerApp.ios.js";
 		};
 /* End PBXShellScriptBuildPhase section */
 

Examples/UIExplorer/UIExplorer/AppDelegate.m

@@ -52,7 +52,7 @@ - (BOOL)application:(__unused UIApplication *)application didFinishLaunchingWith
 
 - (NSURL *)sourceURLForBridge:(__unused RCTBridge *)bridge
 {
-  NSURL *jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"Examples/UIExplorer/UIExplorerApp.ios" fallbackResource:nil];
+  NSURL *jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"Examples/UIExplorer/js/UIExplorerApp.ios" fallbackResource:nil];
 
   if (!getenv("CI_USE_PACKAGER")) {
     jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

Examples/UIExplorer/UIExplorerIntegrationTests/RCTLoggingTests.m

@@ -38,11 +38,10 @@ - (void)setUp
   if (getenv("CI_USE_PACKAGER")) {
     NSString *app = @"IntegrationTests/IntegrationTestsApp";
     scriptURL = [NSURL URLWithString:[NSString stringWithFormat:@"http://localhost:8081/%@.bundle?platform=ios&dev=true", app]];
-    RCTAssert(scriptURL != nil, @"No scriptURL set");
   } else {
     scriptURL = [[NSBundle bundleForClass:[RCTBridge class]] URLForResource:@"main" withExtension:@"jsbundle"];
-    RCTAssert(scriptURL != nil, @"Could not locate main.jsBundle");
   }
+  RCTAssert(scriptURL != nil, @"No scriptURL set");
 
   _bridge = [[RCTBridge alloc] initWithBundleURL:scriptURL moduleProvider:NULL launchOptions:nil];
   NSDate *date = [NSDate dateWithTimeIntervalSinceNow:60];

Examples/UIExplorer/UIExplorerUnitTests/RCTModuleInitNotificationRaceTests.m

@@ -21,6 +21,7 @@
 #import "RCTUtils.h"
 #import "RCTUIManager.h"
 #import "RCTViewManager.h"
+#import "RCTJavaScriptExecutor.h"
 
 #define RUN_RUNLOOP_WHILE(CONDITION) \
 { \

Examples/UIExplorer/UIExplorerUnitTests/RCTModuleInitTests.m

@@ -19,6 +19,7 @@
 #import "RCTBridge+Private.h"
 #import "RCTBridgeModule.h"
 #import "RCTUtils.h"
+#import "RCTJavaScriptExecutor.h"
 
 #define RUN_RUNLOOP_WHILE(CONDITION) \
 { \

Examples/UIExplorer/js/CameraRollView.js

@@ -198,7 +198,7 @@ var CameraRollView = React.createClass({
 
   _renderFooterSpinner: function() {
     if (!this.state.noMore) {
-      return <ActivityIndicator style={styles.spinner} />;
+      return <ActivityIndicator />;
     }
     return null;
   },

Examples/UIExplorer/js/ImageExample.js

@@ -165,7 +165,7 @@ var MultipleSourcesExample = React.createClass({
   },
   render: function() {
     return (
-      <View style={styles.container}>
+      <View>
         <View style={{flexDirection: 'row', justifyContent: 'space-between'}}>
           <Text
             style={styles.touchableText}
@@ -180,7 +180,7 @@ var MultipleSourcesExample = React.createClass({
         </View>
         <Text>Container image size: {this.state.width}x{this.state.height} </Text>
         <View
-          style={[styles.imageContainer, {height: this.state.height, width: this.state.width}]} >
+          style={{height: this.state.height, width: this.state.width}} >
           <Image
             style={{flex: 1}}
             source={[

Examples/UIExplorer/js/ListViewExample.js

@@ -65,7 +65,7 @@ var ListViewSimpleExample = React.createClass({
           dataSource={this.state.dataSource}
           renderRow={this._renderRow}
           renderScrollComponent={props => <RecyclerViewBackedScrollView {...props} />}
-          renderSeparator={this._renderSeperator}
+          renderSeparator={this._renderSeparator}
         />
       </UIExplorerPage>
     );
@@ -107,7 +107,7 @@ var ListViewSimpleExample = React.createClass({
     )});
   },
 
-  _renderSeperator: function(sectionID: number, rowID: number, adjacentRowHighlighted: bool) {
+  _renderSeparator: function(sectionID: number, rowID: number, adjacentRowHighlighted: bool) {
     return (
       <View
         key={`${sectionID}-${rowID}`}

Examples/UIExplorer/js/NavigatorIOSExample.js

@@ -217,7 +217,6 @@ const NavigatorIOSExample = React.createClass({
           component: NavigatorIOSExamplePage,
           passProps: {onExampleExit},
         }}
-        itemWrapperStyle={styles.itemWrapper}
         tintColor="#008888"
       />
     );

Examples/UIExplorer/js/UIExplorerList.android.js

@@ -50,6 +50,10 @@ var ComponentExamples: Array<UIExplorerExample> = [
     key: 'ModalExample',
     module: require('./ModalExample'),
   },
+  {
+    key: 'NativeAnimationsExample',
+    module: require('./NativeAnimationsExample'),
+  },
   {
     key: 'PickerExample',
     module: require('./PickerExample'),

Examples/UIExplorer/js/WebViewExample.js

@@ -178,8 +178,8 @@ var Button = React.createClass({
   render: function() {
     return (
       <TouchableWithoutFeedback onPress={this._handlePress}>
-        <View style={[styles.button, this.props.enabled ? {} : styles.buttonDisabled]}>
-          <Text style={styles.buttonText}>{this.props.text}</Text>
+        <View style={styles.button}>
+          <Text>{this.props.text}</Text>
         </View>
       </TouchableWithoutFeedback>
     );

Examples/UIExplorer/js/XHRExample.ios.js

@@ -379,7 +379,7 @@ class FormUploader extends React.Component {
     }
     return (
       <View>
-        <View style={[styles.paramRow, styles.photoRow]}>
+        <View style={styles.paramRow}>
           <Text style={styles.photoLabel}>
             Random photo from your library
             (<Text style={styles.textButton} onPress={this._fetchRandomPhoto}>

Libraries/Devtools/setupDevtools.js

@@ -11,10 +11,17 @@
  */
 'use strict';
 
+var Platform = require('Platform');
+var NativeModules = require('NativeModules');
+
 function setupDevtools() {
   var messageListeners = [];
   var closeListeners = [];
-  var ws = new window.WebSocket('ws://localhost:8097/devtools');
+  var hostname = 'localhost';
+  if (Platform.OS === 'android' && NativeModules.AndroidConstants) {
+    hostname = NativeModules.AndroidConstants.ServerHost.split(':')[0];
+  }
+  var ws = new window.WebSocket('ws://' + hostname + ':8097/devtools');
   // this is accessed by the eval'd backend code
   var FOR_BACKEND = { // eslint-disable-line no-unused-vars
     resolveRNStyle: require('flattenStyle'),

Libraries/Image/Image.android.js

@@ -34,6 +34,11 @@ var {
   ImageLoader,
 } = NativeModules;
 
+let _requestId = 1;
+function generateRequestId() {
+  return _requestId++;
+}
+
 /**
  * <Image> - A react component for displaying different types of images,
  * including network images, static resources, temporary local images, and
@@ -148,8 +153,17 @@ var Image = React.createClass({
      * Prefetches a remote image for later use by downloading it to the disk
      * cache
      */
-    prefetch(url: string) {
-      return ImageLoader.prefetchImage(url);
+    prefetch(url: string, callback: ?Function) {
+      const requestId = generateRequestId();
+      callback && callback(requestId);
+      return ImageLoader.prefetchImage(url, requestId);
+    },
+
+    /**
+     * Abort prefetch request
+     */
+    abortPrefetch(requestId: number) {
+      ImageLoader.abortRequest(requestId);
     },
   },
 

Libraries/Image/Image.ios.js

@@ -173,7 +173,7 @@ const Image = React.createClass({
      * - `repeat`: Repeat the image to cover the frame of the view. The
      * image will keep it's size and aspect ratio. (iOS only)
      */
-    resizeMode: PropTypes.oneOf(['cover', 'contain', 'stretch', 'repeat']),
+    resizeMode: PropTypes.oneOf(['cover', 'contain', 'stretch', 'repeat', 'center']),
     /**
      * A unique identifier for this element to be used in UI Automation
      * testing scripts.

Libraries/Image/RCTImageLoader.m

@@ -9,10 +9,12 @@
 
 #import "RCTImageLoader.h"
 
-#import <libkern/OSAtomic.h>
-#import <UIKit/UIKit.h>
 #import <ImageIO/ImageIO.h>
 
+#import <libkern/OSAtomic.h>
+
+#import <objc/runtime.h>
+
 #import "RCTConvert.h"
 #import "RCTDefines.h"
 #import "RCTImageUtils.h"
@@ -382,6 +384,9 @@ - (RCTImageLoaderCancellationBlock)_loadURLRequest:(NSURLRequest *)request
     if (error) {
       completionHandler(error, nil);
       return;
+    } else if (!response) {
+      completionHandler(RCTErrorWithMessage(@"Response metadata error"), nil);
+      return;
     } else if (!data) {
       completionHandler(RCTErrorWithMessage(@"Unknown image download error"), nil);
       return;
@@ -435,8 +440,16 @@ - (RCTImageLoaderCancellationBlock)_loadURLRequest:(NSURLRequest *)request
   // Download image
   __weak __typeof(self) weakSelf = self;
   RCTNetworkTask *task = [networking networkTaskWithRequest:request completionBlock:^(NSURLResponse *response, NSData *data, NSError *error) {
-    if (error) {
-      completionHandler(error, nil);
+    if (error || !response || !data) {
+      NSError *someError = nil;
+      if (error) {
+        someError = error;
+      } else if (!response) {
+        someError = RCTErrorWithMessage(@"Response metadata error");
+      } else {
+        someError = RCTErrorWithMessage(@"Unknown image download error");
+      }
+      completionHandler(someError, nil);
       [weakSelf dequeueTasks];
       return;
     }

Libraries/Image/RCTImageUtils.m

@@ -53,9 +53,10 @@ CGRect RCTTargetRect(CGSize sourceSize, CGSize destSize,
     destSize.height = destSize.width / aspect;
   }
 
-  // Calculate target aspect ratio if needed (don't bother if resizeMode == stretch)
+  // Calculate target aspect ratio if needed
   CGFloat targetAspect = 0.0;
-  if (resizeMode != UIViewContentModeScaleToFill) {
+  if (resizeMode != RCTResizeModeCenter &&
+      resizeMode != RCTResizeModeStretch) {
     targetAspect = destSize.width / destSize.height;
     if (aspect == targetAspect) {
       resizeMode = RCTResizeModeStretch;
@@ -72,12 +73,12 @@ CGRect RCTTargetRect(CGSize sourceSize, CGSize destSize,
 
       if (targetAspect <= aspect) { // target is taller than content
 
-        sourceSize.width = destSize.width = destSize.width;
+        sourceSize.width = destSize.width;
         sourceSize.height = sourceSize.width / aspect;
 
       } else { // target is wider than content
 
-        sourceSize.height = destSize.height = destSize.height;
+        sourceSize.height = destSize.height;
         sourceSize.width = sourceSize.height * aspect;
       }
       return (CGRect){
@@ -92,7 +93,7 @@ CGRect RCTTargetRect(CGSize sourceSize, CGSize destSize,
 
       if (targetAspect <= aspect) { // target is taller than content
 
-        sourceSize.height = destSize.height = destSize.height;
+        sourceSize.height = destSize.height;
         sourceSize.width = sourceSize.height * aspect;
         destSize.width = destSize.height * targetAspect;
         return (CGRect){
@@ -102,14 +103,34 @@ CGRect RCTTargetRect(CGSize sourceSize, CGSize destSize,
 
       } else { // target is wider than content
 
-        sourceSize.width = destSize.width = destSize.width;
+        sourceSize.width = destSize.width;
         sourceSize.height = sourceSize.width / aspect;
         destSize.height = destSize.width / targetAspect;
         return (CGRect){
           {0, RCTFloorValue((destSize.height - sourceSize.height) / 2, destScale)},
           RCTCeilSize(sourceSize, destScale)
         };
       }
+
+    case RCTResizeModeCenter:
+
+      // Make sure the image is not clipped by the target.
+      if (sourceSize.height > destSize.height) {
+        sourceSize.width = destSize.width;
+        sourceSize.height = sourceSize.width / aspect;
+      }
+      if (sourceSize.width > destSize.width) {
+        sourceSize.height = destSize.height;
+        sourceSize.width = sourceSize.height * aspect;
+      }
+
+      return (CGRect){
+        {
+          RCTFloorValue((destSize.width - sourceSize.width) / 2, destScale),
+          RCTFloorValue((destSize.height - sourceSize.height) / 2, destScale),
+        },
+        RCTCeilSize(sourceSize, destScale)
+      };
   }
 }
 
@@ -131,6 +152,10 @@ CGSize RCTTargetSize(CGSize sourceSize, CGFloat sourceScale,
                      BOOL allowUpscaling)
 {
   switch (resizeMode) {
+    case RCTResizeModeCenter:
+
+      return RCTTargetRect(sourceSize, destSize, destScale, resizeMode).size;
+
     case RCTResizeModeStretch:
 
       if (!allowUpscaling) {
@@ -207,6 +232,7 @@ BOOL RCTUpscalingRequired(CGSize sourceSize, CGFloat sourceScale,
       }
 
     case RCTResizeModeRepeat:
+    case RCTResizeModeCenter:
 
       return NO;
   }

Libraries/Image/RCTResizeMode.h

@@ -13,6 +13,7 @@ typedef NS_ENUM(NSInteger, RCTResizeMode) {
   RCTResizeModeCover = UIViewContentModeScaleAspectFill,
   RCTResizeModeContain = UIViewContentModeScaleAspectFit,
   RCTResizeModeStretch = UIViewContentModeScaleToFill,
+  RCTResizeModeCenter = UIViewContentModeCenter,
   RCTResizeModeRepeat = -1, // Use negative values to avoid conflicts with iOS enum values.
 };
 

Libraries/Image/RCTResizeMode.m

@@ -15,6 +15,7 @@ @implementation RCTConvert(RCTResizeMode)
   @"cover": @(RCTResizeModeCover),
   @"contain": @(RCTResizeModeContain),
   @"stretch": @(RCTResizeModeStretch),
+  @"center": @(RCTResizeModeCenter),
   @"repeat": @(RCTResizeModeRepeat),
 }), RCTResizeModeStretch, integerValue)
 

Libraries/Modal/Modal.js

@@ -11,6 +11,7 @@
  */
 'use strict';
 
+const I18nManager = require('I18nManager');
 const Platform = require('Platform');
 const PropTypes = require('react/lib/ReactPropTypes');
 const React = require('React');
@@ -157,13 +158,14 @@ class Modal extends React.Component {
   }
 }
 
+const side = I18nManager.isRTL ? 'right' : 'left';
 const styles = StyleSheet.create({
   modal: {
     position: 'absolute',
   },
   container: {
     position: 'absolute',
-    left: 0,
+    [side] : 0,
     top: 0,
   }
 });

Libraries/RCTTest/RCTTestRunner.m

@@ -47,11 +47,10 @@ - (instancetype)initWithApp:(NSString *)app
 
     if (getenv("CI_USE_PACKAGER")) {
       _scriptURL = [NSURL URLWithString:[NSString stringWithFormat:@"http://localhost:8081/%@.bundle?platform=ios&dev=true", app]];
-      RCTAssert(_scriptURL != nil, @"No scriptURL set");
     } else {
       _scriptURL = [[NSBundle bundleForClass:[RCTBridge class]] URLForResource:@"main" withExtension:@"jsbundle"];
-      RCTAssert(_scriptURL != nil, @"Could not locate main.jsBundle");
     }
+    RCTAssert(_scriptURL != nil, @"No scriptURL set");
   }
   return self;
 }