Compare commits

...
1266 Commits
Author SHA1 Message Date
James Ide 48278f8c8f [0.13.2] cherry-pick a92f107, 16a48ae, 1076f4a
Tested Movies app and Image demo in the UIExplorer.
2015-10-26 13:20:16 -07:00
Nick Lockwood 61c1e2a61b Added RCTDataRequestHandler
Summary: public

Added RCTDataRequestHandler, which is responsible for loading data URLs. This moves the logic for data URL handling out of RCTImageDownloader (no longer needed) and into the RCTNetwork library, where it makes more sense.

This also means that it is now possible to load data URLs via XHR, and use them for purposes other than just images.

Reviewed By: javache

Differential Revision: D2540964

fb-gh-sync-id: 4f0418bd6b9186f047cc8297276bb970795af104
2015-10-26 13:08:01 -07:00
Nick Lockwood da61ffdaae Fixed "Unrecognized request token" red box
Summary: public

There was a race condition issue in RCTDownLoadTask whereby the request handler would sometimes call one of the delegate methods before setup was complete, causing an error to be logged because the request token had not been set, and causing te request to fail because the class was not yet set up.

This diff fixes that issue by adding an explicit `start` method to RCTDownloadTask, and changing the setup order to allow for the request to call back immediately without this being treated as an error.

Reviewed By: tadeuzagallo

Differential Revision: D2553628

fb-gh-sync-id: 5ca4e791574a632ccbf2e873e28ac88bffdf851d
2015-10-26 13:06:48 -07:00
Nick Lockwood 0bc8944873 Added RCTFileRequestHandler
Summary: @​public

We previously discovered that using an NSURLSessionDataTask to load local files is noticably less efficient than using regular filesystem methods.

This diff adds RCTFileRequestHandler as a replacement for RCTHTTPRequestHandler when loading local files. This reduces loading time when loading local files via XMLHttpRequest, as well as improving the performance for some image load requests.

Reviewed By: @javache

Differential Revision: D2531710

fb-gh-sync-id: 259714baac131784de494d24939f42ad52bff41a
2015-10-26 13:06:41 -07:00
Martin Konicek 642ea9d93a [0.13.1] Remove temp JCenter repo 2015-10-24 01:00:20 +01:00
James Ide 7fdbc4c640 [0.13.0] Change package.json and React.podspec versions 2015-10-23 11:59:25 -07:00
Yuri Zarubin 3127ce11b9 Check that WS connection is open before closing it on failed. Fixes #3346
Summary: Check that the WS state is set to OPEN before trying to close it when the ```websocketFailed``` event fires. Otherwise the app throws an error at the Android level.

Fixes #3346
Closes https://github.com/facebook/react-native/pull/3347

Reviewed By: @​svcscm

Differential Revision: D2535807

Pulled By: @mkonicek

fb-gh-sync-id: bb70c551ea2e582cfaa80139a265dbbca6d990d2
2015-10-23 11:58:52 -07:00
Martin Konicek 1aa2cc4a82 Depend on 0.13 Android binaries from custom JCenter repo
Only needed until artifacts propagate through Maven Central.
2015-10-13 22:04:09 +01:00
Martin Konicek 553a898b32 [0.13.0-rc] Bump versions 2015-10-13 22:03:32 +01:00
Ben Alpert 5e33dbcfcc Move stuff out of vendor/react_contrib/
Summary: This was a confusing place for them. BoundingDimensions, Position, and Touchable were only used in Touchable; StaticContainer I moved to Libraries/Components.

@​public

Reviewed By: @vjeux

Differential Revision: D2530730

fb-gh-sync-id: e636a6b7259c2bd3ab52c82ebd59a6c66c9e7e7a
2015-10-12 11:18:30 -07:00
Martin Konicek 264cb8962a Don't publish /ReactAndroid/build to npm, update version on master
Summary: @​public

See the discussion in https://github.com/facebook/react-native/pull/3019

This is temporary Gradle output and can be huge (>100MB).

Reviewed By: @foghina

Differential Revision: D2531612

fb-gh-sync-id: 8874d39b1a9b35dc4b4ce465dd149589db75bb29
2015-10-12 11:11:40 -07:00
Russell Stewart 7b7625b1fe Update ToastAndroidExample.android.js
Summary: Closes https://github.com/facebook/react-native/pull/3236

Reviewed By: @​svcscm

Differential Revision: D2517317

Pulled By: @mkonicek

fb-gh-sync-id: cfbcffd5fdf5e5d2a59b35b35d890717ce64f4a3
2015-10-12 10:16:27 -07:00
Martin Konicek 302fb6aea7 Fix the package name of Android Switch
Reviewed By: @foghina

Differential Revision: D2531260

fb-gh-sync-id: aee885009b5c3f2072500eaa84669ece7c57d2e0
2015-10-12 10:11:26 -07:00
Tadeu Zagallo f7065e5c0a Support start and stopping systrace from repl
Reviewed By: @jspahrsummers

Differential Revision: D2512911

fb-gh-sync-id: f5441219f9d7063b3602c55efac9f07407e33f56
2015-10-12 09:45:40 -07:00
Christopher Chedeau e48807abfd Merge pull request #3362 from foghina/cli_suppress_create
[cli] suppress yeoman create output in init
2015-10-12 09:39:23 -07:00
Martin Konicek 2944c665bf Fix package name of DebugComponentOwnershipModule
Reviewed By: @foghina

Differential Revision: D2531355

fb-gh-sync-id: 71de71bfec0353fb45bb8dbc8a3f4ce7cad43925
2015-10-12 09:10:33 -07:00
Li Qichao 5198ed438a Fix the wrong offline bundle link in Movie example
Summary: When I am trying to figure out if there are several js files, there is only one bundle file. I am trying to use the command line in the comment which is
<code>curl 'http://localhost:8081/Examples/Movies/MoviesApp.includeRequire.runModule.bundle' -o main.jsbundle</code>
But after react native has upgraded to 0.12, this command line didn't work. You need to use:
<code>curl 'http://localhost:8081/Examples/Movies/MoviesApp.ios.bundle?platform=ios&dev=true' -o main.jsbundle</code>
And then it will work
Closes https://github.com/facebook/react-native/pull/3361

Reviewed By: @​svcscm

Differential Revision: D2531487

Pulled By: @javache

fb-gh-sync-id: 5fd96d427b1097de4e264cb047a13d5a382c6d0f
2015-10-12 08:59:22 -07:00
Andrei Coman 96dda4bf5f Revert D2531438
Differential Revision: D2531532

fb-gh-sync-id: c86bbcde3254df78f3dca88285ef1cd5a3563123
2015-10-12 08:36:27 -07:00
Martin Konicek c075be6cab .gitignore - build/ is related to both iOS and Android 2015-10-12 16:35:28 +01:00
Martin Konicek 8abfb5e0e2 Add docs for examples 2015-10-12 16:16:39 +01:00
Felix Oghină aa63636512 [cli] suppress yeoman create output in init 2015-10-12 16:10:18 +01:00
Christopher cab3bd6e86 Add note for iOS9 url scheme changes
Summary: Closes https://github.com/facebook/react-native/pull/3354

Reviewed By: @​svcscm

Differential Revision: D2531433

Pulled By: @javache

fb-gh-sync-id: a7d280f6f8d3e6fa723c6518110ca344f9583ddd
2015-10-12 08:04:24 -07:00
Martín Bigio d30384080a Bring back "download from server" perf optimization
Reviewed By: @frantic

Differential Revision: D2515566

fb-gh-sync-id: 25771888390154e9962d141f872cef85c08cd1d0
2015-10-12 06:39:44 -07:00
Nick Lockwood 799168929c Unify XCAsset handling logic
Summary: @​public

This diff unifies the logic for detecting when images refer to XCAsset files into a single function (RCTXCAssetNameForURL) and uses it for both +[RCTConvert UIImage:] and RCTImageLoader.

I've also tightened the definition of XCAssets so that it only applies to images inside .car files, not any image inside the main bundle. This avoids using the +[UIImage imageNamed:] when not strictly necessary, which is desirable since that method is not thread-safe, and has undocumented caching behavior that is difficult to reason about.

Reviewed By: @javache

Differential Revision: D2526400

fb-gh-sync-id: 7199c2a44f1d55ff236d2c38a0a9368739b993d5
2015-10-12 04:15:27 -07:00
Emmanouil Konstantinidis c16c3f9814 Fix typo - Remove duplicated "to have"
Summary: Closes https://github.com/facebook/react-native/pull/3015

Reviewed By: @​svcscm

Differential Revision: D2530576

Pulled By: @vjeux

fb-gh-sync-id: e7df3706f3c733e8de32c1f123d951b488133e8a
2015-10-11 21:14:54 -07:00
Christopher 53403423ca - Fix response variable from getCurrentReachability
Summary: Fixes #3333 and #2802
Closes https://github.com/facebook/react-native/pull/3345

Reviewed By: @​svcscm

Differential Revision: D2530744

Pulled By: @vjeux

fb-gh-sync-id: 521cbe482f3811339b21cf68ba2269d2b5286e82
2015-10-11 19:42:24 -07:00
James Ide 720228825b Merge pull request #3327 from gabro/patch-1
Update list of babel transformations in JavascriptEnvironment doc
2015-10-10 15:57:00 -07:00
Gabriele Petronella df1a6d5bed Add missing semicolon in example and remove extra one 2015-10-11 00:47:12 +02:00
Gabriele Petronella 72ac2f3c27 move await inside async function in async/await example 2015-10-11 00:45:27 +02:00
James Ide 2c7de35dee Export per-platform NavigatorNavigationBarStyles for consistent styling
Summary: This allows for the iOS-style navigation bar on Android and vice versa in order to simplify design. It is entirely optional in that NavigationBars will continue to defauly to their platform-specific style, but you can override it with the `navigationStyles` prop:

```js
<Navigator.NavigationBar
  navigationStyles={Navigator.NavigationBar.StylesIOS}
/>
```

Fixes #2995.
Closes https://github.com/facebook/react-native/pull/3028

Reviewed By: @​svcscm

Differential Revision: D2527902

Pulled By: @ericvicenti

fb-gh-sync-id: c7b1bfac200b5e03fc0d9dfb8acc8b916c825595
2015-10-10 15:32:46 -07:00
Gabriele Petronella cee9c6fe80 Update list of babel transformations in JavascriptEnvironment documentation
Re-sync the documentation with https://github.com/facebook/react-native/blob/master/packager/transformer.js#L35-L48
2015-10-10 15:18:07 +02:00
Andrei Coman 9f1dab69c1 Use correct spans in shadow nodes
Differential Revision: D2529951

fb-gh-sync-id: d3bfbe9ea4b9c0cd405a2e0fb9a3176274f0c9fa
2015-10-10 02:17:25 -07:00
Jiajie Zhu c86966c150 fix breadcrumb icon offset
Reviewed By: @fkgozali

Differential Revision: D2528804

fb-gh-sync-id: 6ed9e9ce330ecc147c3fb8217c7b1b0986c862fe
2015-10-09 17:53:26 -07:00
Atticus White 7abf8ba631 PanResponderExample fix for responding to events
Summary: Fixes #3312.

The example was no longer reacting to touch/drag events.

It looks like `setNativeProps` requires the `style` property to contain the style rules. It appears that this warning is [only in development mode](https://github.com/facebook/react-native/blob/381e2acd184fc4ba80a240ba3d7dda0464c6416b/Libraries/ReactIOS/NativeMethodsMixin.js#L115-L117), but after fixing it I am seeing the gestures recognized and properly handled. Running outside of the dev environment yielded the circle to be positioned at the top left of the screen, below the navigation bar, and inaccessible.

<img src="https://cloud.githubusercontent.com/assets/656630/10407224/1449b1b2-6eb6-11e5-8116-20d08f7721ec.png" width="350" />

![after](http://g.recordit.co/UIbeHcKZUg.gif)
Closes https://github.com/facebook/react-native/pull/3315

Reviewed By: @​svcscm

Differential Revision: D2529010

Pulled By: @vjeux

fb-gh-sync-id: 6b79573f42a2520197f77dcb76cd640ea614477f
2015-10-09 17:31:25 -07:00
Brent Vatne 05c08a472c Merge pull request #3314 from brentvatne/docs/add-dimensions
[Docs] Add Dimensions to API docs
2015-10-09 14:46:43 -07:00
Brent Vatne 36f015c0dd [Docs] Add Dimensions to API docs 2015-10-09 14:44:36 -07:00
James Ide 4f0a7250cc Add Node >= 4 requirement to package.json and packager/package.json
Summary: When you try to install these with old Node you'll now get a message from npm telling you that your version of Node is old. This makes it more obvious what's going on and hopefully reduces the number of issues we get due to people using an old version of Node.
Closes https://github.com/facebook/react-native/pull/3296

Reviewed By: @​svcscm

Differential Revision: D2526500

Pulled By: @vjeux

fb-gh-sync-id: 036e10a8d1819ea082e419cd328a458202f0e071
2015-10-09 14:44:23 -07:00
Ian MacLeod c612d830bb Preserve original global properties when polyfilling them
Summary: Fixes #934.
Closes https://github.com/facebook/react-native/pull/3293

Reviewed By: @​svcscm

Differential Revision: D2525598

Pulled By: @vjeux

fb-gh-sync-id: 90672550f723a183897456dc9512851bfa34807a
2015-10-09 14:41:23 -07:00
Mikhail Chinyakov aa8ead7cd6 Fix build process for react-native-fbsdk libraries.
Summary: I found the problem with building react-native-fbsdk (https://github.com/facebook/react-native-fbsdk) libraries when I used cocoapods.
When we use the option 'header_mappings_dir = "."' , header files of React will be copied with subfolders structures, not into one folder "${PODS_ROOT}/Headers/Public/React". And we should add recursive search and write "${PODS_ROOT}/Headers/Public/React/**". However writing code in auto-generated files is not good idea.
Closes https://github.com/facebook/react-native/pull/3248

Reviewed By: @​svcscm

Differential Revision: D2528021

Pulled By: @vjeux

fb-gh-sync-id: 4ea76eac4035f0bd7c5894f604f84f903714a4e3
2015-10-09 14:40:43 -07:00
Sebastian Markbage 17da325bb4 Add List of Common Cases to AttributePayload Benchmark
Summary: The most common cases is either that nothing changed or that only one part of
an array changed.

@​public

Reviewed By: @spicyj

Differential Revision: D2516385

fb-gh-sync-id: 0cd09b95ebac37ee1b575025d23ae2f2e6e2fb47
2015-10-09 14:31:23 -07:00
Christopher Chedeau 5369ccd3e6 Merge pull request #3311 from javache/objc-tests
Missing file rename
2015-10-09 11:03:35 -07:00
Pieter De Baets 37202f6c8f Missing file rename 2015-10-09 18:51:50 +01:00
Brent Vatne 2a89d94f96 Merge pull request #3310 from jabbrass/patch-1
[Docs] fix typo in KnownIssues.md
2015-10-09 09:46:52 -07:00
Ben Alpert ab6f375c66 Log React warnings internally, fix warnings in Android tests
Reviewed By: @javache

Differential Revision: D2517993

fb-gh-sync-id: c91a42a0abe4037b72c4497a5dc8b52a922fbf98
2015-10-09 09:33:24 -07:00
Martin Konicek a7b23df510 [Android] Add default Proguard config 2015-10-09 17:13:46 +01:00
Martin Konicek 3fce0a9d61 Update SignedAPKAndroid.md 2015-10-09 17:12:05 +01:00
Martin Konicek c5af96b471 Update SignedAPKAndroid.md 2015-10-09 17:11:25 +01:00
Martin Konicek fcf1103b95 Update SignedAPKAndroid.md 2015-10-09 17:10:43 +01:00
Martin Konicek 87ae707985 Update SignedAPKAndroid.md 2015-10-09 17:08:34 +01:00
Martin Konicek 2d206f7286 Update SignedAPKAndroid.md 2015-10-09 17:06:55 +01:00
Martin Konicek 5209114534 Update SignedAPKAndroid.md 2015-10-09 17:00:12 +01:00
Martin Konicek faeeb1567e Update SignedAPKAndroid.md 2015-10-09 16:55:07 +01:00
Martín Bigio 5196ad102d fix E2E tests
Reviewed By: @mkonicek

Differential Revision: D2526310

fb-gh-sync-id: 1c04f56073dc5b393a36b258c039fdfd85ab83a2
2015-10-09 07:59:02 -07:00
Pieter De Baets 67a69906e7 Allow image extensions when loading from asset catalogs
Reviewed By: @nicklockwood

Differential Revision: D2526258

fb-gh-sync-id: 01ccbddcfe8dc98ae5eeac1a066fbc1e69d6f087
2015-10-09 07:55:26 -07:00
Pieter De Baets 903eaa863c Fix logic for loading images from asset catalogs in RCTConvert
Reviewed By: @nicklockwood

Differential Revision: D2526264

fb-gh-sync-id: 039b0438fbce7c3e752271adc8d5aa5d4fe915e5
2015-10-09 07:46:41 -07:00
Martin Konicek 26f5f1ffc8 Update SignedAPKAndroid.md 2015-10-09 15:37:06 +01:00
Uri Baghin f52cd5dc1e Use path instead of resourceSpecifier so it unescapes.
Reviewed By: @nicklockwood

Differential Revision: D2526217

fb-gh-sync-id: c48af71402927b0aa4e9942e1825068af5334ab9
2015-10-09 06:39:43 -07:00
Martin Konicek de0e039898 Update SignedAPKAndroid.md 2015-10-09 14:30:58 +01:00
Felix Oghină 3a0a1a4122 expose JS source location to JS
Differential Revision: D2526103

fb-gh-sync-id: d597b52dd9442fc27b0841b7df447e9d8d7de6e1
2015-10-09 04:24:23 -07:00
Mike Armstrong fffae394c7 Use new hybrid inheritance for NativeArray and descendants
Reviewed By: @andreicoman11

Differential Revision: D2523619

fb-gh-sync-id: 62382c16cbbeceec12763b3786676ecff783b651
2015-10-09 03:11:35 -07:00
Martín Bigio 998ab1b1a4 Server failing on start up
Summary: @​public
When doing node <script> some es6 features like const seem to work. But when we extracted some of them into other files and require them through babels require infra it started failing because the paths where those files are located where not on the `only` whitelist.

Reviewed By: @vjeux

Differential Revision: D2525557

fb-gh-sync-id: 79752c4f9b8ff2d20f73cfe27d6a2f3706959d95
2015-10-08 21:08:21 -07:00
J. Andrew Brassington 3ae0f4044f [Docs] fix typo in KnownIssues.md
Line 53: "currenty" => "currently"
2015-10-08 17:42:38 -07:00
Martín Bigio 32b62ef055 Unbreak packager on oss master
Summary: @​public
This was a hard one, bare with me on the full story of what happened.

We recently started writting additional JS scripts in ES6 for the cli. These code needs to be transformed by babel before we execute it as we don't run node with `--harmony`. To do so we removed the `only` attribute on the `babel-register`. Turns out this broke the packager on oss as if no `only` not `ignore` parameter is specified babel will ignore `node_modules`. Since on oss when a project is created `react-native-github` is located inside of `node_modules` we started getting syntax errors.

The fix is to include separately all the different paths we need to make sure babel transforms each of them. We cannot simply have a single `babel-core/register` as we need to include paths that belong both to oss and internal only. So, we need to have multiple `register` invocations. Since babel does not accumulate the `only` you send on every invocation we need to build a small wrapper to do so.

Reviewed By: @frantic

Differential Revision: D2522426

fb-gh-sync-id: 379a7bb169c7d5cb3002268742de269238bba766
2015-10-08 17:37:27 -07:00
Martín Bigio 42d756310a Unify oss and internal version of base body loader middleware
Reviewed By: @amasad

Differential Revision: D2519637

fb-gh-sync-id: 88f23c33a1ca0423852ce8ed7696df811e3f8d27
2015-10-08 14:21:15 -07:00
Martín Bigio 0a835b7994 Factor out cpu profiler middleware into it's own file
Reviewed By: @amasad

Differential Revision: D2519562

fb-gh-sync-id: c2b2ba56072d75d7082740532b5d1959273c84f4
2015-10-08 14:21:07 -07:00
Martín Bigio 22e88f2069 Unify oss and internal version of systrace profiler middleware
Reviewed By: @amasad

Differential Revision: D2519518

fb-gh-sync-id: 6682f80447e2b62fcf6b137412ca8ddbe03ecb09
2015-10-08 14:20:58 -07:00
Martín Bigio f980c33073 Unify oss and internal version of status page middleware
Reviewed By: @vjeux

Differential Revision: D2519415

fb-gh-sync-id: 2cf27c88b29c18a7a1f3aa1611f0d7f510a8fa24
2015-10-08 14:20:50 -07:00
Martín Bigio f37ad56afd Unify oss and internal version of stack trace editor opener
Reviewed By: @vjeux

Differential Revision: D2519344

fb-gh-sync-id: 022d8865cd8eea3b0b51f9070c000f15c464dc6a
2015-10-08 14:20:42 -07:00
Martín Bigio 35f9ac89a7 Unify oss and internal version of dev-tools middleware
Reviewed By: @amasad

Differential Revision: D2518928

fb-gh-sync-id: 0c98b16481b524436a2cf4af3e196ac5715b55ee
2015-10-08 14:20:33 -07:00
Brent Vatne 1fd2e176ae Fix broken code block and make the example nicer
Summary: @​kmagiera @mkonicek - made a mistake while updating it, removed the `margin` style for some reason on the inner Text (it was 1am, ¯\_(ツ)_/¯). This also makes the example nicer looking - style the navigation with a white background, center the text in the main content view.

![](http://url.brentvatne.ca/16xXe.png)
![](http://url.brentvatne.ca/1a4Jt.png)
Closes https://github.com/facebook/react-native/pull/2682

Reviewed By: @​svcscm

Differential Revision: D2454465

Pulled By: @mkonicek

fb-gh-sync-id: 2fa17366b34ae31c490d37791ad693c17ac3f128
2015-10-08 14:01:52 -07:00
Nick Lockwood 7fe7a2a26b Improved JS bundle loading performance
Summary: @​public

RCTJavaScriptLoader was using an NSURLSessionDataTask to load local bundle.js files. While this works, it was non-optimal from a performance point of view.

Reviewed By: @tadeuzagallo

Differential Revision: D2522598

fb-gh-sync-id: b32981b3be4c336512d1462d3f4943b5aad34ae0
2015-10-08 12:39:52 -07:00
Nick Lockwood 91e6c98ecd Implemented inline image support for <Text>
Summary: @​public

This diff implements inline image support for <Text> nodes. Images are specified using <Image> tags, however all properties of the image are currently ignored apart from the source (including width/height styles).

Images are loaded asyncronously, and will trigger a text re-layout when they have loaded.

Reviewed By: @javache

Differential Revision: D2507725

fb-gh-sync-id: 59d0696d00a1bc531915cc35242a16b2dec96e85
2015-10-08 11:56:25 -07:00
Martin Konicek c740edaf03 Add a comment to CLI's init 2015-10-08 17:49:05 +01:00
Marc Horowitz 23a16f60f8 Update fbjni from upstream
Reviewed By: @mkonicek

Differential Revision: D2517281

fb-gh-sync-id: 9deeae6821f13394a2886d6d86781b4f563aadf6
2015-10-08 08:46:31 -07:00
Alexey Lang e3e9be9efb Log time to prepare native config
Reviewed By: @jspahrsummers

Differential Revision: D2517033

fb-gh-sync-id: fd560304f163b0ab9be592024e2a9b793fb990bc
2015-10-08 08:46:25 -07:00
Pieter De Baets 6ca8f4836d Disable RCTAssert completely in production builds
Reviewed By: @tadeuzagallo, @jspahrsummers

Differential Revision: D2521700

fb-gh-sync-id: f769afd98bb662e8bbe773adb45990f2175cdfe4
2015-10-08 08:26:20 -07:00
Nick Lockwood 63a37be1dd Removed RCTCache
Reviewed By: @tadeuzagallo

Differential Revision: D2410542

fb-gh-sync-id: 98af1b51802e69e7ede9a31feda0df5a526a6db5
2015-10-08 05:37:29 -07:00
Pieter De Baets 706cf38931 Fix Xcode analyzer warning
Reviewed By: @nicklockwood

Differential Revision: D2517025

fb-gh-sync-id: 3948f6b4255bc9035b2e7441469d0cc31c8027f8
2015-10-08 05:37:23 -07:00
Pieter De Baets 83f14da0a3 Fix OSS UIExplorer tests
Reviewed By: @jspahrsummers

Differential Revision: D2517136

fb-gh-sync-id: d00ddcd8baa0f06c4f41f57b8336d67e354eca5b
2015-10-08 04:20:23 -07:00
James Ide cb8b656a82 Only handle accessibility notifications from the correct RCTAccessibilityManager
Summary: When you reload and create a new bridge, one of the things that happens during setup is that the RCTAccessibilityManager fires a notification. The old bridge would receive this notification from the new bridge's RCTAccessibilityManager, which we don't want, especially because the two are running on different shadow queues.

I believe this led to a gnarly crash in NSConcreteTextStorage because RCTMeasure in RCTShadowText.m was getting called for the old RCTText (getting destroyed) from a notification fired from the new shadow queue. The fix is for the UIManager to handle notifications only from its bridge's RCTAccessibilityManager. See #2001 for the kinds of crashes we were seeing.
Closes https://github.com/facebook/react-native/pull/3279

Reviewed By: @​svcscm

Differential Revision: D2521652

Pulled By: @nicklockwood

fb-gh-sync-id: a4ffe3ef8304667727e573e2a2e8b716e1d2f3e1
2015-10-08 04:00:41 -07:00
Mike Armstrong 34c26f31f6 Add dev mode to Android settings menu
Differential Revision: D2521488

fb-gh-sync-id: 28ae23a43570682e42eec4b6995235e8c65dd786
2015-10-08 00:12:25 -07:00
James Ide 3b370ce438 Merge pull request #3277 from exponentjs/showcase
[Showcase] Update attribution for Exponent
2015-10-07 18:08:39 -07:00
James Ide 6aad09e8d6 [Showcase] Update attribution for Exponent
Updated the "by whom" info.

Test Plan: Build and view website.
2015-10-07 18:07:26 -07:00
James Ide 47cc9c382a Merge pull request #3275 from smothers/patch-1
Showcase: add Posyt
2015-10-07 18:06:48 -07:00
Chris Smothers 4e1ff687dd add Posyt to showcase.js 2015-10-07 20:41:30 -04:00
James Ide 70721858cf Merge pull request #3269 from pmadruga/docs_link_fix
fix navigator comparison link in performance doc
2015-10-07 15:27:28 -07:00
James Ide 441bad6bdd Merge pull request #3272 from nsimmons/cli/actually_make_init_backwards_compatible
[cli] make init backwards-compatible for real
2015-10-07 15:26:31 -07:00
Nick Simmons 8d3bbdf8e6 [cli] make init backwards-compatible for real 2015-10-07 17:39:22 -04:00
gabe@fb.com 49a0ae7c32 Deploy v0.17.0
Reviewed By: @jeffmo

Differential Revision: D2512723

fb-gh-sync-id: d16ef34ae727123fbc5b833e828b04faf19b350f
2015-10-07 12:24:21 -07:00
gabe@fb.com 08ec89d2e6 Fix errors in preparation for v0.17.0
Reviewed By: @jeffmo

Differential Revision: D2512681

fb-gh-sync-id: dedf465af43cf3c8839fa960c5f1a2c2648e4e1e
2015-10-07 12:03:20 -07:00
Pedro Madruga 2bdfb40a82 fix navigator comparison link in performance doc 2015-10-07 20:50:08 +02:00
Christopher Chedeau f2bd983029 Remove useless warning
Reviewed By: @frantic

Differential Revision: D2515006

fb-gh-sync-id: f411a4c2ccf73bb12bcd1caa7d0272a9de06509a
2015-10-07 11:07:29 -07:00
Martin Konicek c819c5590b Add @satya164's WebSocket docs from #2839 2015-10-07 18:09:21 +01:00
Martin Konicek 2d7747ecb7 Add NativeMethodsMixin docs to website 2015-10-07 18:04:55 +01:00
Kyle Corbitt 381e2acd18 Document NativeMethodsMixin
Summary: This is related to the discussion in #3155.

I've documented the methods in this mixin, and pointed to other appropriate documentation where necessary as well.

I didn't end up adding any examples. I wanted to add a `focus()`/`blur()` example to the UIExplorer app, but the app seems to be broken on master at the moment (`Requiring unknown module "event-target-shim"`) and I didn't bother trying to fix it. I think the last thing necessary for making the usage of these methods clear is an example of calling one or more of them on a `ref` or view captured in some other way. However, `setNativeProps` is well documented in the "Direct Manipulation" guide, which I link to from this page, so by extension it should be possible to figure out the functionality of the other methods.

cc @mkonicek @​astreet
Closes https://github.com/facebook/react-native/pull/3238

Reviewed By: @​svcscm

Differential Revision: D2517187

Pulled By: @mkonicek

fb-gh-sync-id: 4e68b2bc44ace83f06ae2e364ca0c23a7c461b20
2015-10-07 09:43:22 -07:00
Satyajit Sahoo f4857a6d42 Implement WebSocket module for Android. Fixes #2837
Summary: The JavaScript code for Android is same as the iOS counterpart, I just added few new lines and used arrow functions instead of binding `this`.
Closes https://github.com/facebook/react-native/pull/2839

Reviewed By: @​svcscm, @vjeux

Differential Revision: D2498703

Pulled By: @mkonicek

fb-gh-sync-id: 3fe958dd5af0efba00df07515f8e33b5d87eb05b
2015-10-07 08:36:22 -07:00
Martin Konicek 57a7387d85 Merge pull request #3061 from satya164/signed-apk
[Android] Added docs about generating a signed APK
2015-10-07 16:28:35 +01:00
Andrei Coman c805157cac Fix touch target computation
Differential Revision: D2516811

fb-gh-sync-id: 1f3490f969912f1eb8f4d49a5daa976314bbc25f
2015-10-07 01:54:22 -07:00
Mike Armstrong fb90ba6ded Use new hybrid inheritance for NativeArray and descendants
Differential Revision: D2516708

fb-gh-sync-id: 75bc2d7095ffe2c397d5ffb34b621b322b858c3e
2015-10-07 01:02:24 -07:00
Mike Armstrong 8251f1c905 Systrace stub fixes
Differential Revision: D2516670

fb-gh-sync-id: 89d7fdce569d4b37633fb4ab4acbeef707d54bac
2015-10-06 23:58:23 -07:00
James Ide 9dfd487810 Merge pull request #3258 from winfieldco/master
Adding AIGA Design Conference app to showcase
2015-10-06 23:23:59 -07:00
Christopher Auyeung ffd3f6941b Adding AIGA Design Conference app to showcase 2015-10-06 23:56:44 -04:00
Martin Konicek 0a419650ce Open source ViewPagerAndroid
Reviewed By: @foghina

Differential Revision: D2513014

fb-gh-sync-id: d9bb668d76939ad85b657233c8b7beac9b244fab
2015-10-06 20:01:21 -07:00
Sebastian Markbage 6244fd003d Refactor Attribute Processing (Step 3)
Reviewed By: @spicyj

Differential Revision: D2514193

fb-gh-sync-id: 8ba55014e8d052c69d8e1def327284ec974d6837
2015-10-06 15:36:32 -07:00
Sebastian Markbage 2ea3b93784 Add warning to setNativeProps and Animated for non-nested styles
Summary: These were accidentally supported because they were merged at a lower
level. That's an implementation detail. setNativeProps should still
normalize the API.

I fixed some callers.

Setting props the normal way used to ignore these. Unfortunately we can't
warn for those cases because lots of extra props are spread. (The classic
transferPropsTo issue.)

@​public

Reviewed By: @vjeux

Differential Revision: D2514228

fb-gh-sync-id: 00ed6073827dc1924da20f3d80cbdf68d8a8a8fc
2015-10-06 15:36:23 -07:00
Martín Bigio 82b3a6b967 Merge pull request #3204 from benvinegar/GH-3202
Add --write-sourcemap option to 'bundle' cli command (fixes #3202)
2015-10-06 18:18:05 -04:00
James Ide 9d8ecb65e4 Merge pull request #3253 from yamill/showcase-wpv
Add WPV app to Showcase
2015-10-06 12:05:18 -07:00
Yamill Vallecillo 0aaa45c434 Add WPV app to Showcase 2015-10-06 14:52:28 -04:00
Andrei Coman a876b234c6 Fix element inspector
Differential Revision: D2513268

fb-gh-sync-id: c0c91cc96926eb6d222c7cbc8855342e8594a09f
2015-10-06 11:41:32 -07:00
Robert Fleischmann 0de9e0104a Provide default loading view for React views in Wilde
Reviewed By: @javache

Differential Revision: D2496540

fb-gh-sync-id: 31488a6d1fc1f679ab4361d6a8d48f19b2347703
2015-10-06 10:39:28 -07:00
Pieter De Baets 9e81dec5e4 Only dismiss <Modal> once
Reviewed By: @nicklockwood

Differential Revision: D2512593

fb-gh-sync-id: b56eacd3965de76d6b7288199eabeaa5f63547cd
2015-10-06 10:29:27 -07:00
Spencer Ahrens 36cbe74f99 introduce universal switch
Reviewed By: @vjeux, @mkonicek

Differential Revision: D2441456

fb-gh-sync-id: c4050ec86f30234ea29c38205d668157bde65a35
2015-10-06 10:29:22 -07:00
Felix Oghina 8f7748748e Revert [React Native] Refactor Attribute Processing (Step 3)
Reviewed By: @kmagiera, @mikearmstrong001

Differential Revision: D2512548

fb-gh-sync-id: bcae3a8c85bfcfa468f2128288a25f406d78cf08
2015-10-06 10:29:18 -07:00
Mike Armstrong 5d682d65f6 set JS profiling global to true, fix to parsing of strings with ascii value >=128
Reviewed By: @mkonicek

Differential Revision: D2512320

fb-gh-sync-id: 098727cd664f0f0cdb0092875a9934a5d7b577f2
2015-10-06 10:29:11 -07:00
Felix Oghina b5890e1283 use listview for redbox stacktrace, open file on click
Reviewed By: @andreicoman11

Differential Revision: D2512364

fb-gh-sync-id: 5f2c90db7eca010185080f726fd3ef0ee519cdbc
2015-10-06 10:29:06 -07:00
Pieter De Baets 06ef95799a Allow nil tabbar item icon
Reviewed By: @nicklockwood

Differential Revision: D2508310

fb-gh-sync-id: e4eaf1237cca380b74d154c3cda50379fbafcf00
2015-10-06 10:29:01 -07:00
Pieter De Baets 81278d1a39 Fix UIExplorer integration tests
Reviewed By: @vjeux

Differential Revision: D2510761

fb-gh-sync-id: 21ec8988305ba9f3526277a8b445676ac4fcf3aa
2015-10-06 10:28:57 -07:00
Andrei Coman ea8d0b6c1f Protect against SQLiteFullExceptions
Reviewed By: @kmagiera

Differential Revision: D2512317

fb-gh-sync-id: 93fd65ebd88e42b5afc4e06c0612576101f15c97
2015-10-06 10:28:51 -07:00
Bret Johnson b7b83e4f12 Fixed to use ; instead of : as the path delimiter on Windows, for NDK_MODULE_PATH
Summary: Also fixed the extra slash before first-party in that path (it was ...//first-party
and is now .../first-party).  The $dir funct always produces a result that ends with
a /, so APP_MK_DIR always ends in a / and no extra / is needed when appending to it.
With these two changes all of React Native for Android, including C++, seems to
build OK on Windows 😄
Closes https://github.com/facebook/react-native/pull/2961

Reviewed By: @​svcscm

Differential Revision: D2512239

Pulled By: @kmagiera

fb-gh-sync-id: 4fbc9fc85bab455b8ed1e07a8ac299a48921753e
2015-10-06 10:28:46 -07:00
Sebastian Markbage ac5b7548d2 Refactor Attribute Processing (Step 3)
Summary: Decouple processStyle from the main reconciliation. It is now a process
extension to the style attribute `transform`. This effectively decouples a
large portion of special cases and helper dependencies from the reconciler.

The transform attribute becomes translated into the transformMatrix attribute on
the native side so this becomes a little weird in that I have to special case
it. I don't think it is worth while having a general solution for this so I
intend to rename the native attribute to `transform` and just have it accept the
resolved transform. Then I can remove the special cases.

The next step is generalizing the flattenStyle function and optimizing it.

@​public

Reviewed By: @vjeux

Differential Revision: D2460465

fb-gh-sync-id: 243e7fd77d282b401bc2c028aec8d57f24522a8e
2015-10-06 10:28:41 -07:00
Sebastian Markbage 8e3ce0ff98 Refactor Attribute Processing (Step 2)
Summary: Move the ViewAttributes and StyleAttributes configuration into the
Components library since they're coupled and change with the
native component configuration.

This also decouples StyleAttributes from the reconciler by adding it
to the ReactViewAttributes.

To do that, I refactored the property diffing to allow for recursive
configurations. Now an attribute configuration can be a nested object,
a custom configuration (diff/process) or true.

The requireNativeComponent path incorrectly gets its attributes set up
on the root validAttributes instead of the nested style object.
So I also have to add the nested form. Effectively these currently allow
these attributes on props or nested.

@​public

Reviewed By: @vjeux

Differential Revision: D2456842

fb-gh-sync-id: cd5405bd8316c2fcb016d06c61244ce7719c26c0
2015-10-06 10:28:35 -07:00
Sebastian Markbage 6c5024ec58 Refactor Attribute Processing (Step 1)
Summary: Concolidate the creation of the "update payload" into
ReactNativeAttributePayload which now has a create
and a diff version. The create version can be used by
both mountComponent and setNativeProps. This means that
diffRawProperties moves into ReactNativeAttributePayload.

Instead of storing previousFlattenedStyle as memoized
state in the component tree, I recalculate it every
time. This allows better use of the generational GC.
However, it is still probably a fairly expensive
technique so I will follow it up with a diff that
walks both nested array trees to do the diffing in a
follow up.

This is the first diff of several steps.

@​public

Reviewed By: @vjeux

Differential Revision: D2440644

fb-gh-sync-id: 1d0da4f6e2bf716f33e119df947c044abb918471
2015-10-06 10:28:27 -07:00
Madelaine Boyd 62e8ddc205 Revert g90f63f5c6fbbadd3ce6486e65d6fe6f967f56db6: [RN] add allTime vs. perBatch UIManager stats
fb-gh-sync-id: cef98420bcb8e708196bd5e162fa5dc4003b4fa2
2015-10-05 17:34:23 -07:00
Martin Bigio 725e3eba6e Fix bad require
Reviewed By: @vjeux, @​swarr

Differential Revision: D2509919

fb-gh-sync-id: 8c3555d080a2b49c3a1effbe5c7e1d31a9a04767
2015-10-05 15:32:22 -07:00
Spencer Ahrens 340229303f add allTime vs. perBatch UIManager stats
Summary: @​public

UIManagerStatTracker now provides allTime and perBatch stats so it's easy to see
how bit each batch is.

Reviewed By: @vjeux

Differential Revision: D2506218

fb-gh-sync-id: 635556185245d2bd6cb149497ea60b503b2523ce
2015-10-05 14:19:08 -07:00
Spencer Ahrens b0bdd4e45d Fix ListView bug where onEndReached wouldn't trigger initially
Summary: @​public

Sometimes we want to load a very small number of rows initially and want the
onEndReached callback to be called immediately to trigger more data to be
loaded without waiting for the  user to scroll at all.  This diff makes that
happen by also checking on mount instead of only when scrolling.

Reviewed By: @vjeux

Differential Revision: D2507184

fb-gh-sync-id: ea8e47667d00387a935a426dd45afe978fd6d8cd
2015-10-05 13:49:00 -07:00
Christopher Chedeau d409f13abe Merge pull request #3241 from vjeux/warning_cli
[cli] Add a big warning to stop people from modifying the global cli
2015-10-05 11:21:51 -07:00
Christopher Chedeau cfd19bb6cd [cli] Add a big warning to stop people from modifying the global cli 2015-10-05 11:20:04 -07:00
Tadeu Zagallo ad622f20f2 Fix wrong source map test
Reviewed By: @javache
2015-10-05 11:15:20 -07:00
Alexey Lang 7b514c63df Log native modules init time and config inject time separately
Reviewed By: @jspahrsummers

Differential Revision: D2508010
2015-10-05 11:05:23 -07:00
Martin Konicek fd124f0cbe Merge pull request #3240 from vjeux/cli_contributing
[cli] Use contributing.md as readme
2015-10-05 19:02:42 +01:00
Christopher Chedeau 92fd668653 [cli] Use contributing.md as readme
The readme is basically empty but contributing has a ton of useful information. Github's interface show everything in readme inline when you open the folder, so might as well make this information more visible.
2015-10-05 10:57:39 -07:00
Martin Konicek 2c522cd16c Update KnownIssues.md 2015-10-05 18:53:00 +01:00
Andrei Coman 166a96bcee Fix keyboardShouldPersistTaps default value
Reviewed By: @astreet

Differential Revision: D2507878
2015-10-05 10:25:21 -07:00
Pieter De Baets babdeb33ba Make processColor more efficient
Reviewed By: @nicklockwood, @vjeux

Differential Revision: D2507684
2015-10-05 10:15:34 -07:00
Felix Oghină 787895e903 check for destroyed instance before calling native method
Differential Revision: D2508050
2015-10-05 09:30:51 -07:00
Martin Konicek 85370ecba6 Update KnownIssues.md 2015-10-05 17:23:57 +01:00
Martín Bigio 9a22b1e78b Introduce internal server command
Reviewed By: @frantic

Differential Revision: D2449459
2015-10-05 09:21:34 -07:00
Martín Bigio 7ad418a396 Move fbobjc bundle command to cli
Reviewed By: @frantic

Differential Revision: D2457072
2015-10-05 09:21:27 -07:00
Martin Konicek fe477fbdb4 Update KnownIssues.md 2015-10-05 17:20:13 +01:00
Martin Konicek c99e8cbb5e Update KnownIssues.md 2015-10-05 16:51:28 +01:00
Tadeu Zagallo 753cc7683c Fix minified source maps
Summary: @​public

The source maps generated by uglify are already stringified, and therefore were
being stringified twice.

Reviewed By: @martinbigio

Differential Revision: D2498242
2015-10-05 08:48:25 -07:00
Mike Armstrong 17c49e2879 systrace of Fresco
Differential Revision: D2507874
2015-10-05 08:07:31 -07:00
Mike Armstrong 4a5fed3c42 Markers for JSC and Bridge Initialization
Differential Revision: D2507869
2015-10-05 08:07:23 -07:00
Martin Konicek 943f62b81b Merge pull request #3193 from winterbe/issue2797
Add --verbose option to react-native-cli (fixes #2797)
2015-10-05 15:16:45 +01:00
Pieter De Baets 7c1b6b0fb6 Vendor tinycolor; strip unnecessary components
Reviewed By: @vjeux

Differential Revision: D2503048
2015-10-05 04:41:26 -07:00
Dral 95a4f441e0 Silently (warning) fail when <Image> source has empty uri
Summary: fixes #3127
Closes https://github.com/facebook/react-native/pull/3185

Reviewed By: @​svcscm

Differential Revision: D2507588

Pulled By: @nicklockwood
2015-10-05 04:08:24 -07:00
Dral 463b072dac Support hex values in outputRange
Summary: 1. Should I add an example of this to the UIExplorer Animation example?

2. Should I support mixing hex and rgba values in outputRange? It is possible with this implementation, but may cause confusion
Closes https://github.com/facebook/react-native/pull/3177

Reviewed By: @​svcscm

Differential Revision: D2506947

Pulled By: @vjeux
2015-10-04 14:37:59 -07:00
Amjad Masad 8356b609a5 Use different cache keys for Package objects (fixes #2949)
Summary: @​public

Dead-lock trying to read package.json because it's both a "module" and a "package". in `Module.getName` it uses the cache key "name" and tries to call `Package.getName` which uses the same cache key and we end up returning the same promise that we're trying to resolve resulting in a dead-lock.

This changes the cache keys for the packages that adds a prefix "package-".

Reviewed By: @vjeux

Differential Revision: D2506979
2015-10-04 12:37:25 -07:00
James Ide 3cdd8d0320 Include ReactAndroid with the npm distribution
Summary: Enables building RN Android from source while keeping it in sync with the iOS distribution.
Closes https://github.com/facebook/react-native/pull/3019

Reviewed By: @​svcscm

Differential Revision: D2506390

Pulled By: @vjeux
2015-10-03 11:49:33 -07:00
Dral a9b8ca027c Clear timeouts on unmount in TouchableMixin
Summary: Fixes #1152
Closes https://github.com/facebook/react-native/pull/3176

Reviewed By: @​svcscm

Differential Revision: D2506385

Pulled By: @vjeux
2015-10-03 11:49:27 -07:00
James Ide ac069aaf12 Update the packager's version check message for Node 4.0
Summary: Users should use Node 4.0 instead of io.js. This isn't a hard requirement since io.js still works but it's simpler if everyone is on the latest version.
Closes https://github.com/facebook/react-native/pull/2547

Reviewed By: @​svcscm

Differential Revision: D2506388

Pulled By: @vjeux
2015-10-03 11:49:21 -07:00
Christopher Chedeau bcf9c42bae Merge pull request #3207 from FormationsFactory/showcase-add-formations-factory-company-name-search-app
Add Formations Factory Company name search app to [Showcase]
2015-10-03 11:06:36 -07:00
James Ide c649211147 Add unit tests to flattenStyle
Summary: The StyleSheet merging algorithm was modeled after `Object.assign` and the native spread operator. This diff converts `flattenStyle` to actually use `Object.assign`.
Closes https://github.com/facebook/react-native/pull/3048

Reviewed By: @​svcscm

Differential Revision: D2506387

Pulled By: @vjeux
2015-10-03 10:17:23 -07:00
Julius Jurgelenas 4b7c639ccc Add Formations Factory Company name search app to Showcase 2015-10-03 11:09:44 +03:00
Amir Rosenfeld 22d507a680 robust native in fbobjc
Reviewed By: @fkgozali

Differential Revision: D2505371
2015-10-02 18:22:23 -07:00
Ben Vinegar a16d0e46d8 Add --write-sourcemap option to 'bundle' cli command (fixes GH-3202) 2015-10-02 16:01:18 -07:00
Mike Grabowski 2f76c8a4a9 Fixes #3060
Summary: This pull request fixes a glitch that occurred when scrolling horizontally, as described in the #3060.
Closes https://github.com/facebook/react-native/pull/3169

Reviewed By: @​svcscm

Differential Revision: D2500186

Pulled By: @mkonicek
2015-10-02 14:32:23 -07:00
Pieter De Baets 0fb2fb37cc Silence analyzer warning for nil-checking NSNumber
Reviewed By: @jspahrsummers

Differential Revision: D2503068
2015-10-02 12:36:30 -07:00
Christopher Chedeau 6f84ccf51a Fix tests related to event-target-shim
Summary: @​public

Jest has an issue where if you export `Symbol` it crashes badly. Since event-target-shim does that, it breaks everything. Mocking that module fixes the issue until @cpojer comes back from vacation and fixes the bug in Jest itself.

Reviewed By: @jingc

Differential Revision: D2503562
2015-10-02 12:36:23 -07:00
Dave Miller b8c42f7f6f Introduce SnapshotView which wraps Renderable content and will verify the snapshot
Reviewed By: @javache

Differential Revision: D2493722
2015-10-02 12:15:24 -07:00
Alex Kotliarskyi de736227fa Add packager-managed assets support to NavigatorIOS
Reviewed By: @vjeux

Differential Revision: D2500520
2015-10-02 12:02:29 -07:00
Abhishek Sood e08a507f75 This reverts D2502620
Differential Revision: D2503381
2015-10-02 11:33:23 -07:00
James Ide 9dd956a84b Merge pull request #3197 from skv-headless/fix-link-to-animations
[Docs] fix link to animation examples
2015-10-02 11:32:22 -07:00
Kushal Dave 1d77645a53 Set scrollsToTop = NO for UITextViews
Summary: Complete the work from 853d5b2221 by also fixing the placeholder view.
Closes https://github.com/facebook/react-native/pull/3129

Reviewed By: @​svcscm

Differential Revision: D2499753

Pulled By: @vjeux
2015-10-02 10:18:31 -07:00
Mike Armstrong c5b82fe600 Capture java side sampling at the same time as JavaScript
Differential Revision: D2503123
2015-10-02 10:18:24 -07:00
Alexey Lang 737e011f96 log native modules init time and config inject time separately
Reviewed By: @tadeuzagallo, @jspahrsummers

Differential Revision: D2502620
2015-10-02 09:55:21 -07:00
Martin Konicek c15fd8f22c Add link to docs for React addons
Reviewed By: @javache

Differential Revision: D2502770
2015-10-02 08:29:17 -07:00
skv f8bf3463ac [Docs] fix link to animation examples 2015-10-02 17:40:16 +03:00
Felix Oghină 0a13cd0480 Merge pull request #3196 from foghina/cli_backwards_compat
[cli] make init backwards-compatible
2015-10-02 15:05:03 +01:00
Mehdi Mulani 1d8d3d779a Backout ReactNative sync as some tests broke 2015-10-02 06:55:23 -07:00
Felix Oghină 046d8d2dee [cli] make init backwards-compatible 2015-10-02 14:44:20 +01:00
Tadeu Zagallo 7a4348917f Guard against multiple calls from the dev menu
Summary: @​public

The RCTDevMenu always calls the handler, even with the state hasn't changed.
Guard against it.

Reviewed By: @javache

Differential Revision: D2499034
2015-10-02 04:54:23 -07:00
Tadeu Zagallo beab8d52d4 Fix racing conditions on the profiler
Summary: @​public

The flow event methods weren't properly synchronized and neither was the module
unhooking.

Reviewed By: @jspahrsummers

Differential Revision: D2498719
2015-10-02 04:18:21 -07:00
Harry Moreno b1c8e490e0 Add docs for View BorderWidth
Summary: Closes https://github.com/facebook/react-native/pull/3133

Reviewed By: @​svcscm

Differential Revision: D2502503

Pulled By: @mkonicek
2015-10-02 04:13:24 -07:00
Felix Oghină 3dcc234efd do not destroy instance when handling exception
Differential Revision: D2502513
2015-10-02 03:45:24 -07:00
Tadeu Zagallo eee2fd1ca2 Fix RCTConvert analyser error
Summary: @​public

Fix analyser error on RCTConvert where a key used to subscript an
NSMutableDictionary could possibly be nil.

Reviewed By: @alexeylang, @jspahrsummers

Differential Revision: D2498988
2015-10-02 03:35:22 -07:00
Benjamin Winterberg a7047d5764 Add --verbose option (fixes #2797) 2015-10-02 10:51:45 +02:00
Chace Liang 8221c33650 Add Voice Over related change to AccessibilityManager.
Reviewed By: @hedgerwang

Differential Revision: D2491520
2015-10-01 18:19:24 -07:00
leeyeh 626b551ff2 Implement EventTarget interface for WebSocket.
Summary: close #2583Closes https://github.com/facebook/react-native/pull/2599

Reviewed By: @​svcscm

Differential Revision: D2498641

Pulled By: @vjeux
2015-10-01 17:59:29 -07:00
Sebastian Markbage 14d2b0e147 Add benchmark for attribute diffing
Summary: Benchmark for testing the attribute diffing algorithm.

@​public

Reviewed By: @vjeux

Differential Revision: D2498078
2015-10-01 15:05:38 -07:00
Christopher Chedeau de717a8379 Polyfill Number.EPSILON and Number.MIN/MAX_SAFE_INTEGER
Summary: Those three properties have been ratified as ES6 but are not yet implementd in JSCore. This polyfills them.

See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/EPSILON

@​public

Reviewed By: @sahrens

Differential Revision: D2497528
2015-10-01 15:05:33 -07:00
Tadeu Zagallo d96748492f Fix ReactPerf markers in Systrace
Reviewed By: @spicyj

Differential Revision: D2468107
2015-10-01 15:05:28 -07:00
Tadeu Zagallo d447edc5ed Fix profiler setup
Summary: @​public

Update packager entry and profiler pre-built dylib +
Update makefile to make it easier to use different versions of Xcode
and shortcircuit when using the wrong version.

Reviewed By: @jspahrsummers

Differential Revision: D2498157
2015-10-01 15:05:23 -07:00
Martin Konicek 2c0da0f8b5 Merge pull request #3072 from ajwhite/patch-sample-app-gitignore-android
[Android] .gitignore entries for generator template (previously SampleApp)
2015-10-01 21:57:45 +01:00
James Ide e961eaf5c8 Merge pull request #3175 from corbt/es6-modules
enable es6 module syntax
2015-10-01 13:22:52 -07:00
Kyle Corbitt be4c58dcb7 documentation for es6 module syntax 2015-10-01 21:20:41 +01:00
Christopher Chedeau b90d622945 Import event-target-shim npm module
Reviewed By: @foghina

Differential Revision: D2498747
2015-10-01 12:32:24 -07:00
shlomiatar 535ee40818 Fix DependencyResolver to support ES6 multiline imports
Summary: *This is a PR to fix #1939 (DependencyResolver fails to handle ES6 modules import statements with new lines)*

**This PR includes:**
- A fix to the problematic regular expression
- Updated tests that support the new line style.

**Summary:**
We found out that while the packager does its module wrapping thing for lines like this:
```js
import theDefault, { named1, named2 } from 'src/mylib';
```
It fails to do the same for multi line imports:
```js
import theDefault, {
  named1,
  named2
} from 'src/mylib';
```
We've tracked done the issue to a [faulty regular expression in replacePatterns.js](https://github.com/facebook/react-native/blob/master/packager/react-packager/src/DependencyResolver/replacePatterns.js#L12)

You can see various import statements with the problematic regular expression [here](http://regexr.com/3bc8m)

We've figure out a better regular expression (you can play around with it [here](http://regexr.com/3bd3s))Closes https://github.com/facebook/react-native/pull/1940

Reviewed By: @​svcscm

Differential Revision: D2498519

Pulled By: @vjeux
2015-10-01 12:17:21 -07:00
Martin Konicek 8cc6145979 Fix packager docs 2015-10-01 20:10:13 +01:00
Atticus White 56abd6ab41 add android .gradle and build directories to sample app gitignore 2015-10-01 15:09:44 -04:00
Martin Konicek 52d504258b Mention debug.js in packager docs 2015-10-01 19:59:41 +01:00
Martin Konicek ff0f054c78 Another note about verbose output for RN packager 2015-10-01 19:53:05 +01:00
Martin Konicek ee0b19a528 Add a note about verbose output for RN packager 2015-10-01 19:46:09 +01:00
Kyle Corbitt 9c4b476679 enable es6 module syntax
Summary: This is an updated copy of #1993, which was approved by @vjeux but hasn't been rebased. It whitelists the es6 module syntax and updates the JS Environment docs to match. cc @ide @​hkjorgensenCloses https://github.com/facebook/react-native/pull/3175

Reviewed By: @​svcscm

Differential Revision: D2498360

Pulled By: @vjeux
2015-10-01 10:57:23 -07:00
Martin Konicek 31a0c95f69 [cli] Formatting 2015-10-01 15:33:45 +01:00
Martin Konicek a5463c4c10 [cli] Fix 'react-native start' on Windows
Based on https://github.com/facebook/react-native/pull/2989
Thanks @BerndWessels!
2015-10-01 15:28:05 +01:00
Pieter De Baets 91d6cb73ea Fix UIExplorer tabbar test
Reviewed By: @jspahrsummers

Differential Revision: D2498139
2015-10-01 06:02:23 -07:00
Pieter De Baets f3a6466fcd Check if test runner is of right type before accessing its internals
Summary: I previously added this check to make the test complete waits until all teardown completed but if you're running tests with any other executor than the JSC one, this would crash.

@​public

Reviewed By: @jspahrsummers

Differential Revision: D2493967
2015-10-01 04:22:24 -07:00
Felix Oghină 7f9cf97767 Merge pull request #2713 from jmhdez/fix-appName-on-init
[cli] pass arguments from cli instead of using process.argv in init
2015-10-01 12:06:24 +01:00
jmhdez 575e9b7b9a Respect projectName on template creation 2015-10-01 12:39:35 +02:00
Aaron Chiu ebb92ad2cc fix white space in ReactImageManager.java
Differential Revision: D2498072
2015-10-01 02:31:23 -07:00
Aaron Chiu 2cc8acf2e3 enabled border width and border color (sync diff 2)
Differential Revision: D2497575
2015-10-01 00:28:20 -07:00
Aaron Chiu 47224bd93e enabled border width and border color (sync diff)
Differential Revision: D2497518
2015-09-30 21:02:56 -07:00
Amjad Masad 502d277ff2 Error on name collisions
Summary: @​public
This moves us from warnings on name collisions to errors. If the error happens in initialization it will fatal out.

However, if the error happens while working (after initialization) then I did my best to make it recoverable. The rational behind this is that if you're working and you're changing names, you may introduce a duplication while moving things around. It will suck if you have to restart the server every time you do that.

Reviewed By: @frantic

Differential Revision: D2493098
2015-09-30 21:02:50 -07:00
Harry Moreno 90fc8a30dd Format Code in TextInput Comment
Summary: * wrap code snippet in TextInput Comment in backticks ```
* unless there is a way to omit portions of comments from reaching the
docs this is less confusingCloses https://github.com/facebook/react-native/pull/3085

Reviewed By: @​svcscm

Differential Revision: D2495630

Pulled By: @frantic
2015-09-30 21:02:44 -07:00
Henry Zhu e45b7ffb1e update lint packages, fix lint errors
Summary: @​cesarandreu pointed out running eslint on react-native resulted in `t.isReferencedIdentifier is not a function` issues on the babel #linting channel on slack.

- update eslint, babel-eslint, eslint-plugin-react
- fix eslint errors: `Error - t.isReferencedIdentifier is not a function`
- fix lint npm script

I see there's also https://github.com/facebook/react-native/pull/1736 from @ide which would fix it tooCloses https://github.com/facebook/react-native/pull/1874

Reviewed By: @vjeux

Differential Revision: D2495878

Pulled By: @frantic
2015-09-30 21:02:37 -07:00
Danny van der Jagt 200b81172e Fix for IOS 8
Summary: **Problem**
Using push notifications in IOS 8 will throw this error:
`registerForRemoteNotificationTypes: is not supported in iOS 8.0 and later.`
The problem is that the check is running on compile instead of runtime.

**Solution**
If have changed the compile if statement to a runtime if statement. The fix is tested on: IOS 7.1 and 8.* and everything is working now.
This solution is also discussed in: https://github.com/facebook/react-native/issues/1613 and it was part of  https://github.com/facebook/react-native/pull/1979. (is being separated to keep things moving)

Please let me know what you think.Closes https://github.com/facebook/react-native/pull/2332

Reviewed By: @​svcscm

Differential Revision: D2490987

Pulled By: @ericvicenti
2015-09-30 21:02:31 -07:00
Quentin Valmori 4bb58e59f7 Fix one warning
Summary: translucent is a boolean not a stringCloses https://github.com/facebook/react-native/pull/3134

Reviewed By: @​svcscm

Differential Revision: D2495517

Pulled By: @frantic
2015-09-30 21:02:25 -07:00
Magnus Bergman 6068c07e98 Fix dead link in PushNotificationIOS docs.
Summary: Closes https://github.com/facebook/react-native/pull/3117

Reviewed By: @​svcscm

Differential Revision: D2495539

Pulled By: @frantic
2015-09-30 15:40:27 -07:00
olivier notteghem 2bded4cb2e Add log output to rule out that multiple react context creation are responsible for increased mem / image not loading in CTScan
Reviewed By: @​krangarajan

Differential Revision: D2495435
2015-09-30 14:11:24 -07:00
Alexander Kotliarskyi 189ba53ca2 Merge pull request #2940 from andersryanc/docs-image-png-note
Add note about PNG files to Image static resources
2015-09-30 14:03:59 -07:00
Justin Spahr-Summers a4ef7abebb Wait to clear RCTImageView.image until definitively removed from window
Summary: When `RCTImageView` is removed from the view hierarchy, it clears out its `image` to save memory. This makes sense, except that it gets removed from the window (view hierarchy) even when becoming the child of another view.

This fixes the logic so that it only clears out the image if the view hasn't been moved somewhere else within one frame.

@​public

Reviewed By: @javache

Differential Revision: D2493849
2015-09-30 09:40:30 -07:00
Stephan Diederich e65cc9d679 update some asset catalogs
Reviewed By: @nscoding

Differential Revision: D2480708
2015-09-30 09:21:38 -07:00
Felix Oghină 5ca5ec7688 add remote image support to toolbar
Differential Revision: D2493627
2015-09-30 09:21:27 -07:00
Brent Vatne ee3f7e9d21 Merge pull request #3145 from brentvatne/perf-docs
[Docs] First pass at performance guide
2015-09-30 10:42:00 -04:00
Felix Oghină 3e7af6e1a4 [SampleApp] adding unsynced changes from PR #3025 2015-09-30 15:15:30 +01:00
Brent Vatne 554bdf98a7 [Docs] First pass at performance guide 2015-09-30 09:42:56 -04:00
Kevin Gozali 5b2099f87f added QPL for main interactions
Reviewed By: @amirrosenfeld

Differential Revision: D2488420
2015-09-29 22:25:23 -07:00
Amjad Masad 0ad05043f5 Fix more name collisions
Summary: @​public
Add more duplicate files to the blacklist.

Reviewed By: @vjeux

Differential Revision: D2493066
2015-09-29 22:01:21 -07:00
Amjad Masad 9211b9b3cf Introduce getOrderedDependencyPaths that gets all concrete dependecy paths
Summary: @​public
Since we added packager-managed assets -- internally we still think of asset dependency as a single "module". In reality there are multiple files that represent this module. This becomes important with the `getDependencies` API which is used by Buck to inform it on what to rebuild. Since `getDependencies` deals with modules, and is more of an internal API, I've introduced a new one and would go on to deprecate this.

Reviewed By: @frantic

Differential Revision: D2487207
2015-09-29 18:34:21 -07:00
Amjad Masad 42b5cd59e4 Fix debug namespaces
Summary: @​public
Have a top-level debug namespace: `ReactNativePackager`
And add a couple of debugs in the transformer. This is ground work for adding a verbose option.

Reviewed By: @DmitrySoshnikov

Differential Revision: D2489960
2015-09-29 16:10:22 -07:00
Alexander Kotliarskyi b903754116 Merge pull request #3100 from foghina/run_linux
[cli] spawn xterm on linux to run the packager
2015-09-29 15:34:02 -07:00
Amjad Masad 256fa18ab2 remove randomness
Reviewed By: @javache

Differential Revision: D2490001
2015-09-29 12:44:22 -07:00
Pieter De Baets 9076b71ac3 Use bundleForClass instead of mainBundle to find resources
Reviewed By: @jspahrsummers

Differential Revision: D2485109
2015-09-29 10:36:23 -07:00
Andrei Coman 3b6d029a55 Fix background color issue
Differential Revision: D2489578

committer: Service User <svcscm@fb.com>
2015-09-29 09:22:19 -07:00
Pieter De Baets 3a664a0008 Log column number in RCTRedBox messages
Reviewed By: @jspahrsummers

Differential Revision: D2489364
2015-09-29 09:22:14 -07:00
Alexey Lang e727fc817b Pause JS DisplayLink if nothing to process.
Reviewed By: @jspahrsummers

Differential Revision: D2489107
2015-09-29 09:22:10 -07:00
Tadeu Zagallo 4c74f01b85 Move immediates to React batchedUpdates
Reviewed By: @jspahrsummers

Differential Revision: D2484935
2015-09-29 09:22:06 -07:00
Amjad Masad ca007aabb4 Pass in the platform options when loading dependencies
Reviewed By: @jingc

Differential Revision: D2488262
2015-09-29 09:22:00 -07:00
Yinan Na 9ef24d8cc8 RC Fix storyline cannot open bug (iOS 7)
Reviewed By: @jingc

Differential Revision: D2486832
2015-09-29 09:21:55 -07:00
Pieter De Baets e885628245 Don't call originalConsole methods when they don't exist
Reviewed By: @vjeux

Differential Revision: D2485562
2015-09-29 09:21:48 -07:00
Alex Kotliarskyi f07dd70051 Managed assets support for RCTConvert
Reviewed By: @nicklockwood

Differential Revision: D2443130
2015-09-29 09:21:39 -07:00
James Ide e15035f30b Delete SampleApp
Summary: The sample app's code has been converted to Yeoman generator templates. Tell people to run the UIExplorer instead, or the `react-native init` project (which is the same as the SampleApp). This will slightly reduce the size of the npm package and cleans up unused files.
Closes https://github.com/facebook/react-native/pull/3025

Reviewed By: @​svcscm

Differential Revision: D2484901

Pulled By: @foghina
2015-09-29 09:21:33 -07:00
Christopher Chedeau a02785cdc4 Revert _file deletions to fix the sync 2015-09-29 09:16:34 -07:00
Felix Oghina f6ec854e23 [cli] spawn xterm on linux to run the packager
Also use ANDROID_HOME env var when running adb.
2015-09-28 20:14:07 +01:00
Justin Spahr-Summers 0ff3a421c9 Actually define RCTSetLogThreshold()
Summary: This function was declared, but never defined, so calling it would crash your application.

I also took this opportunity to ensure that the logging threshold is given a default value upon initialization, not just the first time `RCTGetLogThreshold()` is called.

@​public

Reviewed By: @tadeuzagallo

Differential Revision: D2475622
2015-09-28 04:23:26 -07:00
James Ide 92109b8a0c Explanation of Modal's purpose in hybrid apps
Summary: Explained that Modal is for hybrid apps and suggest using a top-level Navigator in pure RN apps.
Closes https://github.com/facebook/react-native/pull/2663

Reviewed By: @​svcscm

Differential Revision: D2483626

Pulled By: @sahrens
2015-09-27 23:48:22 -07:00
yiminghe 4978855d72 support es6.constants by default. Fixes #2932
Summary: In javascriptcore(ios9), this code will run as expected(output 0 1):

```js
for(let i=0; i<2; i++) {
  const data = i;
  console.log(data);
}
```

But when debug in chrome, the above code will fail without `use strict` prologue (if you add prologue, rn will fail with red screen `Const declarations are not supported in strict mode`): https://code.google.com/p/v8/issues/detail?id=4432.

So it's better to transpile contant by default.

Closes https://github.com/facebook/react-native/pull/2955

Reviewed By: @​svcscm

Differential Revision: D2483398

Pulled By: @vjeux
2015-09-26 15:50:24 -07:00
Satyajit Sahoo c22e143a1d Fix typos 2015-09-27 00:03:41 +05:30
Satyajit Sahoo fba9fbbced Added docs about generating a signed APK 2015-09-27 00:01:10 +05:30
Amjad Masad fa0da5682b Fix haste resolution (and better warnings)
Summary: @​public

Fix the haste resolution algorithm. Changed the map data structure from a list of modules, to a list of modules grouped by platform.
This considerably simplifies the "getModule" method and makes it easy to properly warn about colliding module names.
This also fixes a bug where we used to include `.web` files when we shouldn't (see task).

Reviewed By: @vjeux

Differential Revision: D2482969
2015-09-25 20:35:45 -07:00
Christopher Chedeau 76846f7e33 Remove all the duplicate module warnings
Summary: @​public

@amasad added a warning when there are two @​providesModule with the same name. This removes all those warnings by blacklisting the internal version of those files. Once we get of the big react-tools/ hack, we'll be able to remove all those :)

Reviewed By: @amasad

Differential Revision: D2482521
2015-09-25 19:24:24 -07:00
Christopher Chedeau bd36e40258 Fix width being ignored when has a value of 0
Summary: https://github.com/facebook/css-layout/commit/8f6a96adbcb2b0389f948b8113d8b7cb8991bb2d added a test in isDimDefined that checks if `value > 0.0`, but unfortunately, it did not faithfully port the JavaScript version which is `value >= 0.0`: https://github.com/facebook/css-layout/blob/master/src/Layout.js#L306. Sadly, no test covered this so it went unnoticed.
Closes https://github.com/facebook/css-layout/pull/134

Reviewed By: @​svcscm

Differential Revision: D2481773

Pulled By: @vjeux
2015-09-25 15:42:21 -07:00
Krzysztof Magiera 656126a2f1 Convert remaining viewmanager to @ReactProp.
Differential Revision: D2481816

committer: Service User <svcscm@fb.com>
2015-09-25 15:02:25 -07:00
Jiajie Zhu 0fb3d8de83 revert D2372548 to fix initial app state issue
Reviewed By: @hedgerwang

Differential Revision: D2480492
2015-09-25 13:25:26 -07:00
James Ide 65253e3915 Merge pull request #3043 from exponentjs/nvm-docs
[Docs] Remove recommendation to install nvm from brew
2015-09-25 13:19:50 -07:00
James Ide cfc8331a7f [Docs] Remove recommendation to install nvm from brew
The nvm maintainers have their own recommended installation instructions (via shell script or git checkout), which are linked to from the docs.
2015-09-25 13:18:31 -07:00
Olivier Notteghem 3f213e37d3 Fix scrollTo() method to pass integer as opposed to float
Reviewed By: @​nspaun

Differential Revision: D2480775
2015-09-25 13:01:25 -07:00
Olivier Notteghem dcae4bada0 Sync diff : Enable initializing react context off UI thread
Reviewed By: @astreet

Differential Revision: D2480130
2015-09-25 12:54:27 -07:00
Pieter De Baets 8f13560fd5 End slider interaction when touches are cancelled
Reviewed By: @jingc

Differential Revision: D2479259
2015-09-25 11:42:32 -07:00
Christopher Chedeau ec8b5425e5 Fix row height
Reviewed By: @frantic

Differential Revision: D2480265
2015-09-25 11:25:57 -07:00
Justin Spahr-Summers 1487ebfe01 Revert packager randomization revert 2015-09-25 10:24:06 -07:00
Mike Armstrong 23564fe65a reduce leeway to 1, child clipping updated every scroll movement. This fixes scroll view behaviour
Reviewed By: @jspahrsummers

Differential Revision: D2479961
2015-09-25 10:24:02 -07:00
Ryan Anderson 6dfadba318 fix images docs verbiage 2015-09-25 09:34:07 -07:00
Justin Spahr-Summers e2fdd59784 Revert packager module randomization 2015-09-25 07:41:25 -07:00
Krzysztof Magiera bf598647d2 Convert View to @ReactProp.
Differential Revision: D2479795

committer: Service User <svcscm@fb.com>
2015-09-25 03:14:28 -07:00
Cirkos 1ad1f45fe6 Reverted D2476924
Reviewed By: @mmmulani

Differential Revision: D2479710
2015-09-25 03:08:24 -07:00
Justin Spahr-Summers 3bbfab545a Log when RCTImageView reloads and when assets are scaled
Summary: This sort of logging helped me identify issues with reloading images too frequently (and for trivial reasons), so leaving it in might be useful for future optimization work, or for anyone building apps using these components.

@​public

Reviewed By: @alexeylang

Differential Revision: D2475613
2015-09-25 02:29:25 -07:00
Amjad Masad 9293e54085 Warn and randomize colliding name selection
Summary: @​public

The issue of colliding haste modules have came up many times and have wasted countless engineering hours. This will start warning about it and will also start selecting modules at random so that people don't depend on undefined behavior.

Additionally, this surfaced an issue where with assets we may fatally throw if the directory doesn't exist. This is fixed by checking the existence of the directory before trying to match files in it.

Reviewed By: @jingc

Differential Revision: D2478480
2015-09-25 00:19:27 -07:00
Ryan Anderson a8b34a1516 remove isStatic and change image to my-icon 2015-09-24 23:37:33 -07:00
Martin Bigio bf88e46ebb Print to console instead of debug uncaught exceptions
Reviewed By: @jingc

Differential Revision: D2478099
2015-09-24 15:57:26 -07:00
Martin Konicek fcd7de5301 Autoplay GIFs on Android
Summary: This adds support for animated GIFs on Android! Looking forward to some meme apps :)
Also, Fresco is awesome.

Closes #2997.

@​public

Reviewed By: @mkonicek

Differential Revision: D2477540

committer: Service User <svcscm@fb.com>
2015-09-24 14:37:24 -07:00
Christopher Chedeau 03222d66bb Revert of [Fix dimension check for STRETCH children]
Summary: We had a layout issue in Ads Manager after updating to the latest version of css-layout on react-native. I bisected the change to https://github.com/facebook/css-layout/commit/909c14117f118c9b36e6623590e62bff2f996c1b. It changes the condition and breaks the behavior that we had. This change was not covered by a unit test so I added one.

Closes https://github.com/facebook/css-layout/pull/131

Reviewed By: @​svcscm

Differential Revision: D2476924

Pulled By: @vjeux
2015-09-24 14:11:47 -07:00
Donald Wong 428f76d8a2 Reverting D2475270 2015-09-24 14:11:42 -07:00
Martin Konicek a3e6afe137 Merge pull request #3006 from foghina/merge_yo_tests
[cli] merge yeoman tests into one file to avoid concurrenct issues with jest
2015-09-24 21:43:17 +01:00
Christoph Pojer 252c12c353 Update to 0.5.8
Reviewed By: @vjeux

Differential Revision: D2475270
2015-09-24 10:58:32 -07:00
Martin Konicek dfbee9f558 add dropped frame count to FPS overlay
Differential Revision: D2476082

committer: Service User <svcscm@fb.com>
2015-09-24 10:22:40 -07:00
Martin Konicek bdb11c05a8 Update README.md 2015-09-24 17:18:29 +01:00
Felix Oghină 5cd64a658d [cli] merge yeoman tests into one file to avoid concurrenct issues with jest 2015-09-24 17:02:43 +01:00
Andrei Coman a37d0f9c20 Dirty hack to consume enter key
Differential Revision: D2475863

committer: Service User <svcscm@fb.com>
2015-09-24 08:20:26 -07:00
Andrei Coman c1e3f9100e Fix SQL errors caused by huge operations
Differential Revision: D2475717

committer: Service User <svcscm@fb.com>
2015-09-24 08:20:23 -07:00
Martin Bigio eee11eaeed Log server state when client is unexpetedly closed
Reviewed By: @javache

Differential Revision: D2473036
2015-09-24 08:20:20 -07:00
Krzysztof Magiera 5623c831b3 Introducing view property annotation.
Differential Revision: D2475680

committer: Service User <svcscm@fb.com>
2015-09-24 08:20:17 -07:00
Krzysztof Magiera 6c3fb77f30 Static type check for int params + migrate colorInt to just int.
Differential Revision: D2475618

committer: Service User <svcscm@fb.com>
2015-09-24 08:20:14 -07:00
James Ide 944fa4d635 Suppress warning when checking for JSGlobalContextSetName
Summary: This API is defined only on iOS 8 and newer. There is a warning that the function is defined when checking if it exists since it is always defined in the iOS 8 SDK but not necessarily on iOS 7 phones. Use pragmas to silence the warning.
Closes https://github.com/facebook/react-native/pull/2475

Reviewed By: @​trunkagent, @vjeux

Differential Revision: D2443432

Pulled By: @tadeuzagallo
2015-09-24 08:20:11 -07:00
Andrei Coman 33cc607c1f AsyncStorage improvements
Differential Revision: D2475604

committer: Service User <svcscm@fb.com>
2015-09-24 08:20:08 -07:00
James Ide 7615d74d14 Check self.isValid in RCTBatchedBridge after initial script evaluation
Summary: I noticed that sometimes the batched bridge would be valid before `[self enqueueApplicationScript:url:onComplete:]` but then become invalid in the completion callback. This diff checks `self.isValid` inside of the callback.

Closes https://github.com/facebook/react-native/pull/2016

Reviewed By: @​trunkagent, @jspahrsummers

Differential Revision: D2443438

Pulled By: @tadeuzagallo
2015-09-24 08:20:05 -07:00
Jan Kassens 974ec059e8 Fix for displayName transform
Summary: The `react.displayName` transform was added in 93b9329b75.

That diff missed to update the `.babelrc` where the comment says it should stay
in sync (I'm not sure where it's used though). I added a comment in the other
direction so this can be prevented in the future.

I also updated the `cacheVersion` so we actually transform the code again to add
the missing displayName properties to unchanged components.
Closes https://github.com/facebook/react-native/pull/2905

Reviewed By: @vjeux

Differential Revision: D2473447

Pulled By: @kassens
2015-09-24 08:20:02 -07:00
Jason Brown 74f467b00a Add skewX and skewY to the transform style options
Summary: Closes https://github.com/facebook/react-native/pull/2652

Reviewed By: @​trunkagent, @​svcscm

Differential Revision: D2437758

Pulled By: @vjeux
2015-09-24 08:19:59 -07:00
oveddan 8db35d492b Have the chrome debugger run javascript within a web worker, to remove the global document.
Summary: To make the chrome debugger environment consisten with the JSC executer environment,
where there is no `window.document`, make the chrome debugger run the javascript inside a web worker.

This fixes #1473
Closes https://github.com/facebook/react-native/pull/1632

Reviewed By: @martinbigio

Differential Revision: D2471710

Pulled By: @vjeux
2015-09-24 08:19:55 -07:00
Hedger Wang 200d9af315 Add method stopPropagation and stop to NavigationEvent
Summary: @​public

Add method `stopPropagation` and `stop` to NavigationEvent so we can stop event easily once event bubbling and capturing is supported.

Reviewed By: @fkgozali

Differential Revision: D2471903
2015-09-24 08:19:52 -07:00
Martin Konicek a0ccebc460 Update GettingStarted.md 2015-09-24 15:18:42 +01:00
Aaron Chiu a7dd4f09b5 Merge pull request #2902 from morenoh149/fixGrammarNativeModulesAndroid
Fix Grammar
2015-09-24 14:15:43 +01:00
Aaron Chiu e55b5a0e37 Merge pull request #2901 from morenoh149/fixTypoKnownIssues
Fix typo
2015-09-24 14:14:19 +01:00
Felix Oghină 9f1ff48458 Merge pull request #3000 from foghina/fix_yeoman_tests
[cli] use different names in generator tests

This should fix #2974
2015-09-24 13:57:12 +01:00
Felix Oghină 2dcb06949a [cli] use different names in generator tests 2015-09-24 13:54:01 +01:00
Martín Bigio 51917f6cd9 Add portfinder dev dependency
Reviewed By: @vjeux

Differential Revision: D2468120
2015-09-23 19:29:40 -07:00
Jordan Byron 4c366d0bcb Remove duplicate PanResponderExample and update docs
Summary: While looking at the [pan responder docs](https://facebook.github.io/react-native/docs/panresponder.html#working-example) I noticed they linked to `ResponderExample` rather than `PanResponderExample` and that `ResponderExample ` defined `NavigatorIOSExample` which was odd. This PR just kills `ResponderExample` and updates the link in the docs. :bowtie:
Closes https://github.com/facebook/react-native/pull/1743

Reviewed By: @​svcscm

Differential Revision: D2468010

Pulled By: @vjeux
2015-09-23 19:29:35 -07:00
Alex Kotliarskyi 390649ab4e Support tintColor for managed image assets
Reviewed By: @nicklockwood

Differential Revision: D2443089
2015-09-23 19:29:30 -07:00
Charlie Cheever dc7681e946 Also call the original console methods if they exist
Summary: Ex. When `console.log` or similar is called, this will call
the original method, which can be quite useful.

For example, under iOS, this will log to the Safari console debugger,
which has an expandable UI for inspecting objects, etc., and is also
just useful if you are using that as a REPL.

I don't believe this incurs a meaningful performance penalty unless
the console is open, but it would be easy to stick behind a flag
if that is a problem.
Closes https://github.com/facebook/react-native/pull/2486

Reviewed By: @​svcscm

Differential Revision: D2472470

Pulled By: @vjeux
2015-09-23 19:29:24 -07:00
Alex Kotliarskyi 34d57afc32 Handle errors that are not Error instances
Reviewed By: @sahrens

Differential Revision: D1799587
2015-09-23 19:29:19 -07:00
Elia Grady 88b101bb3e Fixed typo
Summary: _setRenderSceneToHarwareTextureAndroid was changed to _setRenderSceneToHardwareTextureAndroid.
Closes https://github.com/facebook/react-native/pull/2869

Reviewed By: @​svcscm

Differential Revision: D2472438

Pulled By: @vjeux
2015-09-23 19:29:14 -07:00
Andrei Coman d1e316fce3 Remove text input warnings
Reviewed By: @mkonicek

Differential Revision: D2471396
2015-09-23 19:29:04 -07:00
Hedger Wang b2049e3ccb Hierarchical event bubbling - 1
Reviewed By: @fkgozali

Differential Revision: D2469495
2015-09-23 19:28:56 -07:00
Thomas Aylott 30e9bf6077 TextMate support for launchEditor
Reviewed By: @frantic

Differential Revision: D2467263
2015-09-23 19:28:44 -07:00
James Ide 0386858586 Merge pull request #2987 from kassens/gh-only
Update cacheVersion in bundle.js
2015-09-23 15:27:21 -07:00
Jan Kassens c6a9d0e69f Update cacheVersion in bundle.js
As requested by @vjeux, this moves the change to this file to a separate PR.

For more info see #2905.
2015-09-23 15:24:54 -07:00
Christopher Chedeau c52a13186f Merge pull request #2981 from exponentjs/separate-cli-tests
[Tests] Move the packager and cli tests to separate matrix entries
2015-09-23 15:12:48 -07:00
James Ide 03c874cb7f [Tests] Move the packager and cli tests to separate matrix entries
The packager and cli tests now run independently of the RN JS tests. When the packager moves to its own repo we can just remove the packager entry from .travis.yml.

The cli tests are also marked as allowed to fail for now.
2015-09-23 14:14:29 -07:00
Christopher Chedeau 2494261e07 Merge pull request #2982 from AaaChiuuu/sample
[ReactNative] remove unused files in SampleApp
2015-09-23 14:14:02 -07:00
Aaron Chiu c604b6e866 [ReactNative] remove unless files in SampleApp 2015-09-23 22:01:14 +01:00
Christopher Chedeau 0c8e910ed8 Merge pull request #2976 from AaaChiuuu/flow
merge the root .flowconfig and local-cli/generator/templates/_flowconfig
2015-09-23 14:01:06 -07:00
Aaron Chiu 2566ed8089 merge the root .flowconfig and local-cli/generator/templates/_flowconfig
Test Plan: flow check && scripts/e2e-tests.sh
2015-09-23 21:47:43 +01:00
Aaron Chiu 9f62d54cce merge .flowconfig files part 1
Differential Revision: D2472462

committer: Service User <svcscm@fb.com>
2015-09-23 13:02:27 -07:00
Martin Bigio 407247fe1e Don't swallow client errors
Reviewed By: @​swarr

Differential Revision: D2472285
2015-09-23 12:43:23 -07:00
Frédéric Sagnes d26d4708b0 Implement cancellation for RCTAssetsLibraryImageLoader
Reviewed By: @tadeuzagallo

Differential Revision: D2471253
2015-09-23 12:09:31 -07:00
Tadeu Zagallo 98378cab18 Add gluecode for systrace
Summary: @​public

Add gluecode to allow use to systrace as the backend of RCTProfile

Reviewed By: @jspahrsummers

Differential Revision: D2439181
2015-09-23 12:09:25 -07:00
rxb dcf245a9a2 Definable distance pagination for ScrollView
Summary: This is an enhancement for ScrollView that adds the ability to paginate based on a width other than the width of the ScrollView itself. This is a fairly common pattern used on apps like Facebook, App Store, and Twitter to scroll through a horizontal set of cards or icons:

![img_8726 2](https://cloud.githubusercontent.com/assets/451050/8017899/39f9f47c-0bd2-11e5-9c1d-889452f20cf7.PNG) ![img_8727 2](https://cloud.githubusercontent.com/assets/451050/8017898/39f962dc-0bd2-11e5-98b4-461ac0f7f21b.PNG)  ![img_8728 2](https://cloud.githubusercontent.com/assets/451050/8017900/39fd91a4-0bd2-11e5-8786-4cf0316295a0.PNG)

After trying to accomplish this only with JS, it appears that attempting to take over an in-progress native scroll animation with JS is always going to result in some amount of jankiness and jumping.

This pull request uses `scrollViewWillEndDragging` in RCTScrollView.m to adjust `targetContentOffset` based on two new optional props added to ScrollView. `snapToInterval` sets the multiple that the
Closes https://github.com/facebook/react-native/pull/1532

Reviewed By: @​svcscm, @​trunkagent

Differential Revision: D2443701

Pulled By: @vjeux
2015-09-23 11:47:25 -07:00
alvaromb b9ef384f74 Updated TouchableHighlight docs
Summary: ``onlyChild`` restriction is implemented in ``TouchableHighlight``, not ``TouchableOpacity``.
Closes https://github.com/facebook/react-native/pull/2542

Reviewed By: @​svcscm

Differential Revision: D2471539

Pulled By: @vjeux
2015-09-23 11:25:34 -07:00
Brent Vatne 118cf51522 Fix PanResponder example code
Summary: Fixes this:

![](http://url.brentvatne.ca/VwLF.png)
Closes https://github.com/facebook/react-native/pull/1464

Reviewed By: @​svcscm

Differential Revision: D2471541

Pulled By: @vjeux
2015-09-23 11:25:27 -07:00
Tadeu Zagallo 1ab650f958 Remove use of const from packager and add systrace internally
Reviewed By: @martinbigio

Differential Revision: D2471270
2015-09-23 10:56:31 -07:00
Amir Rosenfeld da284f6e36 stub Java QPL for OSS
Reviewed By: @mkonicek

Differential Revision: D2470258
2015-09-23 10:30:28 -07:00
Christopher Chedeau 393b6791a8 Delete ResponderExample.js
See https://github.com/facebook/react-native/pull/1743
2015-09-23 10:18:05 -07:00
Justin Spahr-Summers bcd2ef5dfc Improve RCTImageView resizing logic
Summary: @​public

It's less important to reload for downscaling than upscaling, so increase the threshold in that direction. Also, this now considers each dimension separately, and a big enough change either way should result in a reload.

Finally, this considers both the current image size and the inflight target size, so we don't reload if either is already good.

Reviewed By: @tadeuzagallo

Differential Revision: D2470911
2015-09-23 07:32:30 -07:00
Justin Spahr-Summers de85bcab0b Cancel previous calls to -[RCTImageView reloadImage] to prevent extra work
Reviewed By: @tadeuzagallo

Differential Revision: D2470902
2015-09-23 07:32:23 -07:00
Christopher Chedeau 75d0b904b9 Merge pull request #2609 from exponentjs/faster-ci-tests
[Travis] Use Xcode 7 image, remove brew update, install nvm directly
2015-09-23 07:25:20 -07:00
James Ide 3b68869fc8 Add scrollWithoutAnimationTo to Android
Summary: `ScrollView.scrollWithoutAnimationTo` is supported on iOS but not Android. This is an existing API, and this diff adds Android support.

Closes https://github.com/facebook/react-native/pull/2695

Reviewed By: @​svcscm

Differential Revision: D2452630

Pulled By: @mkonicek
2015-09-23 05:58:27 -07:00
Bret Johnson 5b0dd6432a Added a more explicit error message when ndk.dir / ANDROID_NDK is set,
Summary: but the NDK build command can't be found in that directory.   This
more explicit error now shows the full NDK path where it's looking
and (importantly) includes a hint that backslashes need to be escaped
on Windows for ndk.dir.   When I built on Windows the first time,
I didn't realize ndk.dir backslashes needed to be escaped and the
generic "not found" error made the root cause harder to track
down.   This change should help others that build on Windows & run into
the same.
Closes https://github.com/facebook/react-native/pull/2960

Reviewed By: @​svcscm

Differential Revision: D2470761

Pulled By: @kmagiera
2015-09-23 05:57:24 -07:00
James Ide 8a77aa60c3 [Travis] Use Xcode 7 image, remove brew update, install nvm directly
- Uses the Xcode 7 image
- The new image includes xctool 0.2.5 (current)
- Removes the `brew update` command, which needed to fetch a lot of data
- Disables the npm spinner before installing flow-bin
- Uses `$TMPDIR` instead of spinning up Node
2015-09-22 22:41:12 -07:00
Martín Bigio a85884275d Temp dependency should be a dev one
Reviewed By: @vjeux

Differential Revision: D2468639
2015-09-22 18:24:26 -07:00
Amir Rosenfeld 8a638d8e58 move qpl to oss
Reviewed By: @mkonicek

Differential Revision: D2465929
2015-09-22 17:33:28 -07:00
Alex Coco 12a0045412 Fix typo in cloneWithRows comments
Summary: `s/informatoin/information/`
Closes https://github.com/facebook/react-native/pull/2532

Reviewed By: @​svcscm

Differential Revision: D2469067

Pulled By: @vjeux
2015-09-22 17:02:27 -07:00
James Ide b7efd0212f Merge pull request #2937 from unknownexception/patch-2
[Showcase] Add Hashley app
2015-09-22 15:52:12 -07:00
Amjad Masad 45ed000d4b Remove server error listener so that it throws
Summary: @​public
We swallow errors like it's nobody's business :(
Having an error handler that `reject`s after the promise has been resolved is a no-op. In node, if there is no `error` event handler then the error would throw.

So after we start listening and we want to resolve the promise, we remove the error listener so that we make sure errors actually throw.

Finally, I made the `uncaughtError` handler log `error.stack` so we can get an idea of what's going on.

Reviewed By: @martinbigio

Differential Revision: D2468472
2015-09-22 15:48:29 -07:00
Amjad Masad 30cca276fa Return concrete file paths to the client
Reviewed By: @martinbigio

Differential Revision: D2465182
2015-09-22 15:45:25 -07:00
Martín Bigio c4cb95f2d7 Add logging information when client's socket gets closed unexpetedly
Reviewed By: @amasad

Differential Revision: D2468293
2015-09-22 15:21:35 -07:00
Jan Kassens 9486642322 Prop routeMapper of Navigator.NavigationBar is required
Summary: The component will crash if the prop is not provided. This helps with a better
error message in the console output.
Closes https://github.com/facebook/react-native/pull/2894

Reviewed By: @​svcscm

Differential Revision: D2461752

Pulled By: @ericvicenti
2015-09-22 14:44:28 -07:00
Colin Parsons 972ae4c186 fix minor grammar and typo errors in comments
Summary: comments only. no code modified.
Closes https://github.com/facebook/react-native/pull/2038

Reviewed By: @​svcscm

Differential Revision: D2468021

Pulled By: @vjeux
2015-09-22 14:41:28 -07:00
Amjad Masad f39e3fe113 Simplify over-engineered Activity module
Summary: @​public
I've noticed that the logs can be sometimes misleading, as when an Activity ends it doesn't log immediatly. A sync `console.log` would log before it although the Acitivity should've finished before.

Turns out we wait before writing out the logs to the console. I don't see any reason for this. Looking at the `Activity` module it's over-engineered. This diff makes logging sync and simplfies the module.

Reviewed By: @martinbigio

Differential Revision: D2467922
2015-09-22 14:25:37 -07:00
Tamara Woodson 4447bff976 Fix minor grammatical error in documentation
Summary: No code changes; comments/documentation only.
Closes https://github.com/facebook/react-native/pull/2083

Reviewed By: @​svcscm

Differential Revision: D2468024

Pulled By: @vjeux
2015-09-22 14:25:25 -07:00
Christopher Chedeau f7ff980876 Merge pull request #1416 from dalinaum/fix-warning
[Cosmetic] Fix some lint warnings
2015-09-22 14:06:41 -07:00
Christopher Chedeau 48e042378d Merge pull request #2946 from vjeux/fix_animated_docs
Fix website with Animated
2015-09-22 14:00:52 -07:00
Joel Arvidsson 7f76f08a11 Better feature detection for FormData/FileReader/Blob
Summary: This PR bumps fetch to 0.9.0, the latest release and fixes broken feature detection originating in that self is not referring to `window.self` but an empty object. Assigning that object to window.self or GLOBAL won't work in the chrome dev tools because of CORS restrictions. This is a pragmatic solution but maybe not ideal.

Background to the problem can be read here: https://github.com/facebook/react-native/issues/2376
Closes https://github.com/facebook/react-native/pull/2587

Reviewed By: @​trunkagent, @​svcscm

Differential Revision: D2438341

Pulled By: @vjeux
2015-09-22 13:53:24 -07:00
Christopher Chedeau 69a4024c85 Fix lint warnings when adding a new js file
Summary: @​public
When we updated eslint, some of the rules have been renamed and are spamming everytime someone adds a new js file. It turns out that the rules that those have been deprecated to were already present in the current eslint config and enabled, so I just needed to remove them.

Reviewed By: @jingc

Differential Revision: D2467315
2015-09-22 13:05:43 -07:00
Christopher Chedeau 00ceec9def Fix website with Animated
Animated.js has been renamed (and moved) to AnimatedImplementation.js, so we need to update the path and add another translation rule.
2015-09-22 12:54:04 -07:00
Amjad Masad 7806c0875b Log exit code
Reviewed By: @martinbigio

Differential Revision: D2467457
2015-09-22 12:40:25 -07:00
Christoph Pojer cee01bef4f Don't transform node_modules in open source
Summary: We aren't ignoring node_modules so we apply our transform on *all of them*.

See https://github.com/facebook/react-native/pull/2942 and https://github.com/facebook/react-native/issues/2939

@​public

Reviewed By: @vjeux

Differential Revision: D2467324
2015-09-22 12:13:38 -07:00
Christopher Chedeau a50b4ea7b9 Initial web implementation
Summary: @​public

This diff does a couple of things:
- Move all the code in a src/ folder
- Move bezier.js in the Animated folder
- Rename Animated.js into AnimatedImplementation.js and adds two entry points: AnimatedReactNative.js and AnimatedWeb.js
- Implement very dumb polyfills for flattenStyle, Set and InteractionManager
- Import my work in progress demo.html file to make sure that the code is actually working.

Everything is not working correctly:
- It calls forceUpdate on every frame and doesn't use bindings because setNativeProps is not implemented
- None of the style: {transform} are working because React web doesn't know about the array notation for transform
- The demo need more work

Reviewed By: @sahrens

Differential Revision: D2464277
2015-09-22 11:58:37 -07:00
Martin Konicek c45be4d55a Test export to github
Reviewed By: @mkonicek

Differential Revision: D2467343

committer: Service User <svcscm@fb.com>
2015-09-22 11:34:27 -07:00
Yusef Napora 2f9bd1f62f App Extension support
Summary: This adds workarounds for the code that was preventing React from compiling when linked against an iOS App Extension target.

Some iOS APIs are unavailable to App Extensions, and Xcode's static analysis will catch attempts to use methods that have been flagged as unavailable.

React currently uses two APIs that are off limits to extensions: `[UIApplication sharedApplication]` and `[UIAlertView initWith ...]`.

This commit adds a helper function to `RCTUtils.[hm]` called `RCTRunningInAppExtension()`, which returns `YES` if, at runtime, it can be determined that we're running in an app extension (by checking whether the path to `[NSBundle mainBundle]` has the `"appex"` path extension).

It also adds a `RCTSharedApplication()` function, which will return `nil` if running in an App Extension. If running in an App, `RCTSharedApplication()` calls `sharedApplication` by calling `performSelector:` on the `UIApplication` class.  This passes the static analysis check, and, in my opinion, obeys the "spirit of th
Closes https://github.com/facebook/react-native/pull/1895

Reviewed By: @​svcscm

Differential Revision: D2224128

Pulled By: @nicklockwood
2015-09-22 10:46:26 -07:00
Martin Konicek 3f220f6b59 [ReactNative] Export latest Android changes 2015-09-22 18:36:21 +01:00
Ryan Anderson dee4ea8ea3 Add note about PNG files to Image static resources 2015-09-22 10:00:19 -07:00
Martín Bigio 833ca598bc Introduce react native CLI
Reviewed By: @frantic

Differential Revision: D2430522
2015-09-22 09:02:32 -07:00
Dmitry e56ec9da35 Add Hashley app to Showcase 2015-09-22 19:00:51 +05:00
Martin Konicek 71628638f6 Export latest Android changes 2015-09-22 11:15:50 +01:00
Martin Bigio daba14264c Remove node_modules dir early fail check
Reviewed By: @vjeux

Differential Revision: D2464127
2015-09-21 17:51:35 -07:00
Martín Bigio 37b5cd45e1 Add temp node dependency
Reviewed By: @vjeux

Differential Revision: D2445915
2015-09-21 17:49:37 -07:00
Christoph Pojer 24b0064eae Upgrade jest to 0.5.6
Reviewed By: @vjeux

Differential Revision: D2459297
2015-09-21 14:39:55 -07:00
Christoph Pojer d088750163 Fix tests + enable inline requires on react-native
Reviewed By: @sahrens, @vjeux

Differential Revision: D2456607
2015-09-21 14:39:44 -07:00
Martin Konicek 6b733bdcf1 Minor fixes in comments
Reviewed By: @mkonicek

Differential Revision: D2463595

committer: Service User <svcscm@fb.com>
2015-09-21 14:39:36 -07:00
Martin Bigio 8f5b2ccbe0 Log uncaught exceptions on the socket server
Reviewed By: @frantic

Differential Revision: D2462114
2015-09-21 12:08:29 -07:00
Jason Als f762a55abd Wrong function name
Summary: RippleAndroid is actually Ripple
Closes https://github.com/facebook/react-native/pull/2710

Reviewed By: @​svcscm

Differential Revision: D2452607

Pulled By: @mkonicek
2015-09-21 09:00:34 -07:00
Martin Konicek 86ff767268 [ReactNative] Fix typo in ReactInstanceManager.java 2015-09-21 16:01:52 +01:00
Aaron Chiu e665acca4b pull in github css-layout into fbobjc react native
Reviewed By: @vjeux

Differential Revision: D2448929
2015-09-20 20:35:29 -07:00
Pieter De Baets d94ed42e1c Enable Jest tests
Reviewed By: @amasad

Differential Revision: D2422290
2015-09-20 16:48:35 -07:00
Harry Moreno 7f067921a6 Fix Grammar
changed
`To make it simpler for to access your new functionality ...`

to
`To make it simpler to access your new functionality ...`
2015-09-20 19:30:51 -04:00
Harry Moreno 1edc3eb001 Fix typo
changed
`... for React Native and gis therefore enabled by default.`

to

`... for React Native and is therefore enabled by default.`
2015-09-20 19:28:36 -04:00
James Ide ddd6fe3fae Merge pull request #2898 from taydakov/patch-1
Fix misspelling
2015-09-20 15:04:04 -07:00
Lev Taydakov ecc79dc6f5 Fix misspelling 2015-09-20 13:48:27 -07:00
James Ide 95b6f88686 Merge pull request #2874 from dgellow/fix-doc-runningondeviceios
fix AppDelegate.m path
2015-09-19 17:14:10 -07:00
Christoph Pojer fa01b2e4cb Codemod tests to use top-level-requires
Reviewed By: @DmitrySoshnikov

Differential Revision: D2456250
2015-09-19 15:41:29 -07:00
Christoph Pojer 3fca7f4d7b inline requires + preprocessor updates
Reviewed By: @DmitrySoshnikov

Differential Revision: D2455903
2015-09-19 15:22:33 -07:00
dgellow 55c5dade57 fix AppDelegate.m path 2015-09-19 22:56:21 +02:00
Christopher Chedeau f802998599 Merge pull request #2857 from javache/fix-flow-config-again
Bump flow version
2015-09-18 19:35:05 -07:00
Pieter De Baets 64eb8741ee Bump flow version 2015-09-18 19:28:38 -07:00
Pieter De Baets c011274d01 Fix fbobjc ignoring timed-out
Reviewed By: @cpojer

Differential Revision: D2459512
2015-09-18 18:41:26 -07:00
Pieter De Baets 19067a8fbc Prevent setFrame:forView: being called for invalidated views
Reviewed By: @vjeux

Differential Revision: D2459295
2015-09-18 17:33:25 -07:00
DengYun 450cd5c406 Generate module name seperated by '/' on Windows.
Summary: I think packager on different platform should generate same output if possible. So packager should replace '\\' in module name with '/' on Windows.

Closes https://github.com/facebook/react-native/pull/2813

Reviewed By: @​svcscm

Differential Revision: D2458634

Pulled By: @martinbigio
2015-09-18 15:15:28 -07:00
Marc Horowitz a87ba4ab4c Prepare the bridge for C++
Reviewed By: @nicklockwood

Differential Revision: D2432291
2015-09-18 15:04:28 -07:00
Jeff Morrison 18a7e363b5 Deploy to fbobjc
Reviewed By: @gabelevi

Differential Revision: D2457704
2015-09-18 14:25:27 -07:00
Martin Konicek f1355f36f3 Update DevelopmentSetupAndroid.md 2015-09-18 20:53:06 +01:00
Christopher Chedeau 6bf58aa8aa Fix sync
Differential Revision: D2457857
2015-09-18 12:12:53 -07:00
Martin Konicek f6b97eaa91 Merge pull request #2809 from hzerica/master-pr-6
[CLI]let 'react-native bundle' support 'platform' option.
2015-09-18 20:04:40 +01:00
Felix Oghină 4eecef12c5 Merge pull request #2849 from httpNick/master
Updated comment in javascript to say the method name is 'show' instead of 'showText'
2015-09-18 19:04:47 +01:00
James Ide c552a721d4 Merge pull request #2850 from nkt/change-docs-structure
[Docs] Split iOS and Android docs into different categories
2015-09-18 11:00:18 -07:00
Nikita Gusakov e55b373a61 Split iOS and Android docs into different categories 2015-09-18 20:54:05 +03:00
Nick Duncan ae57b4a729 Updated comment in javascript to say the method name is \'show\' instead of \'showText\'. 2015-09-18 10:38:36 -07:00
Jeff Morrison 2bbdbc704d React native fixups
Reviewed By: @gabelevi

Differential Revision: D2456130
2015-09-18 10:36:24 -07:00
alantrrs c6495531fb Fix typo on example code
Summary: Closes https://github.com/facebook/react-native/pull/2828

Reviewed By: @​svcscm

Differential Revision: D2457233

Pulled By: @foghina
2015-09-18 10:32:32 -07:00
ChristianHersevoort b6cb0e1246 Fixed typo in TouchableNativeFeedback docs
Summary: Closes https://github.com/facebook/react-native/pull/2843

Reviewed By: @​svcscm

Differential Revision: D2457197

Pulled By: @foghina
2015-09-18 10:32:25 -07:00
Brent Vatne 2e98c1fd5f Merge pull request #2848 from sonnylazuardi/master
Showcase: New app "Ziliun"
2015-09-18 10:27:46 -07:00
Sonny Lazuardi f7af11a734 Showcase: New app "Ziliun" 2015-09-19 00:10:34 +07:00
Dave Miller 4af2501e8e Remove an existing UIAlertViews when invalidating the RCTAlertManager
Reviewed By: @nicklockwood

Differential Revision: D2456795
2015-09-18 08:45:27 -07:00
mqli f5409c1a51 Fixing the packager infinite loop on Windows
Summary: The issue here https://github.com/facebook/react-native/issues/2787

The root path '/' dosn't match windows root path
Closes https://github.com/facebook/react-native/pull/2789

Reviewed By: @​svcscm

Differential Revision: D2452718

Pulled By: @martinbigio
2015-09-18 06:05:22 -07:00
James Ide 4fd03ba21a Finish up the work to send through the error cookie
Summary: - Includes the error cookie with soft exceptions as well since they too can be updated (requires tiny Android change too)
- Passes the error cookie through instead of leaving it unused
Closes https://github.com/facebook/react-native/pull/2198

Reviewed By: @​svcscm

Differential Revision: D2455391

Pulled By: @sahrens
2015-09-17 18:15:27 -07:00
Hedger Wang 1fd27dae5e Fix crash on RC while toggling object status.
Reviewed By: @​chaceliang

Differential Revision: D2454891
2015-09-17 17:20:51 -07:00
Alexsander Akers 9a2d05d9b2 Move color processing to JS
Reviewed By: @vjeux

Differential Revision: D2346353
2015-09-17 17:20:45 -07:00
Felix Oghină 6078a4f865 add docs to BackAndroid so they show up in the website
Summary: Fix github issue #2777

@​public

Reviewed By: @andreicoman11

Differential Revision: D2452599
2015-09-17 17:20:32 -07:00
Christopher Chedeau 5745b8fb37 Bring back the sync tool to a good state
Differential Revision: D2448321
2015-09-17 17:19:51 -07:00
James Ide feb84e0345 Merge pull request #2817 from codejet/improve_gettingstarted
Fix tiny grammatical error
2015-09-17 13:25:11 -07:00
codejet a7906c9b7c Fix tiny grammatical error 2015-09-17 22:11:55 +02:00
DengYun 9e60d5788c Merge branch 'master' of github.com:facebook/react-native into master-pr-6 2015-09-18 01:02:56 +08:00
DengYun 302c89f912 let 'react-native bundle' support platform option.
react-native bundle --platform android --minify
2015-09-18 00:58:50 +08:00
Martin Konicek 27ab039b6a Export latest Android changes 2015-09-17 14:33:28 +01:00
Felix Oghină 3b4845f93c Merge pull request #2801 from corbt/back_button_android
handle back button press in JS
2015-09-17 14:21:32 +01:00
Kyle Corbitt 88add08c2e handle back button press in JS 2015-09-17 12:09:19 +01:00
Alexander Kotliarskyi a88a134b13 Merge pull request #2767 from foghina/dont_swallow
[cli] don't swallow require(local_cli) errors
2015-09-17 11:34:37 +01:00
James Ide f080577e07 Merge pull request #2788 from dsibiski/patch-2
[Docs][Android] Adds NDK download instructions
2015-09-16 21:56:12 -07:00
Dave Sibiski 96c05c5420 [Docs][Android] Adds NDK download instructions
Right now, as the NDK is required, let's guide people to the download & extraction page.
2015-09-16 22:47:36 -04:00
James Ide 5e46f4406a Merge pull request #2785 from sahat/patch-1
Update iOS .xcodeproj path
2015-09-16 18:31:18 -07:00
Sahat Yalkabov 365cdde1ef Update iOS .xcodeproj path 2015-09-16 18:26:28 -07:00
Christopher Chedeau c33ca92327 Fix shrinkwrap
Reviewed By: @cpojer

Differential Revision: D2449121
2015-09-16 16:20:26 -07:00
Hedger Wang bab9bfec3a Fix crash on RC while toggling object status.
Reviewed By: @​chaceliang

Differential Revision: D2446382
2015-09-16 15:35:35 -07:00
Martin Konicek 674abf1955 Flexbox docs
Summary: Documenting this as it wasn't obvious the defaults were different:
https://github.com/facebook/react-native/issues/2724

@​public

Reviewed By: @vjeux

Differential Revision: D2450283
2015-09-16 15:23:01 -07:00
James Ide 102b2030f9 Merge pull request #2779 from exponentjs/readme
[README] Add link to react-native tag on Stack Overflow
2015-09-16 15:02:02 -07:00
James Ide 20e8b82b34 [README] Add link to react-native tag on Stack Overflow
Raise some awareness of the tag and let people know they can help by answering qquestions and be altruistic and helpful.
2015-09-16 15:00:45 -07:00
Christopher Chedeau 36a8358ae7 Fix more tests
Summary: beeper node modules has a `return` statement outside of a function which doesn't parse. To fix it, we mock it. Also, setupEnvPolyfills is no longer being used.
Closes https://github.com/facebook/react-native/pull/2770

Reviewed By: @​svcscm

Differential Revision: D2448882

Pulled By: @vjeux
2015-09-16 13:05:30 -07:00
Martin Konicek b4b42f1ff5 Update KnownIssues.md 2015-09-16 19:54:49 +01:00
Martin Konicek a77b03d30d Update KnownIssues.md 2015-09-16 19:53:26 +01:00
Martin Konicek 32bb968bf0 Update KnownIssues.md 2015-09-16 19:50:28 +01:00
Martin Konicek 0962d8f33b Update KnownIssues.md 2015-09-16 19:49:06 +01:00
Christopher Chedeau c95028b1df Delete setupEnvPolyfills.js which is no longer being used 2015-09-16 11:36:02 -07:00
Christoph Pojer e056c628f9 Merge pull request #2548 from exponentjs/node-convergence-tests
[Node 4] Update .travis.yml to install Node 4.x
2015-09-16 11:19:58 -07:00
Christopher Chedeau aa768ddeb8 Bring back build status 2015-09-16 10:58:05 -07:00
facebook-github-bot-6 6277a88555 Restore unintended sync 2015-09-16 10:38:42 -07:00
facebook-github-bot-6 0d09f22dbf Get back 100% in sync with fb codebase 2015-09-16 10:30:53 -07:00
Nick Lockwood 0044b3c2c3 Added logic to detect text encoding for downloaded data
Summary: @​public

RCTNetworking currently relies on network responses to include an accurate text encoding, otherwise it is unable to convert the response data to text unless it's encoded as UTF8.

See: https://github.com/facebook/react-native/issues/1780#issuecomment-139334294 for details.

This diff makes use of a new feature in iOS8 to detect the encoding of the text authomatically

Reviewed By: @sahrens

Differential Revision: D2443446
2015-09-16 10:25:06 -07:00
Sebastian Markbage 890c2193d0 Kill old transform propTypes/attributes
Summary: I can't find anywhere these are being used by the bridge / native
views anymore. I don't think they work anymore. ART has a similar
API but uses a different code path.

We might as well clean this up. Makes it easier to reason about.

@​public

Reviewed By: @vjeux

Differential Revision: D2445353
2015-09-16 10:25:01 -07:00
Christoph Pojer 6e991cf96a Simplify jest config + update to jest 0.5.5 in react-native-github
Reviewed By: @DmitrySoshnikov

Differential Revision: D2445071
2015-09-16 10:24:58 -07:00
Christopher Chedeau fa042eda50 Update TransformPropTypes.js 2015-09-16 10:24:43 -07:00
Brent Vatne e2841c05b4 [README] Add note about supported operating systems 2015-09-16 09:51:41 -07:00
Brent Vatne c1c455ff8a [Docs] Update known issues to include shadows on Android 2015-09-16 09:41:34 -07:00
Felix Oghină 373c8777f6 [cli] don't swallow require(local_cli) errors 2015-09-16 17:17:13 +01:00
Felix Oghină f775bb0e05 [cli] update appcompat and gradle tools versions in the template 2015-09-16 16:30:31 +01:00
James Ide 0e03321551 Merge pull request #2750 from flipace/flipace-type-patch-1
fixed one typo
2015-09-16 00:05:38 -07:00
Patrick Neschkudla 77d06223e4 fixed one typo
gradle instead of gralde
2015-09-16 08:40:00 +02:00
Christopher Chedeau 7f8095a9cf Merge pull request #2746 from facebook/revert-2733-npmdebug
Revert "ignore npm-debug.log"
2015-09-15 21:11:20 -07:00
Christopher Chedeau 5cb40da942 Revert "ignore npm-debug.log" 2015-09-15 21:11:10 -07:00
Christopher Chedeau 3f86d42b81 Merge pull request #2725 from javache/fix-flow-config
Update generator's flow config
2015-09-15 21:08:55 -07:00
Christopher Chedeau 870e3b332e Merge pull request #2733 from eddiemonge/npmdebug
ignore npm-debug.log
2015-09-15 21:07:00 -07:00
Christopher Chedeau be966f5a25 Testing import script
Summary: Closes https://github.com/facebook/react-native/pull/2622

Reviewed By: @​trunkagent, @​svcscm

Differential Revision: D2427801

Pulled By: @vjeux
2015-09-15 18:25:31 -07:00
Christopher Chedeau 69d42f6fa6 Adding an empty line to test the import script
Summary: Closes https://github.com/facebook/react-native/pull/2739

Reviewed By: @​svcscm

Differential Revision: D2446411

Pulled By: @vjeux
2015-09-15 17:45:31 -07:00
Christopher Chedeau b39debf256 Reverting change 2015-09-15 17:20:07 -07:00
Christopher Chedeau ab8968b893 Adding an empty line to test the import script 2015-09-15 17:19:54 -07:00
Martín Bigio 41850a962f defeat race condition when replying to client
Summary: @​public

The server dies after 30 seconds if it has no jobs on it's queue. The problem is that the jobs counter gets decreased before returning the bytes to the client. As a consequence, it's possible that the server dies while it's returning the bytes to the client, or just after it finished returning the bytes to the client.

To avoid both issues lets move the counter decrease a few lines below and bump the timer to make sure we have time to fully write the bytes on the socket and let the client close the connection before the server dies.

Reviewed By: @vjeux

Differential Revision: D2445264
2015-09-15 16:25:25 -07:00
James Ide 72e89d82fe Merge pull request #2735 from dsibiski/patch-1
[Docs][Android] Adds "Running on Device" note
2015-09-15 15:12:14 -07:00
Dave Sibiski 5538011d30 [Docs][Android] Adds "Running on Device" note
Lots of people keep asking why they get a red screen telling them to connect to a dev server when using their device. Most have followed the "Getting Started" guide, but didn't notice the "Running on Device" section since it is kinda buried in the sidebar and isn't linked to from anywhere.
2015-09-15 18:09:32 -04:00
Mike Armstrong b434ae0f3d Better text descriptions for examples
Reviewed By: @mkonicek

Differential Revision: D2443908
2015-09-15 14:55:27 -07:00
Eddie Monge e7b0d3aa42 ignore npm-debug.log 2015-09-15 14:53:46 -07:00
Martin Konicek ffe20480e4 Merge pull request #2709 from negativetwelve/missing-platform
[iOS] Add missing platform param for the movies app

This has already been done internally but messed up with the Android export.
2015-09-15 22:23:03 +01:00
Nick Lockwood a3fab4a791 Merge pull request #2723 from javache/fix-sample-app-builds
Disable code stripping for DEBUG builds
2015-09-15 22:06:59 +01:00
James Ide fb59425262 [Node 4] Update .travis.yml to install Node 4.x + upgrade jest
Jest 0.5.2 ships with a fix for bound functions, which RN exercises. And with this Travis change, the automated tests will install Node 4.x with nvm before running.

Test Plan:`nvm use 4 && npm i && npm test`
See if Travis tests pass.
2015-09-15 13:59:03 -07:00
Eric Vicenti c962251900 Fix crash when touch terminates without active gesture
Summary: When the touch gets terminated, it is not guaranteed that there is an active gesture. It looks like this was causing crashes

@​public

Reviewed By: @​chaceliang

Differential Revision: D2441469
2015-09-15 13:12:05 -07:00
Spencer Ahrens 4dca06b238 UIManagerStatTracker
Reviewed By: @astreet

Differential Revision: D2442406
2015-09-15 13:11:58 -07:00
Christoph Pojer 178d2759fc Add node 4 to Vendor
Reviewed By: @amasad
2015-09-15 13:11:49 -07:00
Christopher Chedeau fce9abea52 Delete npm-debug.log
Kill this file, shouldn't be checked in.
2015-09-15 13:11:00 -07:00
Martin Konicek f2f7da6ccd Update README.md 2015-09-15 20:58:06 +01:00
Martin Konicek 8a56eab5fb Update README.md 2015-09-15 20:56:44 +01:00
Martin Konicek eea4ed391f Update README.md 2015-09-15 20:43:36 +01:00
Christoph Pojer c507391111 Add node 4 to Vendor
Reviewed By: @amasad
2015-09-15 11:35:59 -07:00
Param Aggarwal f35fbc2a14 Fixes consistent crash on iPad with iOS 8 while sharing.
Summary: (Fixes #1890, #2395, #2604.)

Usage:
```
ActionSheetIOS.showShareActionSheetWithOptions({
  anchor: React.findNodeHandle(this.refs.share),
  message: "React Native",
  url: "https://github.com/facebook/react-native"
}, (e)=>{ console.log('shared'); }, (e)=>{console.log('dismissed'); });
```

Screenshot on iPad with iOS 8:

<img width="324" alt="screen shot 2015-09-09 at 8 50 26 am" src="https://cloud.githubusercontent.com/assets/543981/9752590/df5cd324-56cf-11e5-892b-92a6c98f3d39.png">

If the `anchor` is not specified, it will centre the popup on screen without arrows:

![centered](https://cloud.githubusercontent.com/assets/543981/9752612/10c87c6a-56d0-11e5-8c59-fcbf64a36f9c.png)

Closes https://github.com/facebook/react-native/pull/2610

Reviewed By: @nicklockwood

Differential Revision: D2439533

Pulled By: @javache
2015-09-15 11:35:26 -07:00
Pieter De Baets 81c81501d5 Update generator's flow config 2015-09-15 11:20:24 -07:00
Nick Lockwood b450e36ef8 Fixed chrome debug persistence + crash
Reviewed By: @tadeuzagallo

Differential Revision: D2443181
2015-09-15 11:20:23 -07:00
Spencer Ahrens 07e6039b70 Add comments about nativeOnly props 2015-09-15 10:46:08 -07:00
Spencer Ahrens bb79d034d2 Add comments about nativeOnly props 2015-09-15 10:37:48 -07:00
Pieter De Baets 322807b664 Disable code stripping in SampleApp debug builds
Reviewed By: @nicklockwood, @sahrens

Differential Revision: D2443697
2015-09-15 10:35:28 -07:00
Pieter De Baets e7d833f2d9 Disable code stripping for DEBUG builds 2015-09-15 09:44:15 -07:00
Justin Spahr-Summers 6484173b88 Automatically start JSC profiling if enabled on last run
Summary: @​public

Using the saved state of the toggle button, this starts profiling automatically when the `RCTContextExecutor` is set up, if it was profiling before.

Reviewed By: @tadeuzagallo

Differential Revision: D2429026
2015-09-15 02:55:26 -07:00
Mark Miyashita 2892e5f4cf [iOS] Add missing platform to the sample Movies iOS app 2015-09-15 01:14:48 -07:00
Brent Vatne 4fd0a2de0d [Docs] Update known issues 2015-09-14 23:32:45 -07:00
James Ide a30df1c9af Merge pull request #2694 from Bhullnatik/patch-1
[website] missing semicolon in Java example.
2015-09-14 16:37:13 -07:00
Jimmy Mayoukou c153e9bbbf missing semicolon in Java example. 2015-09-15 01:32:50 +02:00
James Ide 1bf8971f26 Merge pull request #2546 from exponentjs/node-convergence-docs
[Docs] Update RN website docs to mention Node 4+ instead of io.js
2015-09-14 16:18:16 -07:00
James Ide f9f050e617 [Docs] Update RN website docs to mention Node 4+ instead of io.js
The io.js codebase has been rebranded as "Node.js", so moving forward everyone should install the latest version of Node. The name "io.js" is no longer.
2015-09-14 16:16:10 -07:00
Martin Konicek dbd82413c2 [website] Add Olivia's talk from @Scale to Videos 2015-09-15 00:03:05 +01:00
Brent Vatne d09fc4ac50 Merge pull request #2680 from paramaggarwal/patch-3
[Docs] Remove duplicate Android setup steps
2015-09-14 12:23:38 -07:00
Param Aggarwal 356e800004 [Docs] Remove duplicate Android setup steps 2015-09-15 00:25:59 +05:30
James Ide bda3873e50 Merge pull request #2674 from gubatron/master
[website] missing parenthesis in java example.
2015-09-14 11:31:39 -07:00
gubatron 7995f28a11 [website] missing parenthesis in java example. 2015-09-14 14:22:47 -04:00
Martin Konicek 42eb5464fd Release React Native for Android
This is an early release and there are several things that are known
not to work if you're porting your iOS app to Android.

See the Known Issues guide on the website.

We will work with the community to reach platform parity with iOS.
2015-09-14 18:13:39 +01:00
Peter Cottle c372dab213 Fix various issues with packager editor launcher
Summary: There are a few small bugs with the code that launches the editor from the packager:

* First of all, the filepath is not escaped which means tokens like `(` or spaces will mess up the process execution. Dropbox unfortunately decided to use spaces in its enterprise product, so I was getting this error:

![screen shot 2015-07-11 at 3 20 54 pm](https://cloud.githubusercontent.com/assets/1135007/8635748/186e7f2e-27ea-11e5-8058-1f4dabb79634.png)

* Next, the line number argument formatting was assumed to be in a specific format (`:%d`) which actually errors out vim and other editors.
* Lastly, the process was started synchronously but not attached to the stdin / stdout of the parent process. This means that only editors like mvim, sublime, and others would work since they spawn a new window. Editors like emacs, vi, nano, etc wouldn't work and instead just hang at the command line.

So I whipped up this diff to fix a number of these issues, demo here:
http://recordit.co/M6zwiUj7hp

The demo shows both
Closes https://github.com/facebook/react-native/pull/1957

Reviewed By: @vjeux, @pcottle

Differential Revision: D2420941

Pulled By: @frantic
2015-09-14 10:00:26 -07:00
Nick Lockwood 515d5a5f4b Added toggle items to dev menu
Reviewed By: @tadeuzagallo

Differential Revision: D2424595
2015-09-14 09:40:33 -07:00
Andrei Coman eb48759675 Add License headers to .js files
Differential Revision: D2438967

committer: Service User <svcscm@fb.com>
2015-09-14 07:40:31 -07:00
Martin Konicek c51bfdc50c Update README.md 2015-09-14 13:56:39 +01:00
Param Aggarwal b998e5a7b7 Use getters and setters
Summary: As per discussion in #2423 - possible fix for crash. (cc: @​javache)

Please share feedback regarding the PR, we are going to be using this diff in production to see if it fixes the crashes we are seeing.

(fixes #2423)
Closes https://github.com/facebook/react-native/pull/2494

Reviewed By: @javache

Differential Revision: D2433515

Pulled By: @nicklockwood
2015-09-13 11:10:29 -07:00
James Ide 9d36fc6a71 Merge pull request #2654 from browniefed/fixLinkedDocumentation
Add back Transform/Flexbox links to style documentation
2015-09-12 15:55:20 -07:00
Martin Konicek df288564c6 Fix Flow annotations in ScrollViewSimpleExample
Reviewed By: @jingc

Differential Revision: D2437502
2015-09-12 15:35:27 -07:00
Jason Brown 627d5a8e7e Fix documentation by adding propTypeCompositionHandler 2015-09-12 09:53:01 -07:00
James Ide f4172dea3d Merge pull request #2647 from ericvera/ericvera-fix-test
Update Testing.md with pre-processing information
2015-09-11 22:22:23 -07:00
ericvera f88fe71ee6 Update Testing.md with pre-processing information
With the added information a react-native developer will be able to run jest tests without errors.
2015-09-11 21:56:45 -07:00
Martin Konicek f1cf322c9e Fix blacklist
Reviewed By: @amasad

Differential Revision: D2432196
2015-09-11 17:01:43 -07:00
Martin Konicek 56f77ec6ee Tweak debug menu labels
Reviewed By: @kmagiera

Differential Revision: D2430890
2015-09-11 17:01:40 -07:00
Gabe Levi c03dad19e7 Deploy 0.15.0
Reviewed By: @jeffmo

Differential Revision: D2421222
2015-09-11 17:01:38 -07:00
Amjad Masad 1bf7887322 Refactor DependencyResolver into request/response
Reviewed By: @martinbigio

Differential Revision: D2425842
2015-09-11 17:01:35 -07:00
Christopher Chedeau e9e3cd304b Revert internal files that didn't get pulled internally first
See all the packager files in this commit:
https://github.com/facebook/react-native/commit/f83675d1915b5e77638c117c82f8641cea367ffe#diff-7b5603771e245e5b0cd7223277db3db4

cc @foghina
2015-09-11 16:59:28 -07:00
Martin Konicek 169da2a1b7 Add simple ScrollView example to UI Explorer
Reviewed By: @foghina

Differential Revision: D2434588
2015-09-11 14:10:30 -07:00
Amjad Masad d5bce33f69 Fix server tests
Summary: @​public
Invoking an extra promise caused failures in the promise-based tests. This fixes them.

Reviewed By: @vjeux

Differential Revision: D2432431
2015-09-11 13:30:33 -07:00
Brent Vatne 1a0b6c8c0d Merge pull request #2640 from liubko/showcase
Showcase: add 'FastPaper' app
2015-09-11 09:59:01 -07:00
Dorota Kapturkiewicz d7ee28e079 fix ToastAndroid
Differential Revision: D2433671

committer: Service User <svcscm@fb.com>
2015-09-11 07:50:29 -07:00
Nick Lockwood 789a07c5a4 Added code to sync __DEV__ value to RCT_DEBUG
Summary: @​public

When using bundled JS the `__DEV__` flag is set to false by default, which can cause errors to be missed if used for testing. This diff adds logic to override the `__DEV__` value when running in RCT_DEBUG configuration, so that the JS debug checks are enabled.

Reviewed By: @tadeuzagallo

Differential Revision: D2429533
2015-09-11 07:15:27 -07:00
Tadeu Zagallo 20cd649553 Automatically save and convert JavaScript profile to chrome format
Summary: @​public

Migrate scripts to open source and add new route on the packager
to directly convert profiler outputs to a devtools compatible format.

Reviewed By: @jspahrsummers

Differential Revision: D2425740
2015-09-11 06:40:26 -07:00
Liubko 6a9838a748 Showcase: add 'FastPaper' app 2015-09-11 16:17:56 +03:00
Andrei Coman 360d04e9c8 Add Timer example
Differential Revision: D2433417

committer: Service User <svcscm@fb.com>
2015-09-11 02:00:31 -07:00
Xiqi Liu b45f89e69f Add Jest test to check dependency version matches.
Reviewed By: @vjeux

Differential Revision: D2396634
2015-09-11 01:25:27 -07:00
Yamill Vallecillo f8f75ff612 Navigator.NavigationBar Landscape Fix
Summary: NavigationBar items are fixed to Portrait when Device is in Landscape.

This supplements that fix by removing the `width` properties and just using `left` and `right` positioning respectively.

<strong>Before:</strong>

![ios simulator screen shot sep 8 2015 1 27 02 pm](https://cloud.githubusercontent.com/assets/755943/9743817/3e6b858a-5636-11e5-80e8-81e62b46c46e.png)

<strong>After:</strong>

![ios simulator screen shot sep 8 2015 1 29 21 pm](https://cloud.githubusercontent.com/assets/755943/9743822/43e7d4b4-5636-11e5-8e1c-9f13bdc492b2.png)

Closes https://github.com/facebook/react-native/pull/2606

Reviewed By: @vjeux

Differential Revision: D2426942

Pulled By: @ericvicenti
2015-09-10 14:00:26 -07:00
Felix Oghină 2a6a841ba9 Merge pull request #2633 from facebook/remove_console_logs
[cli] fix spurious console.log output generated by yeoman during tests
2015-09-10 19:10:23 +01:00
Nick Lockwood 33036b1f01 Fixed DatePickerIOS onChange event
Reviewed By: @javache

Differential Revision: D2429598
2015-09-10 10:10:26 -07:00
Christopher Chedeau e2ffac28e4 A deep dependency of yeoman just spams the console.log with giant json. This diff silences console.log around the require to kill them 2015-09-10 09:48:15 -07:00
Tadeu Zagallo af05af7125 Update json generation code and save to file
Summary: @​public

* Change the JSON generation and remove the dependency on YAJL since it had a
128 depth limit
* Enable the profiler bytecode generation to fix missing frames
* Save the output to a file on the tmp dir instead of outputting it to the console

Reviewed By: @jspahrsummers

Differential Revision: D2420754
2015-09-10 09:10:23 -07:00
Dorota Kapturkiewicz 2a34239c17 move AccessibilityExample to oss
Differential Revision: D2424931
2015-09-10 08:40:36 -07:00
Alexander Kotliarskyi 65c4088340 Merge pull request #2573 from nsimmons/cli/add_version_argument
[CLI] Add version argument
2015-09-10 16:23:04 +01:00
Pieter De Baets 5ac1c26ddd Merge pull request #2630 from javache/fix-e2e
Use new packager URL in e2e test
2015-09-10 15:13:07 +01:00
Pieter De Baets bc69787576 Use new packager URL in e2e test 2015-09-10 14:41:16 +01:00
Nick Lockwood 19e421a8dc Fixed segmented control
Reviewed By: @javache

Differential Revision: D2428947
2015-09-10 04:50:24 -07:00
Bill Fisher 493cb35966 Fix flow typing of TimingAnimationConfig
Summary: @​public
Make the flow type of TimingAnimationConfig and TimingAnimation the same as SpringAnimationConfig and SpringAnimation.
This is a more accurate flow type as both are multiplexed through maybeVectorAnim().

Reviewed By: @sahrens

Differential Revision: D2410166
2015-09-09 23:55:30 -07:00
Brent Vatne ac9471f2cd Merge pull request #2626 from brentvatne/fix-getting-started-project-path-ios
[Docs] xcodeproj for new projects is now in iOS/
2015-09-09 21:10:15 -07:00
Brent Vatne ee1cbf4c98 [Docs] xcodeproj for new projects is now in iOS/ 2015-09-09 21:08:58 -07:00
James Ide cbed87a74e Merge pull request #2619 from JonathanHayward/patch-1
Specify missing step
2015-09-09 16:49:22 -07:00
Amjad Masad 9b27116798 Client should throw when server unexpectedly closes the connection
Reviewed By: @natthu

Differential Revision: D2425357
2015-09-09 16:35:25 -07:00
Amjad Masad 3cfac35fd8 Handle EEXIST error when starting the server
Reviewed By: @cpojer

Differential Revision: D2426373
2015-09-09 16:10:33 -07:00
Amjad Masad 3ee65225be Protect against races in deleting corrupt cache
Reviewed By: @cpojer

Differential Revision: D2426450
2015-09-09 16:05:39 -07:00
JonathanHayward b7f5b8c98f Update GettingStarted.md 2015-09-09 17:12:58 -05:00
Amjad Masad cd4e8a9fae Pass in platform argument in offline building
Summary: how did this ever work?
All build jobs must pass in the platform argument.
This also turns the "platform" argument into a required one.

I added a task to infer the platform argument from the filename here: t8306875

Reviewed By: @martinbigio

Differential Revision: D2425114
2015-09-09 14:45:58 -07:00
JonathanHayward 6eaa789ec0 Specify missing step
The instructions as given did not work. The reason they did not work was that, while my .bashrc was made aware of nvm, my running bash process did not know about nvm until I ran ". ~/bashrc", after which things worked as expected.
2015-09-09 15:59:22 -05:00
Pieter De Baets 89b7bd4e5e Remove IntegrationTests.m reference
Summary: In https://github.com/facebook/react-native/commit/7a6f116ed49b9671a2245aff878c1126f4798e7b, IntegrationsTests.m got renamed but for some reason the xcode project still referenced that file and broke the tests.

I opened xcode, found the red file, deleted it and saved. Tests are now passing again :)

I already landed it: https://github.com/facebook/react-native/commit/f9b2709c8d39b1ec6f729d315855f05d427ab75b

Reviewed By: @vjeux

Differential Revision: D2424063
2015-09-09 11:25:30 -07:00
Christopher Chedeau d3800c6615 Fix declareOpts test
Summary: When we updated joi, the error message was changed. I removed the content to prevent similar errors in the future.

Reviewed By: @amasad

Differential Revision: D2424048
2015-09-09 11:25:28 -07:00
Alex Kotliarskyi ce47e56b7b Attach platform to asset url
Summary: Depends on D2420548

Reviewed By: @martinbigio

Differential Revision: D2421696
2015-09-09 11:25:26 -07:00
Tadeu Zagallo c4305fe9af Move systrace helper out of the packager
Summary: @​public

The profiler helper shouldn't live inside the packager itself, move
it to the packager.js file with other middlewares.

Reviewed By: @martinbigio

Differential Revision: D2424878
2015-09-09 11:25:24 -07:00
Dorota Kapturkiewicz 4a4f087a9c move Toast to oss
Summary: Importing JS changes to fbobjc which should be maintained as a source of truth
for React Native JS files. For more details about this change, please refer to
the original diff in fbandroid repo: D2410797

Reviewed By: @andreicoman11

Differential Revision: D2424679
2015-09-09 11:25:22 -07:00
Alex Kotliarskyi d82af3cb92 Fix "global-strict" lint
Reviewed By: @vjeux

Differential Revision: D2420561
2015-09-09 11:25:18 -07:00
Christopher Chedeau c71c940803 Revert "unbreak tests"
This reverts commit f9b2709c8d.
2015-09-09 11:10:50 -07:00
Christopher Chedeau 635b15b454 Testing new export script
Differential Revision: D2420548
2015-09-09 10:01:29 -07:00
Christopher Chedeau 1c4be5e1f2 Merge pull request #2608 from facebook/Update_Tue_8_Sep
Update tue 8 sep
2015-09-08 20:14:35 -07:00
Christopher Chedeau f9b2709c8d unbreak tests 2015-09-08 20:00:42 -07:00
Christopher Chedeau a9607901e2 Updates from Tue 8 Sep 2015-09-08 16:54:44 -07:00
Nick Simmons 4f89c61bd8 [CLI] Add version argument 2015-09-08 17:48:16 -04:00
Alex Kotliarskyi fb7d7d6880 [ReactNative] Pipe platform option all the way to the asset server 2015-09-08 11:37:38 -08:00
Christopher Chedeau c0488c71d3 [npm] Fix connect/
Summary:
We had an old version of connect internally and a new version on github. Unfortunately, internally we picked up the od one and externally we picked the new one. This diff removes the internal version and downgrades the external version. It also updates package.json to make sure we have the same versions that are installed, somehow they mismatch!?
2015-09-08 11:31:52 -08:00
Chace Liang c971aae676 [RN][Accessibility] typo in onAccessibilityTap 2015-09-08 10:40:28 -08:00
Nacho Lopez Sais 551815c1cf Adapted changes from android repo for TextInput numberOfLines 2015-09-08 10:25:13 -08:00
Nick Lockwood 56d25bbbdd Moved CameraRoll-related classes into CameraRoll folder instead of Image
Summary:
The CameraRoll-related APIs were mixed in with the Image classes due to legacy coupling issues. Now that the APIs have been decoupled, it makes more sense for the CameraRoll classes to live in a separate library.

This will be a breaking change for apps using the CameraRoll or related APIs. Fix is to add the RCTCameraRoll lib to your project.
2015-09-08 09:48:19 -08:00
Ben Alpert 93b9329b75 [ReactNative] Enable displayName transformer in open source 2015-09-08 08:11:42 -08:00
Tadeu Zagallo f9ca103ecb [ReactNative][Profiler] Update OSS build script to work with new makefile
Summary:
There was some recent changes to the Makefile, but the open source
build phase script wasn't update. Update it to copy the files to
the right location.
2015-09-08 05:59:07 -08:00
James Ide f61ea911b5 [Profiler] Fix makefile target
Summary:
Simple rename.

Closes https://github.com/facebook/react-native/pull/2595
Github Author: James Ide <ide@jameside.com>
2015-09-08 05:59:07 -08:00
Martín Bigio 817bf1f50f [react-packager] Bump ipc timeout 2015-09-08 04:50:25 -08:00
Nick Lockwood 2061899224 Fixed networker crash due to threading bug 2015-09-08 04:03:04 -08:00
Nick Lockwood ad0c97f25b Fixed PickerIOS onChange event 2015-09-08 03:34:33 -08:00
Amjad Masad 8586f89322 [react-packager] Update sane to fix bug and add new features
Summary:
Updates sane to get:

1. Fix error plumbing (surface watchman errors correctly)
2. Better capability testing
3. Use watchman's globbing
4. Other minor fixes
2015-09-08 01:25:29 -08:00
James Ide b9049ee96d [README] Added note about squashing commits to the Contributing page 2015-09-07 23:32:31 -07:00
Amjad Masad bceab6c1c2 [react-packager] Allow a longer startup time before the server dies
Summary:
1. When the server starts up, it only gives itself 30 second to live before receiving any connections/jobs
2. There is a startup cost with starting the server and handshaking
3. The server dies before the client has a chance to connect to it

Solution:
1. While the server should die pretty fast after it's done it's work, we should have a longer timeout for starting it
2. I also added accompanying server logs with client connection errors
2015-09-07 10:31:49 -08:00
James Ide 68a00759e4 Merge pull request #2581 from tylermcginnis/patch-6
Add Spero for Cancer to React Native showcase
2015-09-07 10:36:36 -07:00
Tyler McGinnis a53b77949f Alphabetize list. 2015-09-07 18:24:03 +01:00
Tyler McGinnis 9023e19dc3 Add Spero for Cancer to React Native showcase 2015-09-07 10:40:24 +01:00
Martín Bigio 59b9dc8829 [react-packager] Add command line option to reset cache on OSS 2015-09-07 01:16:44 -08:00
James Ide 8b84ccb95b Merge pull request #2563 from nsimmons/react-native-cli/updated_intro_to_sinopia
[CLI] Updated contributing guide to deal with Sinopia publishing issue
2015-09-06 21:29:16 -07:00
Spencer Ahrens 1f6f60582d [RN] Prevent reloading library photos on every animation frame 2015-09-06 17:16:10 -08:00
James Ide 319fa06afb [README] Intro section that links to website 2015-09-06 17:22:14 -07:00
James Ide 7361f537c9 [README] Added a table of contents and some small rewording
The table of contents should make it easier to browse the README.
2015-09-06 16:45:35 -07:00
James Ide ab28625daa Merge pull request #2574 from exponentjs/new-readme
[README] New README co-authored with @brentvatne
2015-09-06 16:37:16 -07:00
James Ide e5d4bfaf31 [README] New README co-authored with @brentvatne
This new README talks more about the react-native project, repository, and contribution process (the old one was more focused on technical details). @brentvatne and I want people to get help and file issues & PRs more effectively. Here's a first draft that we believe helps with that.
2015-09-06 16:30:29 -07:00
Brent Vatne b81aa51ee5 Merge pull request #2566 from steve-ng/master
Showcase: New app "SG Toto 4d"
2015-09-05 19:32:58 -07:00
Steve f4a1382cd8 Showcase: New app "SG Toto 4d" 2015-09-06 10:10:07 +08:00
Brent Vatne eef6f96d49 Merge pull request #2565 from vishnevskiy/master
Showcase: New app "Discord"
2015-09-05 18:37:57 -07:00
Stanislav Vishnevskiy 3c1235f377 Showcase: New app "Discord" 2015-09-05 17:55:50 -07:00
Nick Simmons dca6135d35 updated contributing guide sinopia section to deal with use auth issue 2015-09-05 14:39:57 -04:00
James Ide f170939c70 Merge pull request #2561 from PhilippKrone/yolociShowcase
Showcase: New app "Yoloci"
2015-09-05 03:20:51 -07:00
philipp.krone 1f4d52e4f2 Showcase: New app "Yoloci" 2015-09-05 12:18:06 +02:00
Campbell Glass 97a54b5569 [mobilehome] Working Mobile Home GraphQL for android 2015-09-04 18:35:35 -08:00
Gabe Levi 874f39bf7f [Flow] Clean up react-native for Flow v0.15.0 2015-09-04 16:51:18 -08:00
Amjad Masad 936e1d4a11 [react-packager] Support platform extensions in image requires
Summary:
We don't currently support platform extensions in asset modules.
This adds supports for it:

```
require('./a.png');
```

Will require 'a.ios.png' if it exists and 'a.png' if it doesn't.
2015-09-04 15:17:14 -08:00
Christopher Chedeau 8831bb10a1 [npm] Upgrade all the modules to their latest version 2015-09-04 14:48:23 -08:00
Tadeu Zagallo 90409770c9 [RectNative][Packager] Cache minification result
Summary:
The packager just cached the result of the bundle, but would minify
it on every request. Change it to cache the minification result.
2015-09-04 12:22:50 -08:00
Tadeu Zagallo c593504910 [ReactNative] Add RCTJSCProfiler to internal apps 2015-09-04 10:47:56 -08:00
Pieter De Baets 1d04a58821 Correct references to unexistent SnapshotTestManager to TestModule 2015-09-04 08:16:00 -08:00
Tadeu Zagallo b9f12056e9 [ReactNative] Update uglify-js
Summary:
Uglify had already been updated, but was accidentally changed
back to the previous version. Update it again.

@allow-crlf-text
2015-09-04 07:23:01 -08:00
Alexey Lang bbeaac5d3b Automatically adjust content inset after view controller did layout subviews 2015-09-04 07:00:21 -08:00
Nick Lockwood bb5522582d Fixed layout animation crash 2015-09-04 05:34:46 -08:00
Nick Lockwood e4110456ab Changed RCTImageLoader to always return a UIImage
Summary:
GIF images are currently loaded as a CAKeyframeAnimation, however returning this animation directly from RCTImageLoader was dangerous, as any code that expected a UIImage would crash.

This diff changes RCTGIFImageLoader to return a UIImage of the first frame, with the keyframe animation attached as an associated object. This way, code that is not expecting an animation will still work correctly.
2015-09-04 05:10:34 -08:00
Aaron Chiu 3c4adeb2e7 [ReactNative][SyncDiff] Hook in the Dialog.onDismiss to JS 2015-09-04 04:09:25 -08:00
Tadeu Zagallo d316586e7d Merge pull request #2404 from ide/xcode64
[Travis] Update CI to run with Xcode 6.4
2015-09-04 12:59:52 +01:00
Tj 58661978a7 [RCTDevLoadingView] Add ability to disable during development.
Summary:
I'd like this ability as this has a tendency to get in the way of some of the more complex UI pieces I have. Disabling RCT_DEV entirely is too much for me.
Closes https://github.com/facebook/react-native/pull/2451
Github Author: Tj <tfallon@mail.depaul.edu>
2015-09-04 03:46:06 -08:00
Pieter De Baets 7a6f116ed4 Fix React Native test configuration 2015-09-04 03:30:36 -08:00
James Ide 3f4c7e40c6 [Bridge] Consistently post "DidFailToLoad" notification when there's an error
Summary:
Previously the bridge sometimes never fired RCTJavaScriptDidLoadNotification or RCTJavaScriptDidFailToLoadNotification if there was an error (for example, if the source code loaded but we couldn't inject the JSON config). This diff moves the error handling into a method called `stopLoadingWithError` that the bridge can call whenever there is an error.

Also if the script failed to load, the BatchedBridge still called `executeSourceCode`. With this diff the `_loading` flag is set to NO when the script fails to load, and `executeSourceCode` returns immediately when `_loading` is false. This way the bridge does not try to execute JS when there is a loading error.
Closes https://github.com/facebook/react-native/pull/2520
Github Author: James Ide <ide@jameside.com>
2015-09-04 03:28:51 -08:00
Pieter De Baets 9b1f6c9e30 Make RCTTestRunner wait for JS context to deallocate 2015-09-04 03:24:16 -08:00
Pieter De Baets 44fec06891 Fix example apps to use new packager paths 2015-09-04 02:40:41 -08:00
James Ide 1b0da33b47 [Travis] Update CI to run with Xcode 6.4
Use Xcode 6.4 instead of Travis' beta support for 6.3.
2015-09-04 02:39:37 -07:00
Spencer Ahrens cc1a9fa3f3 [RN] Document Animated.js 2015-09-03 19:25:41 -08:00
Spencer Ahrens 304989e3b8 Merge pull request #2541 from sahrens/Updates_from_Thu_Sep_3rd
Updates from Thu September 3rd
2015-09-03 17:51:41 -07:00
Amjad Masad 54f91bd951 [react-packager] Socket Server should not die while there active connections
Summary:
Saw an issue with a build because of an ENONT error: https://fb.facebook.com/groups/716936458354972/permalink/923628747685741/

My hypothesis:

1. We issue a ping to the socket (in SocketInterface/index.js) a decides if the available socket is alive
2. We see that it's alive but by the time we actually connect to it the server would've died

Solution:

1. The server shouldn't die as long as there are clients connected to it (currently it only stay alive as long as there are jobs)
2. The "ping" should only disconnect once the client is connected
3. Finally, have a better error message than ENOENT
2015-09-03 14:48:19 -08:00
Nick Lockwood e0505fe43e Added missing init override to RCTRootView 2015-09-03 13:10:06 -08:00
Spencer Ahrens fdeb6a842a [RN] New AnimationExample 2015-09-03 12:52:56 -08:00
Chace Liang 836e4c03fc [RN][Accessibility] Expose accessibilityTraits and accessibilityComponentType props to Touchable* component 2015-09-03 12:16:21 -08:00
Tadeu Zagallo 7bb0ff535c [ReactNative][Packager] Fix source maps for minified sources
Summary:
The packager was ignoring minification for source map requests.
2015-09-03 12:01:57 -08:00
Spencer Ahrens d7b13fb32b Updates from Thu Sep 3rd. 2015-09-03 12:55:40 -07:00
Spencer Ahrens 19f062d23c Merge pull request #2540 from sahrens/animatedDocGen
[autodocs] add doc blocks to more things
2015-09-03 12:31:17 -07:00
James Ide 293d2924c7 Merge pull request #2537 from dizlexik/patch-1
Fix broken link in Animations.md
2015-09-03 12:16:39 -07:00
Spencer Ahrens dfdef9a02a [autodocs] add doc blocks to more things 2015-09-03 11:53:20 -07:00
Joe Lutz b572a6b874 Fix broken link in Animations.md 2015-09-03 12:15:30 -05:00
Tadeu Zagallo 200fa6debc [ReactNative] Bump node_modules and add npm-shrinkwrap 2015-09-03 06:18:13 -08:00
Alex Akers 8187d1f0ec Update image loader plugins 2015-09-03 06:06:19 -08:00
Nick Lockwood aa62a5e4e0 Send layout events on shadow queue
Summary:
We currently wait until after views have been updated on the main thread before sending layout events. This means that any code that relies on those events to update the UI will lag the atual layout by at least one frame.

This changes the RCTUIManager to send the event immediately after layout has occured on the shadow thread. This noticably improves the respinsiveness of the layout example in UIExplorer, which now updates the dimension labels immediately instead of waiting until after the layout animation has completed.
2015-09-03 03:42:26 -08:00
Oliver (Cunpu) Bo f28255ea3e Support "file://" in RCTImageLoader 2015-09-02 16:37:33 -08:00
James Ide be6a3dcb75 Merge pull request #2533 from danscan/patch-1
Add "Tabtor Parent" insights app to showcase.
2015-09-02 17:08:38 -07:00
Dan Scanlon 3f0a936e1c Add "Tabtor Parent" insights app to showcase. 2015-09-02 19:51:23 -04:00
Amjad Masad 62f9059f85 [react-packager] Sourcemap url should include the same args as the bundle url
Summary:
Sourcemap urls were generated as just the pathname (no options) which meant that they generated source for the wrong bundle.

Even worse, there exists a race condition when multiple request to the same bundle has different types of paltform arguments (in this case one could be 'ios' and the other is undefined). The fix will this will come later as it's more involved -- will need to refactor the dependency resolver to have a per-request state.
2015-09-02 15:34:54 -08:00
James Ide ddb43bc9bf Merge pull request #2531 from quelledanielle/patch-1
Fix typo in LinkingLibraries.md
2015-09-02 16:19:15 -07:00
Alex Kotliarskyi c069035479 [React Native] Bring back .sourceURL 2015-09-02 14:12:48 -08:00
Danielle Pham 22845b56f0 Fix typo in LinkingLibraries.md
you => your
2015-09-02 18:09:12 -04:00
Tadeu Zagallo b92efd1a2f Merge pull request #2398 from ide/iojs-3-deps
[npm] Update to stacktrace-parser@0.1.3 and ws@0.8.0 to satisfy io.js 3 / Node 4
2015-09-02 22:28:44 +01:00
James Ide 7f65971761 [npm] Update to stacktrace-parser@0.1.3 and ws@0.8.0 to satisfy io.js 3 / Node 4
Summary:
The previous version of stacktrace-parser 0.1.2 had an line in its package.json file that required Node <= 2.x. That line was removed, so it no longer warns on io.js 3.x or Node 4.x.

Similarly, ws 0.8.0 was published with support for the new V8, so it compiles with io.js 3.x and therefore should work with Node 4.x.

Updated the Travis file as well to run on io.js 3.x.

Fixes #2258, #2455

Closes https://github.com/facebook/react-native/pull/2398
Github Author: James Ide <ide@jameside.com>
2015-09-02 11:20:56 -08:00
Alex Akers e092c61bac Add KeyboardAvoidingView 2015-09-02 09:17:20 -08:00
Alex Akers 36444a65c7 Add pluggable image processing system 2015-09-02 08:31:34 -08:00
Tadeu Zagallo eb9a9395ac [ReactNative][JSCProfiler] Cleanup make file and make targets cacheable
Summary:
The makefile for the JSCLegacyProfiler was really messy, clean it up a bit,
remove duplicate code, and make targets be actual files rather than dummy targets
so it can actually cache things instead of re-downloading everything every time.
2015-09-02 08:11:42 -08:00
Nick Lockwood 848839858b Added mechanism for directly mapping JS event handlers to blocks
Summary:
Currently, the system for mapping JS event handlers to blocks is quite clean on the JS side, but is clunky on the native side. The event property is passed as a boolean, which can then be checked by the native side, and if true, the native side is supposed to send an event via the event dispatcher.

This diff adds the facility to declare the property as a block instead. This means that the event side can simply call the block, and it will automatically send the event. Because the blocks for bubbling and direct events are named differently, we can also use this to generate the event registration data and get rid of the arrays of event names.

The name of the event is inferred from the property name, which means that the property for an event called "load" must be called `onLoad` or the mapping won't work. This can be optionally remapped to a different property name on the view itself if necessary, e.g.

  RCT_REMAP_VIEW_PROPERTY(onLoad, loadEventBlock, RCTDirectEventBlock)

If you don't want to use this mechanism then for now it is still possible to declare the property as a BOOL instead and use the old mechanism (this approach is now deprecated however, and may eventually be removed altogether).
2015-09-02 06:11:24 -08:00
Spencer Ahrens 4379aa00de [RN] Use default param for elastic bounciness 2015-09-01 20:38:50 -08:00
Amjad Masad b17b328aed [react-packager] Fix cache issues 2015-09-01 16:43:17 -08:00
Spencer Ahrens 2fc8ca01f9 Merge pull request #2517 from sahrens/animatedDocGen
[Docs] Expand API parsing and rendering
2015-09-01 14:15:12 -07:00
Spencer Ahrens 126928b0b4 [Docs] Expand API parsing and rendering
The `Animated` module exposes a lot of functionality, including internal
classes. This diff extracts properties and classes from modules and renders them
recursively.

This also adds `Animated` to the autogen docs now that they more capable,
although it needs way more docblocks and such which will come later.
2015-09-01 14:14:47 -07:00
James Ide 514efd17d3 [npm] Update to stacktrace-parser@0.1.3 and ws@0.8.0 to satisfy io.js 3 / Node 4
The previous version of stacktrace-parser 0.1.2 had an line in its package.json file that required Node <= 2.x. That line was removed, so it no longer warns on io.js 3.x or Node 4.x.

Similarly, ws 0.8.0 was published with support for the new V8, so it compiles with io.js 3.x and therefore should work with Node 4.x.

Updated the Travis file as well to run on io.js 3.x.

Test Plan:
```
$ nvm use iojs-v3
Now using io.js v3.1.0 (npm v2.13.3)

$ npm i
<no compiler errors>
```
2015-09-01 14:09:47 -07:00
Brent Vatne 2acf6e7bf9 Merge pull request #2511 from bradens/master
Add leanpub to the list of showcase apps.
2015-09-01 14:03:38 -07:00
Amjad Masad 39ae5daec3 [react-pacakger] Max idle time for socket server is too long 2015-09-01 11:40:47 -08:00
Hedger Wang 36dfd402b2 [madman] Supports onLayout for AdsManagerTouchableHighlight.
Summary:
Supports `onLayout` for Touchable*` by piping onLayout
through to the native component inside since only native components support
it by default.
2015-09-01 10:22:47 -08:00
Andrei Coman bc64f26a7a [ReactNative][SyncDiff] Add border example 2015-09-01 10:05:35 -08:00
Tadeu Zagallo 0426f502bb [ReactNative] Increase timeout and re-enable allocation tests
Summary:
Two of the allocation were disabled due to eventual failures on Travis, but
haven't failed internally nor locally. I'm bumping the time out and re-enabling
them to see if that was the case.
2015-09-01 08:53:47 -08:00
Marius Butuc 3cd9187a26 Fix LinkingIOS docs typo
Summary:
And yes, just agreed to the Contributor License Agreement (CLA). 👍
Closes https://github.com/facebook/react-native/pull/2483
Github Author: Marius Butuc <marius@shopify.com>
2015-09-01 08:09:45 -08:00
Andrei Coman 9cede03846 [ReactNative][SyncDiff] Add Image Example 2015-09-01 07:55:44 -08:00
Tadeu Zagallo c522e3b16e [ReactNative] Re-enable timers test
Summary:
Timers test was failing but I believe that D2399150 fixes it. Re-enable and
monitor.
2015-09-01 06:14:37 -08:00
futbalguy 3bef953f77 Added clarifying language to error for not finding development server
Summary:
Added additional check to make if seeing error message on not finding development server:
Node server URL is correctly set in AppDelegate.

Should make it easier for a developer that is not running on localhost for the first time.

Screenshot of updated error message:
![img_0015 1](https://cloud.githubusercontent.com/assets/7111607/9553286/d7081c30-4d72-11e5-8c24-e3e5c83281d0.PNG)

Closes https://github.com/facebook/react-native/pull/2484
Github Author: futbalguy <kyle.rokita@gmail.com>
2015-09-01 05:25:56 -08:00
Tadeu Zagallo c6240c7441 [ReactNative] Ensure WebViewExecutor's webview is created on the main thread
Summary:
Fixes #2464

After the bridge parallelisation of the bridge initialisation the executors
were being `setUp` in a background thread, and the `RCTWebViewExecutor` was
crashing when creating a `UIWebView` out of the main thread.

Wrap the `UIWebView` creation in a call to the main thread.
2015-09-01 05:16:43 -08:00
Andrei Coman 5b2d8000ae [ReactNative][SyncDiff] Add option to make examples platform specific 2015-09-01 04:56:05 -08:00
Andrei Coman d4e5d95efe [ReactNative][SyncDiff] Revamp AsyncStorage for OSS 2015-09-01 04:25:07 -08:00
James Ide 853d5b2221 [TextInput] Set scrollsToTop = NO for UITextViews
Summary:
Now that UITextViews have a delegate, they consume the "tap to scroll to top" gesture. This diff restores the original behavior of letting the top-level scroll view (if any) scroll to top instead.

I tried exposing scrollsToTop as a prop and was semi-successful in that I could turn scroll-to-top on and off for the top-level scroll view scroll, but the text view itself would never scroll to top. So instead of exposing it as a prop, this diff sets scrollsToTop always to NO, which is how TextInput behaved previously.

Closes https://github.com/facebook/react-native/pull/2333
Github Author: James Ide <ide@jameside.com>
2015-09-01 02:40:15 -08:00
Ted Suzman 2b3a4bd27d [ReactNative] Maintain order of bridge calls
Summary:
When bridge calls are made, they should be dispatched to their
destination GCD queue in the same order they were made. (It
looks like this invariant broke in 336e18d, which caused call
order to depend on the iteration of `NSMapTable` keys
whenever there are calls to multiple modules that share a queue)

Fixes #1941 (in which RCTUIManager createView addUIBlock
blocks were sometimes running after other blocks that depended
on them)

I'm a react-native/iOS/objc newbie, so please excuse any
ignorance this commit may well contain :)
Closes https://github.com/facebook/react-native/pull/2488
Github Author: Ted Suzman <ted@suzman.net>
2015-09-01 02:19:42 -08:00
Braden Simpson c78b33b942 Style fixes for showcase 2015-08-31 20:49:19 -07:00
Nathan Spaun 1ff22b7b9c Adding jest tests to groups rn 2015-08-31 17:35:47 -08:00
Braden Simpson 19df8ba698 Add leanpub to the list of showcase apps. 2015-08-31 17:06:54 -07:00
Spencer Ahrens ce81468607 Merge pull request #2504 from sahrens/Updates_from_Mon_Aug_31st
Updates from Mon Aug 31st
2015-08-31 17:00:33 -07:00
Spencer Ahrens 465f539057 Updates from Mon Aug 31st. 2015-08-31 16:31:41 -07:00
Spencer Ahrens f1c9c5c2af [RN] Disable flaky testJavaScriptExecutorIsDeallocated 2015-08-31 13:50:05 -08:00
Spencer Ahrens 9ad2c322c0 [RN] improve elastic easing
Summary:
1) Makes params more intuitive (only one now, bounciness, which maps intuitively to number of oscillations).
2) Satisfies boundary conditions (f(0) = 0, f(1) = 1) so animation actually goes where you tell it (before it would finish at a random location depending on the input params).
3) Simple test to verify boundary conditions.
2015-08-31 13:39:00 -08:00
Amjad Masad d87480e9ac [react-pacakger] Fix failing test
Summary:
Fix failing test that matches the exact error string to match using `contains`.

I was under the impression that jest tests were running in CI -- turns out not yet.
2015-08-31 12:42:29 -08:00
Spencer Ahrens 1a411a7869 Merge pull request #2507 from sahrens/updateWebsite
Update auto gen docs
2015-08-31 12:45:27 -07:00
Spencer Ahrens 51b1f399be Update auto gen docs
* docgen -> v2.0.1 to support ES6 classes.
* Add `<Modal>` and `<ProgressViewIOS>` components to docs.
2015-08-31 12:23:11 -07:00
Spencer Ahrens 94ae886060 [RN] add clarifying Android-only comment to Portal 2015-08-31 11:10:45 -08:00
James Ide 81c2216d82 [RN Debugger] Don't try to handle messages without a method
Summary:
Some messages are special and are intended for the devtools, like `{$open: id}` and `{$error: id}`. The main debugger-ui page can't handle these and thinks something is wrong when `object.method` is undefined. This diff handles messages only if they specify a method.

Fixes #2377

Closes https://github.com/facebook/react-native/pull/2405
Github Author: James Ide <ide@jameside.com>
2015-08-31 11:09:57 -08:00
Spencer Ahrens d080c8dc2b [RN] fix TimerExample
Summary:
Pressing clear would crash if timer was unmounted.

Fixed by not rendering clear button when timer unmounted.
2015-08-31 10:06:59 -08:00
Spencer Ahrens 6f3849ea7b [RN] Disable TimersTest - sporadic failures on Travis
Summary:
Can't get any local failures to trigger.  Travis failure:

https://travis-ci.org/facebook/react-native/jobs/78064148
2015-08-31 09:52:23 -08:00
Amjad Masad 250494acd3 [react-packager] Fail loudly with errors from the transformer 2015-08-31 09:27:26 -08:00
James Ide 34c74eaead Merge pull request #2505 from dubert/patch-1
[Showcase] fix broken icon app image link for Facebook Ads Manager
2015-08-31 09:50:36 -07:00
Luke Dubert c086a352b3 [Showcase] fix broken icon link 2015-08-31 12:46:15 -04:00
Martín Bigio 7fed668841 [react-packager] Cache BundlesLayout 2015-08-31 07:13:35 -08:00
Brent Vatne fdc7d49a08 [Showcase] Add Exponent to the list 2015-08-30 13:44:37 -07:00
Brent Vatne b35a15135d [Showcase] Use the actual name from the Play store for Adverts Manager 2015-08-30 13:42:04 -07:00
Brent Vatne 2bc2534d91 [Showcase] Add a few more apps, improve styling 2015-08-30 13:38:09 -07:00
Felix Oghina 53fc5624e4 [reactnative] send platform arg with all packager requests 2015-08-29 06:36:18 -08:00
Brent Vatne bbf7a8f49e Merge pull request #2482 from esauter5/master
Add DropBot app to Showcase
2015-08-28 12:15:41 -07:00
Tadeu Zagallo aee74efde7 [ReactNative] Add JSC profiler to Dev Menu
Summary:
Add JSC profiler to the dev menu and rename the pre-existent one to systrace.

For now it just outputs to the console, but a better workflow is on the way.
2015-08-28 10:31:47 -08:00
Eric Sauter 3357bec8c0 Add DropBot to Showcase 2015-08-28 10:39:52 -04:00
Pieter De Baets e15f584a3d Slim RCTSourceCode in production 2015-08-28 05:46:35 -08:00
Tadeu Zagallo 8c19b58eef [ReactNative] Move babel to oss folder 2015-08-28 04:14:00 -08:00
Andrei Coman 06c1b4dffd [ReactNative][SyncDiff] Add Movies app 2015-08-28 03:03:53 -08:00
Nick Lockwood fa6bc1c3cd Fixed WebView example 2015-08-27 14:08:17 -08:00
Christopher Chedeau fdf76b419a Merge pull request #2470 from chirag04/showcase_size
[Showcase] Reduce the width on showcase items
2015-08-27 13:11:31 -07:00
chirag04 791ed112f2 reduce the width on showcase items 2015-08-27 16:08:14 -04:00
Christopher Chedeau b1573a45a7 Merge pull request #2337 from chirag04/showcase
showcase link on React-native website.
2015-08-27 12:51:12 -07:00
Eric Vicenti 99bd57aef2 [ReactNative] Improve error handling with missing bridge callback
Summary:
This will throw an error message with the problematic callback module/method. Previously we would get an invariant in this case when we try to access `callback.apply` later in the method.
2015-08-27 11:02:58 -08:00
Martín Bigio 5dbde93ec6 [react-packager] System.import transform 2015-08-27 09:28:48 -08:00
Andrei Coman 8ec1a180df [ReactNative][SyncDiff] Add more items to react-native target 2015-08-27 06:31:30 -08:00
Amjad Masad 34b5aa2a57 [react-packager] Fix races
Summary:
A few potential races to fix:

1. Multiple clients maybe racing to delete a zombie socket
2. Servers who should die because other servers are already listening are taking the socket with them (move `process.on('exit'` code to after the server is listening
3. Servers which are redundant should immediatly die
2015-08-27 01:41:11 -08:00
Amjad Masad 1598cc6979 [react-packager] bump create server timeout to 60s 2015-08-26 23:11:44 -08:00
Alex Kotliarskyi c7b1509615 [react-native] Fix tests and re-enable CI 2015-08-26 20:58:24 -08:00
James Ide a88daba06f Merge pull request #2452 from Reparadocs/master
Changing Linked Libraries URI to point to the right page
2015-08-26 20:34:56 -07:00
Alex Kotliarskyi 5b25f208c5 [ReactNative] Teach flow how to deal with images 2015-08-26 18:26:09 -08:00
Rishab U Hegde 326768a949 Changing Linked Libraries URI to point to the right page 2015-08-26 18:47:03 -07:00
Martín Bigio ac5c1e9cc4 [react-packager] Make sure server is listening on socket 2015-08-26 16:25:17 -08:00
Andy Street a9115bcbb3 [ReactNative][SyncDiff] Add parameter to allow turning on/off off screen rendering for alpha compositing 2015-08-26 15:15:36 -08:00
Martin Konicek fc06dc8e37 Merge pull request #2448 from mkonicek/Updates_Wed_26_Aug_2
More updates from Wed 26 Aug
2015-08-26 19:24:35 +01:00
Nick Lockwood 7bf157c92c Fix assertion when modules are accessed early on in bridge startup 2015-08-26 10:01:29 -08:00
Martin Konicek 590156a360 More updates from Wed 26 Aug 2015-08-26 18:52:03 +01:00
Martin Konicek 9ffbfaeb35 [ReactNative] Disable flaky Obj-C test 2015-08-26 09:34:03 -08:00
Martin Konicek 6d78b75a10 Update CONTRIBUTING.md 2015-08-26 17:04:53 +01:00
Martin Konicek a0c3b426de Update react-native-cli/CONTRIBUTING.md 2015-08-26 16:35:03 +01:00
Martin Konicek 9576657b57 Update react-native-cli/CONTRIBUTING.md 2015-08-26 16:04:48 +01:00
Martin Konicek dd9bbb4bca Update react-native-cli/CONTRIBUTING.md 2015-08-26 16:02:43 +01:00
Andrei Coman f2da308928 [ReactNative] Add unimplemented views for some components 2015-08-26 05:47:12 -08:00
Martin Konicek 57adecc36e Merge pull request #2443 from mkonicek/Updates_Wed_26_Aug
Updates from Wed 26 Aug
2015-08-26 14:23:12 +01:00
Martin Konicek 5526533f51 Updates from Wed 26 Aug 2015-08-26 14:04:01 +01:00
Felix Oghină 626f828d54 [reactnative] remove platform option from oss packager 2015-08-26 04:49:41 -08:00
Andrei Coman a8f11d7115 [ReactNative] Add TouchableNativeFeedback to OSS 2015-08-26 01:31:52 -08:00
Amjad Masad 074069e465 [react-packager] Cleanup socket interface code 2015-08-25 17:36:08 -08:00
Amjad Masad 2b7dd4650f [react-native] bump create server timeout 2015-08-25 17:13:13 -08:00
Andy Street 162d12cfa4 [ReactNative][SyncDiff] Allow renderToHardwareTextureAndroid to be used outside of setNativeProps 2015-08-25 16:55:51 -08:00
Andy Street 504fa60168 [ReactNative][SyncDiff] AutoSync 2015-08-25 14:54:10 -08:00
Martin Konicek 0203f87ea3 Add chalk mock 2015-08-25 22:02:19 +01:00
Martin Konicek 2f6e7336cb Merge pull request #2435 from mkonicek/Updates_Tue_25_Aug_trois
Updates from Tuesday 25 August

JS test failure fix will follow.
2015-08-25 19:58:36 +01:00
Martin Konicek 19f922aa80 [cli] Fix iOS app template 2015-08-25 19:25:17 +01:00
Martin Konicek 480b5c9e2e [website] Fix website generation 2015-08-25 19:23:41 +01:00
Martin Konicek da7ac11c53 Updates from Tue 25 Aug 2015-08-25 19:21:59 +01:00
Martin Konicek 4f87ec5ce7 [ReactNative] Unbreak OSS packager JS tests 2015-08-25 10:18:39 -08:00
chirag04 47d33eab8a add some apps using rn 2015-08-25 14:14:21 -04:00
Natansh Verma 8d65367fbc Revert "[packager] Unbreak Bundler test" 2015-08-25 09:53:45 -08:00
Amjad Masad 54026024cc [react-packager] Expose a socket interface
Summary:
Buck (our build system) currently starts multiple packager instances for each target and may build multiple targets in parallel. This means we're paying startup costs and are duplicating the work. This enables us to start one instance of the packager and connect to it via socket to do all the work that needs to be done.

The way this is structured:

1. SocketServer: A server that listens on a socket path that is generated based on the server options
2. SocketClient: Interfaces with the server and exposes the operations that we support as methods
3. SocketInterface: Integration point and responsible for forking off the server
2015-08-25 09:37:08 -08:00
Alexey Lang 2d2252cd50 Use native initialAppState to init app_state for AppStateIOS. 2015-08-25 09:32:28 -08:00
Martin Konicek 245a5b8e8c [packager] Unbreak Bundler test 2015-08-25 09:24:42 -08:00
Matt Mahoney 36c1064033 [rn] Pass props when creating a view in RCTViewManager 2015-08-25 08:08:17 -08:00
Krzysztof Magiera 27a67c2434 [ReactNative] Respect --assets-dest in "download from server" mode 2015-08-25 07:22:05 -08:00
Martin Konicek 5f8c0613fe [ReactNative] Temporarily disable flow in TabBarItemIOS 2015-08-25 07:16:35 -08:00
Nick Lockwood 8497b5a66f Fixed tab bar snapshot test 2015-08-25 06:36:43 -08:00
Nick Lockwood 65a3c07cfe Fixed tab bar icon scale
Summary:
TabBarItemIOS supports setting the scale for base64-encoded images using an optional scale parameter, however this was broken due to the JS code only passing the uri, not the whole source object, to the native side.

(See: https://github.com/facebook/react-native/issues/2413)
2015-08-25 05:26:14 -08:00
Pieter De Baets 371aeceb72 Small perf improvement to RCTPerfStats and RCTBridgeModuleNameForClass 2015-08-25 04:48:39 -08:00
Nick Lockwood 072390ec5c Fixed SampleAppTests 2015-08-25 04:41:12 -08:00
Alex Akers 9aefd6bd6e Add keyboard-observing notifications 2015-08-25 03:49:13 -08:00
Tadeu Zagallo fe0143eb20 [ReactNative] Update JS profiler to be compatible with Android
Summary:
Use nativeTraceBeginSection and nativeTraceEndSection with a more dynamic signature
to be compatible with Android.
2015-08-25 02:25:29 -08:00
Nick Lockwood 4382c0e8f4 Fixed redbox rotation
Summary:
Added autoresizing constraints to the redbox layout so that it resizes correctly when the screen is rotated.
2015-08-25 02:20:26 -08:00
Nick Lockwood 88e0bbc469 Ran Convert > To Modern Objective C Syntax 2015-08-25 01:08:49 -08:00
Jing Chen a57353b2b4 [react-native] Make flow warn on timeout instead of redbox 2015-08-24 19:51:14 -08:00
Ben Alpert 75df3b537a Don't report failures to npm
Summary:
This suppresses this output from npm:

```
npm ERR! Failed at the react-native@0.9.0 start script './packager/packager.sh'.
npm ERR! This is most likely a problem with the react-native package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     ./packager/packager.sh
npm ERR! You can get their info via:
npm ERR!     npm owner ls react-native
```

We don't seem to have any automated scripts that rely on the exit code of npm start (or even call it at all).
Closes https://github.com/facebook/react-native/pull/2415
Github Author: Ben Alpert <balpert@fb.com>
2015-08-24 19:32:27 -08:00
Martín Bigio 9ba4697f02 [react-packager] Fix OSS tests 2015-08-24 18:49:05 -08:00
Amjad Masad a008704b51 [react-packager] Add bser to be used in a socket server implementation 2015-08-24 17:04:32 -08:00
Amjad Masad eb248e0b58 [react-packager] Implement transformer progress bar
Summary:
The transform step in currently the longest one in the bundling process. This adds a progress bar to track the transform progress.

{F23096660}
2015-08-24 16:09:34 -08:00
Amjad Masad 8c5626cd87 [react-packager] check in the progress module 2015-08-24 16:09:33 -08:00
Justin Spahr-Summers 94671df753 [JSCLegacyProfiler] Use generic iOS SDK instead of pinning to 8.3
Summary:
The path to the iOS 8.3 SDK does not exist when only Xcode 6.4 is installed. This uses a more general folder name, which (at least) the 8.4 SDK symlinks to.

I haven't verified this on Xcode 6.3, so I'd appreciate it if someone could confirm that this path exists there too! :)
2015-08-24 13:42:34 -08:00
Martin Konicek bb708769d4 [ReactNative] Fix sample apps 2015-08-24 11:48:10 -08:00
Andrei Coman ed0ca71be0 [SyncDiff] [react_native] Revamp text input example for oss 2015-08-22 14:23:30 -08:00
Andrei Coman 127b3292c1 [SyncDiff] [react_native] Add more oss examples 2015-08-22 03:34:33 -08:00
Andrei Coman 8cc7f7f99a [SyncDiff] [react_native] Add toolbar example to oss 2015-08-22 02:14:38 -08:00
Tim Yung af8a6a44b2 RN: Expose React.unstable_batchedUpdates
Summary:
Per @spicyj in facebook/relay#127, this exposes `unstable_batchedUpdates` in React Native the same way it is exposed in `ReactDOM`.
2015-08-21 15:24:56 -08:00
Christopher Chedeau 4b420cc095 Merge pull request #2399 from ide/nvm
[Travis] Put $PWD in front of nvm  (fixes npm install)
2015-08-21 14:58:19 -07:00
Andrei Coman 52abc759ff [SyncDiff] [react_native] Add TextExample to UIExplorer 2015-08-21 14:34:46 -07:00
Christopher Chedeau f3a165db4f [Logs] Name fs step
Summary:
There are two fs steps and it wasn't clear why. This now puts the right label:

```
[9:38:25 PM] <START> Building in-memory fs for JavaScript
[9:38:27 PM] <END>   Building in-memory fs for JavaScript (2030ms)
[9:38:27 PM] <START> Building in-memory fs for Assets
[9:38:27 PM] <END>   Building in-memory fs for Assets (615ms)
```
2015-08-21 14:29:05 -07:00
Pieter De Baets eab390aecb Cleanup bridge init, measure native module init time 2015-08-21 12:32:25 -07:00
James Ide f8f68176d5 [Travis] Put $PWD in front of nvm (fixes npm install)
There was a problem where NVM_DIR wasn't correctly configured, which meant that `npm install` was using whatever version of Node was on the system (0.12 in this case) despite having run `nvm use iojs-v2`. Fixing up NVM_DIR fixes the `npm install` errors and builds the native npm packages for the right version of Node.
2015-08-21 11:37:11 -07:00
Alex Kotliarskyi 8d07df4a22 [ReactNative] Unbreak debugger 2015-08-21 11:20:17 -07:00
Alexey Lang 3643c127a8 Fix fuzziness images in UIExplorer <Image> sample. 2015-08-21 10:58:47 -07:00
Martin Bigio 677f96c60e [react-packager] unbreak tests 2015-08-21 09:38:37 -07:00
Martín Bigio 320a9207f4 [react-packager] Avoid referring Module like objects in BundlesLayout
Summary:
The `BundlesLayout` will be used as a persistent index. As such, it would be easier to avoid having dependencies to `Module`, `Package`, `Asset`, etc. We're not using that information for now and if we happen to need to use it we could always fetch it using the `ModuleCache`.
2015-08-21 08:13:58 -07:00
Martin Konicek 934e7b9afd [ReactNative][oss] Make package.json in consistent with github 2015-08-21 08:09:21 -07:00
Martín Bigio d2f82b1dfd [react-packager] Move async dependencies to System.import
Summary:
We've decided to move the syntax for asynchronously requiring async dependencies. The new syntax works better with promises and therefore withe async/await as well. The new syntax looks like this: `System.import('moduleA').then(moduleA => {...});` or if you're using async/await you could simply do:
  let moduleA = await System.import('moduleA');
  new moduleA().someFunction();

If you need to require multiple dependencies just do:
  Promise
    .all([System.import('moduleA'), System.import('moduleB')])
    .then((moduleA, moduleB) => {...})

or the equivalent using async/await
2015-08-21 07:56:19 -07:00
Dorota Kapturkiewicz f128269da7 [ReactNative] make radiobutton work with accessibility 2015-08-21 07:23:04 -07:00
Nick Lockwood c27e5198e2 Add doc comment for mainScrollView 2015-08-21 04:00:03 -07:00
Bill Fisher debca6d24f [ReactNative] Pass events through to touchable handlers
Summary:
We want to be able to access the touch data within our components' event handlers, so we need to thread the event object all the way through to them.
2015-08-21 03:03:32 -07:00
Nick Lockwood 2cd02d94ff Converted RCTRedBox to a bridge module 2015-08-21 02:53:55 -07:00
Harrison Harnisch 46c6cde947 UI CPU and memory utilization graphs in Chrome debugging mode
Summary:
Chrome debugging UI is currently only showing connection state and logs in the console, leaving room for plenty of interesting information.

I've pushed the UI (using the same convention set by FPS -- UI/JS) CPU and memory utilization data over the debug Websocket and tapped into the existing stream of JS calls that get ran in V8.

The number of JS calls in a time interval is counted for all sub calls in a batch
https://github.com/hharnisc/react-native/blob/master/packager/debugger.html#L150

The last 5 batches of JS calls are displayed in a list format.

<img width="951" alt="screen shot 2015-07-19 at 7 34 00 pm" src="https://cloud.githubusercontent.com/assets/1388079/8769257/edc42f70-2e4d-11e5-8813-e86ef530a446.png">

Charts are created with [Chart.JS](https://github.com/nnnick/Chart.js) (MIT licensed).
Closes https://github.com/facebook/react-native/pull/2050
Github Author: Harrison Harnisch <hharnisc@gmail.com>
2015-08-21 02:11:45 -07:00
Amjad Masad 6debfce374 [react-native] Update graceful-fs and use it in _build_bundle.js 2015-08-20 23:58:51 -07:00
Eric Vicenti 6f17dba39b [ReactNative] Remove POPAnimation
Summary:
Thanks to @vjeux' work on Animated, we have transitioned away from POPAnimation entirely
2015-08-20 22:24:28 -07:00
Emily Janzer 4b28a847e6 [android] fix crash if breadcrumb refs don't exist 2015-08-20 19:08:16 -07:00
Amjad Masad 3bfa90e433 [react-packager] Fix error in template string and bump timeout
Summary:
Fix error in the template string (no plus, thinks it's a function).
And bump the timeout to 30 seconds because a file is taking more than 10 seconds `js/RKJSModules/Libraries/FBComponents/FBFed/FeedStoryFragments.js`
2015-08-20 15:29:38 -07:00
Christopher Chedeau febc03a38b [Logs] Don't print flow error twice
Summary:
Flow errors are already throwing an exception in js, no need to also console.error in the packager
2015-08-20 14:05:47 -07:00
Andy Street a0168a8c62 [ReactNative] [SyncDiff] Create new non-coalesceable event for when native should take the responder lock 2015-08-20 13:56:23 -07:00
Martín Bigio c1f90c1ecf [react-packager] Integration test for runServerHere.sh 2015-08-20 12:00:06 -07:00
Spencer Ahrens 5f91d404e1 [RN] Fix Animated tests 2015-08-20 10:28:49 -07:00
Martín Bigio 5de0796126 [react-packager] Introduce bundle IDs and keep track of parent/child
Summary:
Since JS doesn't have the guarantee that once a bundle is loaded it will stay in memory (and this is something we actually don't want to enforce to keep memmory usage low), we need to keep track of parent/child relationships on the packager to pass it down to native. As part of this diff, we also introduced an ID for each bundle. The ID for a child bundle is shynthetized as the bundleID of the parent module + an index which gets incremented every time a new bundle is created. For instance given this tree:

       a,b
    c       f
  d   e       g

the ID for `d` will be `bundle.0.1.2`, the one for e will be `bundle.0.1.3` and the one for `g` will be `bundle.0.5.6`. This information will be useful to figure out which bundles need to be loaded when a `require.ensure` is re-written.
2015-08-20 10:19:09 -07:00
Dorota Kapturkiewicz ed9b8c8b3b [ReactNative] Disable accessibility of RootView when dialog appears. Apply it for AdsManager. 2015-08-20 10:16:13 -07:00
Christopher Chedeau 1ca1a44a07 [Logs] Remove already registered warning 2015-08-20 09:46:10 -07:00
Dorota Kapturkiewicz b888e8db40 [ReactNative] make sending accessibility events from JS possible and fix dialog 2015-08-20 08:41:22 -07:00
Martin Konicek 0b5952a454 [ReactNative][oss] Open source NetworkingModule 2015-08-20 07:19:34 -07:00
Alexsander Akers ee82a195f7 Set padding on ModalFullscreenView to offset status bar frame 2015-08-20 07:10:34 -07:00
Tadeu Zagallo 81fdf3e532 [ReactNative] Change RCTProfile API to be compatible with systrace 2015-08-20 00:47:23 -07:00
Christopher Chedeau 16ddb1962a [ReactNative] Remove warning for <Image source={require('./image.jpg')} />
Summary:
require('./image.jpg') returns a number and therefore the propType is wrong. Adding it to the propType to fix the warning and dealing with flow which is completely broken for this.
2015-08-19 22:53:25 -07:00
Spencer Ahrens 059e605e49 [RN] Mark some internal animated stuff as protected 2015-08-19 21:16:38 -07:00
Christopher Chedeau cf617640f3 [OpenSource] Fix 2048
Summary:
There were two issues:
(1) it was using /Users/sahrens as a path
(2) needed to remove RCTAnimationExperimental which doesn't exist anymore and add RCTWebSocket
2015-08-19 20:23:20 -07:00
Christopher Chedeau dd7945ae37 [OpenSource] Fix TicTacToe
Summary:
Needed to link RCTWebSocketManager to the project as instructed by the following issue:
https://github.com/facebook/react-native/issues/2256
2015-08-19 20:05:13 -07:00
Jing Chen cc96962e3d [react-native] Revert D2346396 to bring back JS stack traces 2015-08-19 18:07:15 -07:00
Amjad Masad ec82ffa52b [react-packger] Add a timeout on transform jobs
Summary:
There's been a case where Babel can hang indefinitely on a file parse/transform. Possibly related to https://github.com/babel/babel/issues/2211

This adds a timeout to transform jobs and throws an error informing the user of the offending file. The timeout interval defaults to 10 seconds, but can be changed via an option.
2015-08-19 17:42:28 -07:00
Alex Kotliarskyi c5c25c15ea [RN] Show only file name in RedBox 2015-08-19 17:35:25 -07:00
Amjad Masad 24689006ab [react-packager] Remove unnecessary 'chalk' module mock 2015-08-19 17:28:18 -07:00
Amjad Masad e76e60f88d [react-packager] Make the fs mock async 2015-08-19 17:17:15 -07:00
Ben Alpert 5a2d2007a4 [React Native] Fix infinite loop in css-layout
Summary:
Manual pick of https://github.com/facebook/css-layout/commit/9001a3d2 since we're still lagging behind the upstream. Fixes #1378.
2015-08-19 16:39:35 -07:00
Martin Bigio d9bd445940 Unbreak Catalyst 2015-08-19 16:25:14 -07:00
Amjad Masad b4100b8332 [react-packager] Wait for haste map before accepting any requests
Summary:
D2319999 introduced a regression where we stopped waiting for the "build haste map" step to finish before we accept any requests. This makes sure that we block on that.

Need to unbreak with this, but will follow up with a test to catch this in the future.
2015-08-19 16:17:37 -07:00
Tim Yung 966a3bbc66 RN: Style Tweaks to Chrome Debugger UI 2015-08-19 16:00:03 -07:00
Abhishek Sood 5fc2d67ee5 Revert "@build-break" 2015-08-19 15:21:16 -07:00
Abhishek Sood d64ac20119 Revert "[ReactNative] Open source NetworkingModule" 2015-08-19 15:20:09 -07:00
Ben Alpert 0f3ea9fb8c [ReactNative] Fix switching to null event listener 2015-08-19 15:02:25 -07:00
Martín Bigio f4c7bb1103 [react-packager] Fix bug on Bundles Layout algorithm
Summary:
The layout algorithm wasn't getting deep into the sync dependencies recursively to async dependencies.
2015-08-19 14:20:38 -07:00
Abhishek Sood 1aa29ceaf2 @build-break 2015-08-19 14:12:22 -07:00
Martin Konicek 9c32a7a940 [ReactNative] Prepare for putting RN Android OSS files in 2015-08-19 12:13:56 -07:00
Martin Konicek ade571065e [ReactNative] Open source NetworkingModule 2015-08-19 11:47:10 -07:00
Martin Konicek 3d0cd480d2 [ReactNative] Naming: RCTSwitch -> AndroidSwitch 2015-08-19 10:28:28 -07:00
James Ide deaef94471 [Podspec] Remove AnimationExperimental subspec and fix Image subspec
Summary:
AnimationExperimental is gone; remove it. The Image subspec now depends on the networking code, so we have to pull in those files. These changes were necessary to publish 0.10.0-rc to CocoaPods, so would be convenient to get them into master for 0.11.

Fixes #2354
Closes https://github.com/facebook/react-native/pull/2341
Github Author: James Ide <ide@jameside.com>
2015-08-19 09:59:49 -07:00
Nick Lockwood 26c4be62c8 Fixed test flakiness due to a race condition with RCTRedBox
Summary:
The test runner relied on checking the current error message in the RCTRedbox, which is a singleton (yay, shared mutable state!). This lead to some tests that worked individually but failed when run together due to error messages in RCTRedBox left over from previous tests.

I've replaced the call to -[RCTRedBox currentErrorMessage] by injecting a custom logging function to intercept the errors at source, which is a much more reliable solution.
2015-08-19 03:41:31 -07:00
Alex Kotliarskyi b18d73b568 [RN] Unbreak packager 2015-08-18 18:29:32 -07:00
Martín Bigio 291c8ff9ec [react-packager] Modernize Activity to ES6 2015-08-18 15:25:18 -07:00
Martín Bigio 51596f8674 [react-packager] Modernize AssetServer to ES6 2015-08-18 14:38:40 -07:00
Christopher Chedeau ede5fa7b39 Merge pull request #2374 from foghina/cli_contributing
[cli] add docs on how to contribute to the CLI
2015-08-18 11:22:08 -07:00
Krzysztof Magiera 67746fea2f [ReactNative] Use FbHttp for handling http requests from React Native. 2015-08-18 09:12:40 -07:00
Felix Oghină 621a2c486f [cli] add docs on how to contribute to the CLI 2015-08-18 15:56:26 +01:00
Nick Lockwood 76a9baaf2f Fixed bug where method calls containing struct arguments would fail silently
Summary:
The arg block for handling structs did not return a value, which was being intepreted as failure. This diff returns YES for success, and also adds an error log for this case so future regressions won't fail silently.
2015-08-18 07:35:26 -07:00
Felix Oghină e0e6fbfa8c Merge pull request #2373 from foghina/fix_e2e
[e2e] fix e2e tests
2015-08-18 12:10:54 +01:00
Felix Oghină 3b7bffa2a1 [e2e] fix e2e tests
* use new _flowconfig in generator template
* increase sinopia max_body_size
* remove breaking `cd` command from e2e-test.sh
2015-08-18 11:51:03 +01:00
Natthu Bharambe a4e64196bc Update GLOBAL.process instead of over-writing during initialization. 2015-08-17 16:47:10 -07:00
Ben Alpert 65692b7235 [ReactNative] Don't redbox for React warnings when not using Chrome executor 2015-08-17 16:02:10 -07:00
Nick Lockwood 8d1e02b8bd Convert alloc/init to new to please linter 2015-08-17 08:46:00 -07:00
Dorota Kapturkiewicz 869ff92dbc [ReactNative] add importantForAccessibility to accessibility sample app 2015-08-17 07:17:44 -07:00
Mike Armstrong bce7b9c638 generalise handling of uniforms and samplers 2015-08-17 07:13:17 -07:00
Pieter De Baets 65713992c4 Let native modules know when root views get added and removed 2015-08-17 07:12:06 -07:00
James Ide 12d5f0d6f4 [Views] Change rasterization scale to the main screen's scale
Summary:
`view.screen` can be nil if the view has not yet been added to the view hierarchy (e.g. new view), so we should use `[UIScreen mainScreen]` instead.

In the future, if we need to support multiple screens, one possible fix is to set the rasterization scale in didMoveToWindow/Superview. For now we have just one screen, though.
Closes https://github.com/facebook/react-native/pull/2334
Github Author: James Ide <ide@jameside.com>
2015-08-17 06:54:55 -07:00
Felix Oghină f0dd9fb358 Merge pull request #2298 from foghina/yo
[cli] convert project generation to use yeoman
2015-08-17 13:51:24 +01:00
Pieter De Baets 261f9434e5 Avoid dispatch_async in RCTRootView when bridge has already started
Summary:
There's no good reason for initialProperties to be mutable after the RCTRootView has been created. Passing it in through the constructor means we can skip one dispatch_async.
2015-08-17 05:34:25 -07:00
Ludo Fardel 8460db57bc Make flow check async 2015-08-17 03:13:16 -07:00
Amjad Masad ca38908423 [react-packager] In production resolve __DEV__ to NODE_ENV === 'development' 2015-08-15 17:07:41 -07:00
Amjad Masad 3388d8fe79 [reat-packager] Switch platform resolution based on query param
Summary:
Currently the platform selection is controlled by the blacklist. However, since we want to use the same server instance for cross-platform development, we need this to be controlled per request.

One outstanding issue, is that the DependencyGraph class wasn't designed that way and it doesn't have a per-request state. This means that with the current design race conditions is possible. If we got a request for a different platfrom while processing the previous request, we may change the outcome of the previous request.

To fix this a larger refactor is needed. I'll follow up a diff to do that.

Finally, so I don't break the universe like last time, I'll leave it up to the RN guys to update the call sites.
2015-08-15 13:28:18 -07:00
Amjad Masad 9eb5151bd2 [react-native] Set NODE_ENV and use node-env-inline plugin
Summary:
This sets NODE_ENV based on the value of the `dev` option when bundling the apps. This would then be inlined by the node-env-inline babel plugin. And finally -- if unreachable -- will be dead-code-eliminated by uglify.

This is not used in development because we set NODE_ENV to the value of __DEV__, which can be switched via a query param. However, the plugin has minimal overhead and to avoid complexity in the transformers I just enabled it by default.
2015-08-15 13:25:09 -07:00
Amjad Masad 9d96d00163 [react-native] Check in babel-plugin to inline __DEV__
Summary:
This plugin resolves __DEV__ to the value of `NODE_ENV === 'development'`. This can then be evaluated and dead code can be removed by uglifyjs.
2015-08-15 13:17:48 -07:00
James Ide 758ec76cb6 Merge pull request #2340 from chentsulin/patch-1
Add npm version badge
2015-08-14 20:55:09 -07:00
C. T. Lin 05b17a811e Add npm version badge 2015-08-15 11:42:33 +08:00
Christoph Pojer 5786a05e9e Merge pull request #2339 from ide/jest
[jest] Update jest-cli version to 0.5
2015-08-14 16:13:33 -07:00
Alex Kotliarskyi 324d154cf7 [ReactNative] Add ability to listen for Packager events 2015-08-14 14:28:45 -08:00
James Ide 5153ce0a03 [jest] Update jest-cli version to 0.5
npm install will get a little nicer since it can read from npm instead of always having to redownload from github.
2015-08-14 14:49:37 -07:00
Martín Bigio 3be2b1d966 [react-packager] Modernize Server to ES6 2015-08-14 12:34:23 -08:00
Martín Bigio 0623371814 [react-packager] Cache in which bundle is each module
Summary:
Not that at the moment a module can be present in multiple bundles, so the new API will return only one of them. In the near future we'll impose the invariant that a module can only be present in a single bundle so this API will return the exact bundle in which it is.
2015-08-14 12:30:30 -08:00
Martín Bigio 76e37c4423 [react-packager] Modernize Server-test by using ES6 features 2015-08-14 12:23:02 -08:00
Amjad Masad 8bd1cb8cce [react-native] Add babel-plugin-node-env-inline plugin
Summary:
Check in the `process.env.NODE_ENV` inline plugin. This will be used in conjuction with uglifyjs to eliminate dead code resulting from environment checks.
2015-08-14 10:46:05 -08:00
chirag04 3123f05f3b showcase link on React-native website 2015-08-14 14:34:02 -04:00
Alexsander Akers 91c8362176 Rename RCTReachability to RCTNetInfo 2015-08-14 08:20:01 -08:00
Nick Lockwood decf35c271 Fixed log prefixes to provide more context for prop binding errors 2015-08-14 08:01:34 -08:00
Nick Lockwood 3f5fcadbd5 Fix null values in network requests 2015-08-14 05:16:02 -08:00
Alexsander Akers 96277ca3f5 Add HSL/HSLA support 2015-08-14 04:48:20 -08:00
Alexsander Akers 0f14933948 Enable transparent modal presentation with <Modal />
Summary:
Enable transparent modal backgrounds using `UIModalPresentationCustom` modal presentation style.
2015-08-14 04:47:12 -08:00
Alexsander Akers dc01ecbc98 Remove now useless comment 2015-08-14 04:46:26 -08:00
Alex Akers 5c0805b071 Fix failing UIExplorer test (after isValid removal) 2015-08-14 04:27:27 -08:00
Dorota Kapturkiewicz a2c51b3b28 [ReactNative] expose importantForAccessibility to JS 2015-08-14 03:28:22 -08:00
Andrei Coman e9735556f6 [ReactNative] Sync [react_native] Fix keyboard behavior for android 2015-08-14 02:58:37 -08:00
Pieter De Baets fa07736ee1 Remove isValid from RCTInvalidating
Summary:
We only actually use it on RCTBridge and RCTJavaScriptExecutor, so add it to these interfaces explicitly
2015-08-14 01:57:18 -08:00
Zack Gomez f5d68f6ecb [ReactNative] Fix pixel rounding
Summary:
Too many rounds, we only want/need one.
2015-08-13 18:04:49 -08:00
Amjad Masad bc28a35bda [react-packager] Use module objects across the codebase (rid of getPlainObject etc)
Summary:
Instead of using plain objects and having to convert to and from them we just use the `Module` class across the codebase.
This seems cleaner and can enforce the type as opposed to fuzzy objects.
2015-08-13 15:52:31 -08:00
Amjad Masad 7bfc1baf7f [react-packager] Upgrade uglifyjs for Max call stack bug
Summary:
We're hitting an issue with large code size and `Maximum call stack size exceeded` error. https://github.com/mishoo/UglifyJS2/issues/414
We're seeing on inconsistently failing on landcastle.
2015-08-13 14:35:13 -08:00
Amjad Masad abce124198 [react-packager] Remove horribly outdated example_project
Summary:
Removes some old unused code.
2015-08-13 13:02:52 -08:00
Martín Bigio 5cad2e9370 [react-packager] Introduce Bundler
Summary:
Introduce a Bundler capable of generating the layout of modules for a given entry point. The current algorithm is the most trivial we could come up with: (1)it puts all the sync dependencies into the same bundle and (2) each group of async  dependencies with all their dependencies into a separate bundle. For async dependencies we do this recursivelly, meaning that async dependencies could have async dependencies which will end up on separate bundles as well.

The output of of the layout is an array of bundles. Each bundle is just an array for now with the dependencies in the order the requires where processed. Using this information we should be able to generate the actual bundles by using the `/path/to/entry/point.bundle` endpoint. We might change the structure of this json in the future, for instance to account for parent/child bundles relationships.

The next step will be to improve this algorithm to avoid repeating quite a bit dependencies across bundles.
2015-08-13 12:57:55 -08:00
Pieter De Baets c084793e91 Fix ModalFullScreenView's window not dismissing after being removed 2015-08-13 08:55:40 -08:00
Martino Luca 41a88c3eb1 Fixing typos in imports 2015-08-13 08:36:06 -08:00
Alex Akers f552495e7f Fix NavigatorIOS freeze when pushing before initialization completes
Summary:
This freezes the app in the UIExplorer because we try to push a new view controller onto the screen before the navigator finishes loading. This was exacerbated by @tadeuzagallo's diff that made the loading even faster. Hehe
2015-08-13 08:24:24 -08:00
Nick Lockwood 7232b1bbc7 Fixed image clipping / resizing logic 2015-08-13 08:13:55 -08:00
Alex Akers 672b77f355 Perform clip update on RCTScrollView in increments of 50 pt
Summary:
This diff removes calls to `-updateClippedSubviews` by only re-clipping when the scroll view moves by a certain number of pixels.

leeway = 50pt => 46.9% of calls removed
leeway = 10pt => 13.2% " " "
2015-08-13 07:56:41 -08:00
Tadeu Zagallo c9f5d229db Merge pull request #2323 from tadeuzagallo/Updates_Thu_13_Aug
Updates thu 13 aug
2015-08-13 14:50:09 +01:00
Tadeu Zagallo 12492d8d94 [ReactNative][Travis] Attempt to fix tests 2015-08-13 14:39:01 +01:00
Tadeu Zagallo b9dc29bcb3 [ReactNative] Fix SampleApp xcodeproj configuration
Summary:
Make SampleApp scheme shared.
2015-08-13 05:29:28 -08:00
Tadeu Zagallo eeb0adca43 [ReactNative][Website] Move bluebird to depencies instead of devDependencies 2015-08-13 14:10:56 +01:00
Tadeu Zagallo 28fb229266 [ReactNative] Fix e2e tests 2015-08-13 13:50:04 +01:00
Tadeu Zagallo 4daca092d2 [ReactNative][Website] Fix tests 2015-08-13 13:31:50 +01:00
Nick Lockwood 0487c55c25 Removed unnecessary overhead in RCTConvert functions 2015-08-13 04:08:17 -08:00
Nick Lockwood 1d072076db Reduce +[UIImage imageNamed:] overhead 2015-08-13 03:33:04 -08:00
Amjad Masad 7750db05e6 [react-packager] Set a lifetime on workers to avoid memory leaks 2015-08-12 19:26:26 -08:00
James Ide 08d1bc8c9f [TextInput] Fix multiline TextInput so text and cursor stay in bounds
Summary:
With a multiline TextInput, the text is initially rendered correctly but once you try to edit it, the cursor slides off the top of the view and out of its bounds. Also if the TextInput is scrollable, you can scroll the text out of the bounds of the view, which looks buggy unless you clip the overflow. This occurs because the top content inset is applied to the RCTTextView instead of the UITextView's text container.

This diff fixes both bugs by applying the vertical insets to the UITextView's textContainerInset instead of the RCTTextView's frame (which is a wrapper around a real UITextView).

The left inset is still applied to the frame because there is a bug with the text rendering when the left textContainerInset is negative: the initial text doesn't show up until you focus the text view. The bug doesn't occur when setting the right textContainerInset, so I apply this workaround to only the left inset.

Closes https://github.com/facebook/react-native/pull/2297
Github Author: James Ide <ide@jameside.com>
2015-08-12 14:50:42 -08:00
Martín Bigio cfcf604b3d [react-packager] Introduce require.ensure
Summary:
This is the first step to add support for splitting the JS bundle into multiple ones. This diff adds support for keeping track of the async dependencies each module has. To do so we introduce the following syntax:

  require.ensure(['dep1', 'dep2, ..., 'depN'], callback);

Where the callback function is asynchronously invoked once all the indicated modules are loaded.

Internally, the packager keeps track of every set of async dependencies a module has. So for instance if a module looks like this:
  require.ensure(['dep1'], () => {...});
  require.ensure(['dep2'], () => {...});

the `Module` object will keep track of each set of dependencies separately (because we might want to put them on separate bundles).
2015-08-12 12:23:42 -08:00
Amjad Masad 309326db2e [react-packager] Rename 'Package' to 'Bundle'
Summary:
The word Package is overloaded, it may mean npm package, or may mean a collection of bundles. Neither is what we mean. We mean `bundle`.

This renames it and modernize some of the Bundler code.
2015-08-12 12:09:01 -08:00
Martin Konicek c483db1b88 [ReactNative] Open source ProgressBarAndroid, remove example from the RN launcher 2015-08-12 12:02:17 -08:00
James Ide abdd0e09b3 [npm] Upgrade to stacktrace-parser 0.1.2, which supports io.js
Summary:
stacktrace-parser used to list only Node 0.10 under its list of supported engines. This new version includes Node 1.x and 2.x (i.e. io.js) as well, which addresses the warning during `npm install`.

There's no problem with using the older version of stacktrace-parser; this just clears the warning.

Closes https://github.com/facebook/react-native/pull/1738
Github Author: James Ide <ide@jameside.com>
2015-08-12 11:12:59 -08:00
Nick Lockwood a86e6b76fb Fixed fuzzer app and ensured that React does not crash when fuzzed 2015-08-12 06:14:36 -08:00
Felix Oghină f83675d191 [cli] convert project generation to use yeoman 2015-08-12 12:04:27 +01:00
Nick Lockwood 39230000de Fix ReactART 2015-08-11 22:44:45 -08:00
Alex Kotliarskyi 1e1efce69b Add .watchmanconfig
Summary:
This file tells watchman to watch this folder if "root_restrict_files"
is turned on.

Fixes #2042
Closes https://github.com/facebook/react-native/pull/2263
Github Author: Alex Kotliarskyi <alex.frantic@gmail.com>
2015-08-11 16:39:49 -08:00
Martín Bigio 70624dc347 [react-packager] Fix Cache-test 2015-08-11 11:27:15 -08:00
Chace Liang eb402d8c7d [e2e] Fix TouchableHighlight in e2e test 2015-08-11 10:53:50 -08:00
Christopher Chedeau 5ebe0ed717 Bust jest caching and fix tests 2015-08-11 11:02:19 -07:00
Nick Lockwood a5e9f83a0a Implemented lazy parsing of method signatures to improve TTI 2015-08-11 08:49:13 -08:00
Adam Roth 57a6a02dff [CameraRoll] Image orientation fix for #1845
Summary:
PR for #1845

Use ALAssetOrientationUp for image orientation.

Originally committed at https://github.com/facebook/react-native/commit/b34a85f4da87c62656ca9d29c5085a46e768d147
Closes https://github.com/facebook/react-native/pull/2214
Github Author: Adam Roth <adamjroth@gmail.com>
2015-08-11 08:44:57 -08:00
Christopher Chedeau 0d636a017d Updates from Tue 11 Aug 2015-08-11 08:42:07 -07:00
Nick Lockwood 4d817245f7 Fix crash when using alert() polyfill due to null callback 2015-08-11 07:31:19 -08:00
Tadeu Zagallo e2d9ddce4c [ReactNative] Fix cast warning in RCTProfile
Summary:
Buck is more strict than our current xcodeproj configuration is keeps warning
about this implicit cast, it's quite annoying.
2015-08-11 06:49:39 -08:00
Nick Lockwood 48af214216 Simplified event registration
Summary:
Our events all follow a common pattern, so there's no good reason why the configuration should be so verbose. This diff eliminates that redundancy, and gives us the freedom to simplify the underlying mechanism in future without further churning the call sites.
2015-08-11 06:41:04 -08:00
Yusef Napora 2fe1ac2a83 [Image] Fix invalid CGContext when one dimension of destination Image size == 0
Summary:
Addresses #1534

When an image has a known width, but a height of 0 (which can happen if `flex: 1` is set on the `Image` element), `RCTDownloadManager` attempts to scale it to an invalid size, which results in a `NULL` `CGContextRef` and some scary warnings from UIKit:

```
 <Error>: CGContextTranslateCTM: invalid context 0x0. This is a serious error. This application, or a library it uses, is using an invalid context  and is thereby contributing to an overall degradation of system stability and reliability. This notice is a courtesy: please fix this problem. It will become a fatal error in an upcoming update.
```

This adds a check for zero width or height to the `RCTClipRect` function.  If either dimension is zero, it is calculated based on the aspect ratio of the source image.  This ensures that we don't try to create an invalid `CGContextRef`, and that images with an unknown dimension are still scaled, blended, etc.
Closes https://github.com/facebook/react-native/pull/2278
Github Author: Yusef Napora <yusef@napora.org>
2015-08-11 06:30:34 -08:00
Tom Hastjarjanto 2424a215e0 [Image] Fix default Image functionality
Summary:
In the latest 0.9.0-rc of React Native, the default image won't load due to a typo and a missing condition in `setImage`. This PR contains fixes for both of them.
Closes https://github.com/facebook/react-native/pull/2269
Github Author: Tom Hastjarjanto <tom@intellicode.nl>
2015-08-11 05:19:04 -08:00
Nick Lockwood f5d8e4d6e0 Fixed a strongSelf that was accidentally marked as __weak 2015-08-11 04:46:56 -08:00
Nick Lockwood 68f1a223fb Fixed bug when updaing props for RCTNetworkImageView 2015-08-11 04:19:28 -08:00
Evan Solomon 51ccdfa36a [Babel] Upgrade babel and regenerator to the latest version
Summary:
See https://github.com/babel/babel/commit/c0fd4c1f9e0b18231f585c4fa793e4cb0e01aed1
Closes https://github.com/facebook/react-native/pull/1753
Github Author: Evan Solomon <evan@evanalyze.com>

@allow-crlf-text
2015-08-10 20:37:39 -08:00
Dave Sibiski e163df3567 Adds process.env.NODE_ENV polyfill
Summary:
There are many libraries that use `NODE_ENV` to check whether the code is running in
"production" mode or not. This allows those library authors to not have to add conditionals
for React Native.

One such library is Redux: https://github.com/gaearon/react-redux/pull/40

Thanks to @brentvatne for providing the solution via this tweet (via his phone in the airport 😉): https://twitter.com/notbrent/status/630440250951749632

/cc @vjeux @gaearon @zpao @amasad
Closes https://github.com/facebook/react-native/pull/2279
Github Author: Dave Sibiski <dsibiski@gmail.com>
2015-08-10 19:51:05 -08:00
Martín Bigio a303a42e28 [react-packager] Add more granular Activity logging 2015-08-10 16:25:04 -08:00
Martín Bigio 2afeb8fbe6 [react-packager] Promote Cache to top level
Summary:
The cache is only used for JSTransformer at the moment. We're doing IO and some computation to get each module's name, whether is a haste or node module and it's dependencies. This work happens on startup so by caching this value we shouldbe able to reduce the start up time. Lets promote the Cache to the Packager level to be able to use it by any of the components of the packager. For now, on this diff we'll start using it to cache the mentioned fields.

Also we had to introduce the concept of fields in the cache as manually merging the date we had for each path is not possible as we're using promisses all around. With the new API, each field is a promise.

@amasad and I did some manual testing to measure the impact of this change and looks like it's saves 1 second when building the haste map (which represents 50% of the time). Overall this reduces 1 second of start up time which was currently about 8s on my mac book pro.
2015-08-10 16:25:03 -08:00
Christopher Chedeau 56059e92df Merge pull request #2288 from ide/iojs-docs
[docs] remove instructions to install node/io.js with brew
2015-08-10 15:46:36 -07:00
Nick Lockwood 5d20b9065d Fix RKHTTPRequestHandler crash 2015-08-10 13:46:47 -08:00
James Ide fd4e75644f [docs] remove instructions to install node/io.js with brew
nvm is way better than homebrew for managing node installations:

 - can install multiple versions
 - can choose which version of node to install
 - easy to clean up under ~/.nvm
 - there are still some rough edges with /usr/local on El Cap -- nvm avoids those altogether
2015-08-10 14:31:48 -07:00
Nick Lockwood 6e2e02ab08 Merge pull request #2281 from jacob-israel-turner/patch-2
Grammar
2015-08-10 22:00:03 +01:00
Nick Tuckett f309540f69 [react_native] JS files from D2327386: Simplified unimplemented SliderIOS on Android 2015-08-10 08:33:39 -08:00
Nick Lockwood b489c9aa43 Fixed perf issue due to use of regex in +[RCTConvert NSURL:] 2015-08-10 07:13:36 -08:00
Jacob Turner 5b5cadeb30 Grammar 2015-08-10 14:34:27 +01:00
Dorota Kapturkiewicz 59b974eafb [ReactNative] make AdsManager floater and TouchableHighlight accessible 2015-08-10 04:41:09 -08:00
Christopher Chedeau 50d5f86bf8 Merge pull request #2273 from vjeux/fix_az
[Website] Fix a-z order in props
2015-08-08 10:28:39 -07:00
Christopher Chedeau c1a0a72275 [Website] Fix a-z order in props 2015-08-08 10:28:05 -07:00
Nick Lockwood 94caefa9c2 Converted RCTDevLoadingView to a module and fixed url display when using delegate 2015-08-08 03:31:49 -08:00
Nick Lockwood b82ac9bf07 Reverted to pre-init of queues to fix UIExplorer tests. 2015-08-08 01:47:43 -08:00
Alex Kotliarskyi e21fb91786 [ReactNative] Show banner promoting DevTools
Summary:
When React DevTools is not installed, React prints a tiny warning to the console.
However, in debugger.html we have a lot of free space we could use to promote
React DevTools more actively.
2015-08-07 15:23:22 -08:00
Philipp von Weitershausen 0f5190e9f3 [React Native] Provide a way to get a list of registered apps in AppRegistry 2015-08-07 11:05:25 -08:00
Tadeu Zagallo 331e4a96e9 [ReactNative] Preload ModuleData queue
Summary:
The module's methodQueue wasn't being created when accessing the modules directly
on the bridge, without going through JS. Preload the queue for now to fix internal
breakages, but I'll figure out a better way to keep it lazy afterwards.
2015-08-07 11:05:09 -08:00
Ben Alpert 2d66e10ec4 [ReactNative] Delay sending touches to JS until dependent (native) gesture recognizers fail
Summary:
Previously, JS touches were being interpreted simultaneously with native gesture recognizers.
2015-08-07 10:56:26 -08:00
Alexander Kotliarskyi 3aec8ee72d Merge pull request #2267 from frantic/hide-npm-output
Hide npm output when doing react-native init
2015-08-07 11:37:49 -07:00
Felix Oghină 205a2c0bfc [react_native] JS files from D2318945: Implement a slider for React Native Android 2015-08-07 10:15:52 -08:00
Alex Kotliarskyi 2ddf3d942d Hide npm output when doing react-native init 2015-08-07 10:59:59 -07:00
Christopher Chedeau a91f44d7fd Merge pull request #2264 from vjeux/platform_props
[Website] Platform-specific props
2015-08-07 10:39:04 -07:00
Christopher Chedeau 6e9ceaa348 [Website] Platform-specific props
We are annotating platform-specific props with a special @platform tag in the docblocks. This pull request adds a little [ios] tag before the name and sorts the props such as generic ones are before platform-specific ones.
2015-08-07 10:31:07 -07:00
Tadeu Zagallo 6cd0709bc0 [ReactNative] Parellelise bridge startup
Summary:
Parallelise the bridge startup so we don't keep waiting for the source to load.
2015-08-07 06:48:30 -08:00
Nick Lockwood 3cef3010e6 Fix RCTAssert logic 2015-08-07 06:11:49 -08:00
Andy Street 1d452f3e4d [ReactNative] Remove testID from root view 2015-08-07 05:23:40 -08:00
Tj c933087567 CMD+R should post a refresh notification.
Summary:
For the sake of consistency, `cmd+r` should just post a refresh notification. This way other tools can also observe and react to the refresh without ugly hacks.
Closes https://github.com/facebook/react-native/pull/2175
Github Author: Tj <tfallon@mail.depaul.edu>
2015-08-07 04:39:21 -08:00
Vladislav Alexeev 9edad17a15 Use Dynamic Text Size Multipliers from Wilde in ReactNative Module 2015-08-07 03:18:20 -08:00
Nick Lockwood ffa7dbcbf1 Fixed onLayout redbox issue 2015-08-07 02:58:48 -08:00
Jason Zhekov a8211e32d2 Fix typo
Summary:
Closes https://github.com/facebook/react-native/pull/2055
Github Author: Jason Zhekov <jasssonpet@gmail.com>
2015-08-06 20:22:24 -08:00
Nick Lockwood deba13f698 Refactor RCTUIManager
Summary:
Moved the view creation & property binding logic out of RCTUIManager into a separate RCTComponentData class - this follows the pattern used with the bridge.

I've also updated the property  binding to use pre-allocated blocks for setting the values, which is more efficient than the previous system that re-contructed the selectors each time it was called. This should improve view update performance significantly.
2015-08-06 15:49:35 -08:00
James Ide 3309f6da80 Merge pull request #2252 from ide/iojs-docs
[Docs] Update setup instructions to install io.js 2.x instead of latest
2015-08-06 14:24:15 -07:00
James Ide 554f23276b [Docs] Update setup instructions to install io.js 2.x instead of latest
The ws module has not been updated to work with 3.x quite yet.
2015-08-06 14:22:45 -07:00
Martín Bigio aefdf82cdc [JSAppServer] Don't keep track of not found packages 2015-08-06 11:34:56 -08:00
Andrei Coman 327f84b967 [ReactNative] Sync [react_native] Implement TextInput editable 2015-08-06 11:07:06 -08:00
Tadeu Zagallo 48548fedbf [ReactNative] Fix RCTTextField crash on iOS7
Summary:
RCTTextField was its own delegate, that was causing a stall on the main thread,
see more here:
http://stackoverflow.com/questions/19758025/uitextfield-delegate-jumping-to-100-cpu-usage-and-crashing-upon-using-keyboard
2015-08-06 09:56:17 -08:00
Andrei Coman 0d981c06de [ReactNative] Sync [react_native] Text Input missing letters fix 2015-08-06 04:59:09 -08:00
Hedger Wang 8463625bd9 [Navigation]: Add a method to map the stack routes to an array.
Summary:
Add a method to map the stack routes to an array.
2015-08-06 02:01:59 -08:00
Thomas Aylott a6ff11f1d2 [react-packager] Fixes stack traces
Summary:
TransformErrors weren't showing stack traces, making it hard to debug problems in transformer code.
2015-08-05 12:46:30 -08:00
James Ide d4eac3ddca [RFC][Rendering] Add shouldRasterizeIOS to View components
Summary:
Exposes the `shouldRasterize` property. Fixes #1986.
Closes https://github.com/facebook/react-native/pull/2226
Github Author: James Ide <ide@jameside.com>
2015-08-04 15:37:38 -08:00
Tj d8f43105ed [ListView] Fix RCTScrollView stickyHeader touch passing.
Summary:
Point must be converted to the stickyHeader's coordinate space and then passed to the stickyHeaders hitTest:withEvent: method in order to be correctly routed to any subviews of the stickyHeader.

This resolves this [issue](https://github.com/facebook/react-native/issues/2075).
Closes https://github.com/facebook/react-native/pull/2224
Github Author: Tj <tfallon@Tjs-MBP.local>
2015-08-04 17:10:19 -08:00
Nick Lockwood f165bbaf4e Use +[RCTConvert NSURL:] everywhere instead of +[NSURL URLWithString:]
Summary:
RCTConvert's URL: method gracefully handles unescaped urls, local file urls, urls containing unicode, etc. URLWithString doesn't.
2015-08-04 16:26:16 -08:00
Hedger Wang 222594cb44 [Navigator] A method subtract to compute the diff between stack mutation.
Summary:
When mutation of a stack happens, we'd like to compute the diff of the stacks (before and after) so that
we can know which routes are removed in the new stack.

This diff adds a new method `substract` which does what we need.
2015-08-04 16:16:17 -08:00
Nick Lockwood 274769fd8c Added Unicode URL test 2015-08-04 15:37:05 -08:00
Nick Lockwood 9f81d6726c Merge pull request #2227 from harrykiselev/patch-1
Fix link to Apple Developer account registration.
2015-08-04 22:16:26 +01:00
Harry V. Kiselev 01deb0b03d Fix link to Apple Developer account registration. 2015-08-05 00:07:42 +03:00
Brent Vatne 257bbb5255 [Docs] Add newsletter to top-level header 2015-08-04 13:47:52 -07:00
Alex Akers bb883bfb61 Update offscreen image fix with window checking
Summary:
2015-08-04 08:05:12 -08:00
James Ide eab7b00cee [JSContext] Define ContextExecutor.setContextName for debugging
Summary:
Add a method that lets JS set the name of the JSContext for debugging purposes. I check `JSGlobalContextSetName` since it is not available on iOS 7.

Closes https://github.com/facebook/react-native/pull/2144
Github Author: James Ide <ide@jameside.com>
2015-08-04 06:08:14 -08:00
James Ide 47e1d1aef8 [Async] Enable async/await and update UIExplorer and tests
Summary:
- Enables async/await in .babelrc and transformer.js
- Adds regenerator to package.json. Users still need to explicitly require the regenerator runtime -- this is so that you only pay for what you use.
- Update AsyncStorage examples in UIExplorer to use async/await
- Update promise tests in UIExplorer to use async/await in addition to the promise API

Closes https://github.com/facebook/react-native/pull/1765
Github Author: James Ide <ide@jameside.com>
2015-08-04 05:35:13 -08:00
Amjad Masad 18452940f0 [react-packager] Add support for platform in the resolver
Summary:
Teach the resolver about platform-based resolution. The platform extension is inferred from the entry point.
It works for haste modules, as well as node-based resolution.
2015-08-03 18:29:20 -08:00
Christopher Chedeau afdeefc864 [Animated] Remove rebound dependency
Summary:
We already reimplement the spring computation, we were only using rebound for the tension/friction conversion. Turns out that it is quite small so we can just embed it. I'm doing this as I'm preparing for doing a web version of the feature and I'm trying to minimize the number of dependencies.

https://github.com/facebook/rebound-js/blob/master/rebound.js#L932
2015-08-03 15:24:40 -08:00
Nick Lockwood 6a4b83c16f Fixed retain cycle that caused RCTModuleMethods to leak
Summary:
Some of the log statements inside argument blocks in RCTModuleMethod were directly accessing ivars, thereby causing a retain cycle that retained the class. I've fixed this by making the access explicit via weakSelf.
2015-08-03 08:46:52 -08:00
Martin Konicek c63992437b [ReactNative] LayoutAnimation docs
Summary:
Improve https://facebook.github.io/react-native/docs/layoutanimation.html
2015-08-03 07:52:31 -08:00
=?UTF-8?q?=E9=9A=90=E9=A3=8E?= 44ce9194a2 Profiling will not work if the bundleURL has no port.
Summary:
If the bundleURL has no port(default 80) , the profile request URL will be `<scheme>://<host>:<null>/profile`, that will not work. So we should decide if the port exsits first.
Closes https://github.com/facebook/react-native/pull/2131
Github Author: =?UTF-8?q?=E9=9A=90=E9=A3=8E?= <yinfeng.fcx@alibaba-inc.com>
2015-08-03 07:51:33 -08:00
Alex Akers 3e21f39a77 Remove rendered RCTText contents when moving offscreen
Summary:
When an `RCTText` instance moves offscreen (possibly due to parent clipping), we unset the layer's contents until it comes onscreen again.
2015-08-03 05:43:16 -08:00
Alex Akers e9f69bc2e4 Reorganize SampleApp
Summary:
2015-08-03 03:32:03 -08:00
Dorota Kapturkiewicz e3ed572c01 [ReactNative] accessibility test app 2015-08-03 01:42:35 -08:00
Brent Vatne e2a2472af4 Merge pull request #2194 from ide/animation-docs
[Docs] Remove sections on AnimationExperimental and Pop
2015-08-02 16:16:13 -07:00
Brent Vatne 5222be0edf [Docs] Fix typo in docs index 2015-08-02 16:14:50 -07:00
James Ide 0b5e229ed2 Merge pull request #2205 from muan/title
[Docs] Add dynamic page title
2015-08-02 15:04:03 -07:00
Mu-An Chiou 129d1548a8 Add dynamic page title
Currently all the pages have the same title, making it hard to
tell which page is while when user has multiple tabs opened.
This adds 'title' to Site so a page title can be passed in and
prepended to the default title
2015-08-02 22:07:53 +08:00
James Ide bc56eb1439 Merge pull request #2201 from threepointone/patch-1
doc typo
2015-08-01 12:34:42 -07:00
Sunil Pai 5a918227f2 doc typo
match member names
2015-08-01 23:43:29 +05:30
Nick Lockwood 95d1fd142e Fixed null argument errors for timers and layout animations 2015-08-01 06:40:27 -08:00
Philipp von Weitershausen 3e79838a31 [React Native] sync JS for D2287297 2015-07-31 21:31:46 -08:00
Kevin Gozali ee8b50c955 [ReactNative] fix up XMLHttpRequest failures 2015-07-31 21:31:45 -08:00
James Ide 4a93d23af2 [Docs] Remove sections on AnimationExperimental and Pop
AnimationExperimental has been removed and Pop has been superseded by Animated.
2015-07-31 17:17:22 -07:00
Philipp von Weitershausen d858d0c4e0 [ReactNative][Android] JS for D2294884: Allow XHR to send native files, as HTTP body or via multipart FormData 2015-07-31 15:50:49 -08:00
Brent Vatne f41663a2df [WebView] Replace RKWebView with RCTWebView in log message
Summary:
Easy merge, just a small change in log message
Closes https://github.com/facebook/react-native/pull/2061
Github Author: Brent Vatne <brentvatne@gmail.com>
2015-07-31 13:49:14 -08:00
Nick Lockwood 1fb26d4319 Cleanup 2015-07-31 11:33:22 -08:00
Krzysztof Magiera b807c51bbe [ReactNative] Fix TextInput Focus issue 2015-07-31 11:03:41 -08:00
Vladislav Alexeev 53fb5b6cee Dynamic Text Sizes for Text component
Summary:
Dynamic Text Sizes for Text component.
Text gains new prop - allowFontScaling (false by default).
There is also AccessibilityManager module that allows you to tune multipliers per each content size category.
2015-07-31 07:42:41 -08:00
Nick Lockwood 407eb4ce85 NSNumber arguments must now be nonnull
Summary:
The bridge implementation on React Android does not currently support boxed numeric/boolean types (the equivalent of NSNumber arguments on iOS), nor does Java support Objective-C's nil messaging system that transparently casts nil to zero, false, etc for primitive types.

To avoid platform incompatibilities, we now treat all primitive arguments as non-nullable rather than silently converting NSNull -> nil -> 0/false.

We also now enforce that NSNumber * objects must be explicitly marked as `nonnull` (this restriction may be lifted in future if/when Android supports boxed numbers).

Other object types are still assumed to be nullable unless specifically annotated with `nonnull`.
2015-07-31 06:57:08 -08:00
Eric Vicenti 41dd6fe6ea [ReactNative][Navigator] Fix disabled scene height change
Summary:
Disabling the scene this way would make the scene height go to zero and mess up the scroll position. By setting the bottom to the same distance, the view does not get resized and the scroll position is preserved through a scene disable cycle.
2015-07-30 12:58:45 -08:00
Christopher Chedeau b10a1549c6 Merge pull request #2179 from vjeux/fix_flow
Install flow from npm/flow-bin instead of brew
2015-07-30 13:39:22 -07:00
Christopher Chedeau c627600ef3 Try to fix flow 2015-07-30 13:24:14 -07:00
Alex Akers f2b3057a7c Fix border width precedence issue 2015-07-30 06:18:17 -08:00
Felix Oghina 90b80e375c [reactnative] add launchAndroidPackager.command 2015-07-30 03:35:29 -08:00
Tadeu Zagallo cf22111cee [ReactNative] Prevent RCTDevLoadingView from creating UIWindow on unit tests
Summary:
`RCTDevLoadingView` was being created from a constructor function and creating
a `UIWindow` when the bridge started loading. The `UIWindow` was crashing on
the unit tests since there's no host app.
2015-07-30 03:10:53 -08:00
Dorota Kapturkiewicz 8a272bc873 [ReactNative] implement accessibilityLiveRegion and accessibilityComponentType 2015-07-30 01:40:37 -08:00
Gabe Levi d8a13ec3d5 [Flow] Deploy v0.14.0 2015-07-29 20:29:44 -08:00
Philipp von Weitershausen 4bfeeaa90d [ReactNative] Improve Flow definitions and code comments in XHR FormData polyfill 2015-07-29 20:03:57 -08:00
Zack Gomez 60c8abcc70 Revert "[ReactNative] revert "prevent ScrollView content offset from changing during layout"" 2015-07-29 17:23:18 -08:00
Hedger Wang 4b16e4d550 [Navigator]: Add a method keyOf to NavigationRouteStack.
Summary:
# Summary

Add a method `keyOf` to NavigationRouteStack.

The method `keyOf` returns a key that is associated with the route.
The a route is added to a stack, the stack creats an unique key for it and
will keep the key for the route until the route is rmeoved from the stack.

The stack also passes the keys to its derived stack (the new stack created by the
mutation API such as `push`, `pop`...etc).

The key for the route persists until the initial stack and its derived stack no longer
contains this route.

# Why Do We Need This?

Navigator has needs to use an unique key to manage the scenes rendered.
The problem is that `route` itself isn't a very reliable thing to be used as the key.

Consider this example:

```
// `scene_1` animates into the viewport.
navigator.push('scene_1');

setTimeout(() => {
 // `scene_1` animates off the viewport.
 navigator.pop();
}, 100);

setTimeout(() => {
 // Should we bring in a new scene or bring back the one that was previously popped?
 navigator.push('scene_1');
}, 200);

```

Because we currently use `route` itself as a key for the scene, we'd have to block a route
until its scene is completely off the components tree even the route itself is no longer
in the stack otherwise we'd see strange animation of jumping scenes.

# What's Next

We're hoping that we can build pure reactive view for NavigationRouteStack easily.
The naive implementation of  NavigationRouteStackView may look like this:

```
class NavigationRouteStackView {
  constructor() {
    this.state = {
      staleScenes: {},
    };
  }

  componentWillReceiveProps(nextProps) {
    if (nextProps.stack !== this.props.stack) {
      var stale;
      var staleScenes = {...this.state.staleScenes};
      this.props.stack.forEach((route, index, key) => {
        if (nextProps.stack.keyOf(route) !== key) {
          stale = true;
          staleScenes[key] = {route, index, key, stale};
        }
      });
      if (stale) {
        this.setState({
          staleScenes,
        });
      }
    }
  }

  render() {
    var scenes = [];

    this.props.stack.forEach((route, index, key) => {
      scenes.push({route, index, key});
    });

    Object.keys(this.state.staleScenes).forEach(key => {
      scenes.push(this.state.staleScenes[key]);
    });

    scenes.sort(stableSortByIndex);

    return <View>{scenes.map(renderScene)}</View>;
  }
}

```
2015-07-29 16:55:21 -08:00
Christopher Chedeau fc9150c674 Merge pull request #2169 from ide/iojs-docs
[Docs] Explain more about nvm in the io.js setup docs
2015-07-29 17:40:41 -07:00
James Ide de13b59dd2 [Docs] Explain more about nvm in the io.js setup docs
Clarify that io.js is the modern version of Node and explain a little more about how to get set up with nvm, and that it lets you switch between multiple io.js/node versions.
2015-07-29 17:29:18 -07:00
Philipp von Weitershausen 37636fc59a [React Native] open source ImageEditingManager native module 2015-07-29 15:57:48 -08:00
James Ide 0f32bea634 Merge pull request #2143 from milieu/patch-1
Fix broken links in docs/Testing.md
2015-07-29 13:55:22 -07:00
Hedger Wang 809a2dc1d6 [Navigator: Prevent user from over-popping the routes.
Summary:
If user taps the back button quickly, the app crashes becuase "pop"
internally only checks `this.state.presentedIndex` which does not
always update when transtion happens.

This diff addresses this issue.
2015-07-29 11:42:34 -08:00
Jing Chen 8416691719 [events] Move start point of EventsDashboard to work with early boot 2015-07-29 10:47:13 -08:00
Pieter De Baets d6de865236 Cleanup AppRegistry types
Summary:
Found some missing/wrong types when playing around with the AppRegistry for routing work in the main app.
2015-07-29 09:55:24 -08:00
Dorota Kapturkiewicz e073fdc4c7 [ReactNative] add accessibilityComponentType 2015-07-29 09:20:23 -08:00
Felix Oghina dfa43f0ce5 [react_native] JS files from D2282690: make back button work in launcher app 2015-07-29 06:35:46 -08:00
Nick Lockwood 95b9dd3a88 Added support for method argument nullability
Summary:
This diff adds support for enforcing nullability in the arguments for exported methods.

We previously supported use of the nullable/nonnull attributes on method arguments, but didn't do anything to ensure that they were respected.

Now, if an argument is marked as nonnull, and a null value is sent for that argument, it will display a redbox.

In future, nonnull will be assumed by default, but for now we assume that un-annotated arguments can be null (to avoid breaking existing code).
2015-07-29 05:50:27 -08:00
Ben Alpert e0ea046092 [ReactNative] Fix ResponderEventPlugin after React upgrade 2015-07-29 02:47:55 -08:00
Kevin Gozali 87ce2d635b [ReactNative] revert "prevent ScrollView content offset from changing during layout" 2015-07-28 19:39:56 -08:00
Kevin Gozali f1b22e87f1 [madman] version mobile configs disk caching 2015-07-28 18:11:34 -08:00
Tadeu Zagallo 127f7095dc [ReactNative] Add RCTBridgeDelegate
Summary:
Add a new bridge delegate protocol to allow a more flexible bridge configuration.

For now it just support the pre-existent configurations + providing the JavaScript
source to the bridge, that should allow pre-loading sources.
2015-07-28 15:57:02 -08:00
Zack Gomez 068f396c9b [ReactNative] prevent ScrollView content offset from changing during layout
Summary:
-[UIScrollView setFrame:] changes the content offset, which we want to do manually.  Preserve the old offset during layout.
2015-07-28 14:36:27 -08:00
Nick Lockwood b812b0ee2e Added unit tests for RCTModuleMethod parsing, and fixed some edge cases 2015-07-28 13:07:52 -08:00
Alex Kotliarskyi e964e741ef [RN] Add loading view for development mode
Summary:
It's very useful to know where the app is being loaded from and
can help debug various issues.
2015-07-28 11:17:06 -08:00
Martin Konicek 5164aa290b Merge pull request #2138 from mkonicek/master
[docs] Make it clear which Guides are platform-specific
2015-07-28 17:42:12 +01:00
Alex Akers 7d19ff3dcb Add <Modal /> component
Summary:
Create Modal component that can be used to present content modally.
2015-07-28 07:21:50 -08:00
Tadeu Zagallo f53c95c743 [ReactNative] Proxy bundleURL on RCTBatchedBridge
Summary:
Fixes #2126

`RCTBatchedBridge` didn't implement `bundleURL`, that was available on the public
bridge interface, so it'd always be `nil`, and setting it would just be ignored.
2015-07-28 05:59:45 -08:00
Martin Konicek 7fcd85cc53 Merge pull request #2145 from facebook/404-fix
Adding 404.js to catch 404s on website
2015-07-28 14:38:26 +01:00
Matthew Johnston 7a806f6d89 Update 404.js 2015-07-28 14:34:47 +01:00
Matthew Johnston 379444515b Adding 404.js to catch 404s on website 2015-07-28 14:22:13 +01:00
Meredith Leu f502e17cc7 Fix broken links 2015-07-27 18:34:12 -07:00
Alexander Kotliarskyi 757d6d204a Merge pull request #2136 from frantic/updates-2015-07-27
Updates 2015 07 27
2015-07-27 15:10:57 -07:00
Nick Lockwood 1d852624fd Refactored RCTImageDownloader to use RCTNetworking instead of a separate download system 2015-07-27 13:47:52 -08:00
Alex Kotliarskyi 62b7920b9d More updates 2015-07-27 14:47:32 -07:00
Ben Alpert 3cff9be3d1 [ReactNative] Update project template .flowconfig 2015-07-27 13:41:55 -08:00
Bill Fisher 3b83853713 [ReactNative] fix onMoveShouldSetPanResponderCapture
Summary:
Typo in implementation prevented onMoveShouldSetPanResponderCapture from working.
2015-07-27 12:06:40 -08:00
Rui Chen 842ce51099 [Treehouse RN] Make smoothScrollTo works by not calling it twice 2015-07-27 11:25:28 -08:00
Alex Kotliarskyi 9649e7cc8d More updates 2015-07-27 12:24:01 -07:00
Alex Kotliarskyi 58a403d3c8 [ReactNative] Pin babel version
Summary:
Currently minor version babel updates add and remove transforms, but internal
version is checked in and pinned to 5.6.4. Until we figure out how to update
internal deps systematically, we need to make sure OSS edition of RN matches
internal, otherwise we get test failures due to package version mismatches.
2015-07-27 11:20:22 -08:00
Christopher Chedeau 18e6094cab [ReactNative] Add overflow to the whitelisted Image props
Summary:
For some reason we're now spamming the logs everytime we render an Image because overflow is not defined in the whitelist. overflow: 'hidden' is needed for network images with cover mode.

The way we currently define those is not optimal where we try to factor as many things as possible into distinct propTypes. However for Text we're not even using this but we are getting all the ones from View (which many do not apply) and remove some that aren't needed.

It may be useful to cleanup this in the future but in the short term, it's better to remove this warning that doesn't have much value anyway.
2015-07-27 11:06:27 -08:00
Martin Konicek 33e62f71f4 [ReactNative] CameraRoll docs
Summary:
In preparation for open sourcing React Native for Android, document which parts of the `CameraRoll` API are platform-specific.

Renders like this: http://imgur.com/rbpXHKf

We should improve docs generation for `@param`s.
2015-07-27 09:46:35 -08:00
Martin Konicek b7253dc604 [ReactNative] PixelRatio docs
Summary:
Update docs for `PixelRatio` in preparation for open sourcing React Native for Android.

See http://stackoverflow.com/questions/11581649/about-android-image-and-asset-sizes
2015-07-27 09:40:08 -08:00
Martin Konicek 01911e5e06 [docs] Make it clear which Guides are platform-specific
This is in preparation for open sourcing React Native for Android.
Also add hyphens to URLs for consistency. This can break people's
browser bookmarks but it's better to be consistent and we can
redirect to docs: https://github.com/facebook/react-native/issues/2137

Test plan: Ran the website locally using `cd website; npm start`
and checked all pages render correctly.
http://i.imgur.com/RrPNgRr.png

Will update "Getting Started", "Tutorial", "Debugging" and
"Testing" separately.
2015-07-27 18:17:54 +01:00
Nick Lockwood 09bb761b25 Fixed RCTDownloadTaskWrapper crash on iOS7
Summary:
This is a quick fix for the RCTDownloadTaskWrapper crashing on iOS 7. The issue was that the object returned by -[NSURLSession downloadTaskWithURL:] on iOS was not actually a subclass of NSURLSessionTask, so the category that adds associated blocks was not working. I've fixed that by making it a category on NSObject instead.
2015-07-27 09:02:38 -08:00
Alex Kotliarskyi 2eb401a496 Updates from 2015-07-27 2015-07-27 10:01:30 -07:00
Nick Lockwood 7996c32211 Unregistered modules will now only error when called, not on bridge init
Summary:
Occasionally people create RCTBridgeModule subclasses or base classes that are not intended to be accessed from JS, and so they don't export them. This was previously flagged as an error by the system. I've now downgraded this error to a warning at startup, and deferred the redbox error until the module is directly accessed by native or JS code.
2015-07-27 08:58:47 -08:00
Nick Lockwood 2c5290946b Converted RCTImageLoader to be a bridge module 2015-07-27 08:52:20 -08:00
Alex Akers d178e27939 Fix UIExplorer freezing / persistence 2015-07-27 08:35:34 -08:00
Nick Lockwood f9abb5aae2 Fixed missing redbox at startup
Summary:
Fixed bug where redbox errors thrown during startup would be dismissed as soon as JS loaded, so they would never be seen.
2015-07-27 07:23:08 -08:00
Nick Lockwood 0e5422f36c Fixed text highlight alignment when text has nonzero padding.
Summary:
Previously the text highlight overlay did not take padding into account in its positioning, so it would be misaligned for padded text. This fixes that.
2015-07-27 07:11:29 -08:00
Martin Konicek c3d194d1f8 [ReactNative] TextInput docs 2015-07-27 06:45:13 -08:00
Martin Konicek f69e33e6a8 [ReactNative] Text docs
Summary:
In preparation for open sourcing React Native for Android, document which Text props are platform-specific.
2015-07-27 06:38:27 -08:00
Nick Lockwood aca76c75dd Fix gzip on iOS 9 2015-07-27 01:18:40 -08:00
Spencer Ahrens f1bd1cbc94 [ReactNative] cleanup native components 2015-07-24 18:54:35 -08:00
James Ide 53222f0dda [Packager] Include Content-Type headers with bundle and source maps
Summary:
The packager did not send back the Content-Type headers. Adding these.

Closes https://github.com/facebook/react-native/pull/2029
Github Author: James Ide <ide@jameside.com>
2015-07-24 18:46:17 -08:00
Nick Lockwood 5f0317291b Switched to OSS <Text> implementation for internal apps 2015-07-24 17:30:43 -08:00
Hedger Wang ea5276ed24 [Navigator] Port navigation APIs from Navigator to NavigationContext 2015-07-24 17:10:41 -08:00
James Ide c8373d2ad6 [Chrome Debugger] Update ws dependency to 0.7.2
Summary:
ws 0.7.2 officially supports io.js

Closes https://github.com/facebook/react-native/pull/2013
Github Author: James Ide <ide@jameside.com>
2015-07-24 15:52:49 -08:00
James Ide bf7e2a85d0 [Navigator] Vertically hide disabled scenes and use pointerEvents="none"
Summary:
Hides disabled scenes using `top` instead of `left`, which fixes a bug with the native UITabBar. When the UITabBar's width is zeroed because the scene has `left: SCREEN_WIDTH, right: 0` applied, this triggers a bug with the kerning of the tab titles. Instead, zeroing the height by setting `top: SCREEN_HEIGHT` avoids the bug.

Also applies `pointerEvents="none"` to disabled scenes so that views in the off-screen scenes definitely don't receive touches, which was occurring before.

Fixes #1401, fixes #2011

Closes https://github.com/facebook/react-native/pull/2104
Github Author: James Ide <ide@jameside.com>
2015-07-24 14:45:19 -08:00
Martin Konicek d10e4dbf0f [ReactNative] Use ASCII double quotes
Summary:
We mix ASCII double quotes with left and right quotes: https://github.com/facebook/react-native/blob/master/Libraries/CustomComponents/ListView/ListView.js#L13

Let's be consistent.
2015-07-24 13:16:25 -08:00
Michael Mitchell a1612a7dd2 [ReactNative] Delete AnimationExperimental and AnimationUtils
Summary:
AnimationExperimental is deprecated and being removed in favor of the Animated library.
Refer to https://facebook.github.io/react-native/docs/animations.html for information on how to use Animated
and https://facebook.github.io/react-native/docs/animations.html#animationexperimental-deprecated for the reasoning behind this.
2015-07-24 10:29:44 -08:00
Matej Hamas 000ab1139f [ReactNative] Adding clear function to the react native TextInput component. 2015-07-24 09:46:01 -08:00
Nick Lockwood 81dd9c27ea Optimized property setting and conversion 2015-07-24 09:37:28 -08:00
Tadeu Zagallo 4499f28c1d [ReactNative] Remove wrong lock from RCTProfile
Summary:
Remove sad lock from RCTProfileForwardInvocation that was locking concurrent
calls and messing with the profiler.
2015-07-24 09:14:46 -08:00
Nick Lockwood ef5cec4f08 Text highlighting on iOS
Summary:
This diff implements highlighting of tapped text subranges for the iOS `<Text>` component, styled to match how iOS webkit views highlight links (translucent grey overlay with rounded corners).

Highlighting is enabled by default for any `<Text>` component which has an onPress handler. To disable the highlight, add `suppressHighlighting={true}` to the component props.
2015-07-24 08:41:58 -08:00
Martin Konicek 7c87952e43 [ReactNative] Image docs
Summary:
In preparation for open sourcing React Native for Android, document which Image props are platform-specific.
2015-07-24 06:21:49 -08:00
lh_wang 1b06e41c83 fix examaple TabBarIOSExample bug; show click num when user click second & third tabbar
Summary:
Closes https://github.com/facebook/react-native/pull/1522
Github Author: lh_wang <lh_wang@Ctrip.com>
2015-07-23 19:12:42 -08:00
Rui Chen accf6f12e4 Make the scrollResponderScrollNativeHandleToKeyboard works on Android 2015-07-23 18:14:43 -08:00
Ben Alpert e01f90784f [ReactNative] Update core RN modules to work with React 0.14-beta1 2015-07-23 18:07:59 -08:00
Ben Alpert 710d29efae [ReactNative] Update React to 0.14-beta1 2015-07-23 18:07:58 -08:00
Jared Forsyth 9e4af68d91 [react-native] enable react devtools from JavascriptCore 2015-07-23 17:14:09 -08:00
Mark Miyashita 10ffe170c2 [StatusBar] Add ability to toggle the network activity indicator in the status bar + example in UIExplorer
Summary:
Added the ability to turn on and off the network activity indicator using:

```
StatusBarIOS.setNetworkActivityIndicatorVisible(true)
```
and
```
StatusBarIOS.setNetworkActivityIndicatorVisible(false)
```

Also added an example to the UIExplorer example app.

Fix #986
Closes https://github.com/facebook/react-native/pull/2079
Github Author: Mark Miyashita <negativetwelve@gmail.com>
2015-07-23 16:22:56 -08:00
Christopher 3fa3963465 [MovieApp] Add key to image components inside of MovieCell.
Summary:
Closes https://github.com/facebook/react-native/pull/2065
Github Author: Christopher <hello@blick-labs.com>
2015-07-23 15:09:42 -08:00
Andrei Coman aefb3d3628 [ReactNative] Use new animation library for 2048 game demo 2015-07-23 12:36:31 -08:00
Alexander Kotliarskyi a803e3217e Merge pull request #2105 from frantic/updates-23-jul
Updates 23 jul
2015-07-23 13:21:22 -07:00
Alex Kotliarskyi 03dccfbf71 Updates from Thu, July 23 2015-07-23 13:09:48 -07:00
Daniel Brockman 064dafa618 #!/bin/bash => #!/usr/bin/env bash
Summary:
This change makes `npm start` work correctly on e.g. NixOS.
Closes https://github.com/facebook/react-native/pull/2006
Github Author: Daniel Brockman <daniel@brockman.se>
2015-07-23 11:17:22 -08:00
Andrei Coman 9c8ba9502c [react_native] Refactor UIExplorerList to fix UIExplorerApp 2015-07-23 06:58:18 -08:00
Martin Konicek 19a8eff668 [ReactNative] ScrollView docs
Summary:
In preparation for open sourcing React Native for Android, document which ScrollView props are platform-specific.
2015-07-23 06:56:46 -08:00
Nick Lockwood 9d19829742 Refactored networking logic out into RCTDownloadTask 2015-07-23 04:00:31 -08:00
Christopher Chedeau 6fea7c2846 [ReactNative] Remove all the flow errors 2015-07-22 18:11:09 -08:00
Christopher Chedeau fea2db42fd [Animated] Send a final update with toValue for spring
Summary:
Animated.spring is not guarantee to stabilize at exactly toValue (determined by restDisplacementThreshold). It is a bit annoying that the last value is not toValue, it makes the logs harder to read and also prevents you from writing code like value === toValue. Instead you need to track it down somewhere else.
2015-07-22 17:33:00 -08:00
Christopher Chedeau b34892eb80 [ReactNative][BREAKING_CHANGE] Remove cloneElement from TouchableBounce 2015-07-22 17:22:35 -08:00
Jared Forsyth e06af51cf9 [react-native] inspector + devtools, naming things 2015-07-22 16:50:32 -08:00
Spencer Ahrens a671c58189 Merge pull request #2094 from sahrens/Updates_from_thurs_July_23rd
Updates from Thursday July 23rd
2015-07-23 01:39:57 +02:00
Rui Chen 93bbc6482d Unbreak the dismissing keyboard behavior on Android 2015-07-22 15:24:42 -08:00
Spencer Ahrens bb7aa500d7 Updates from Thurs July 23rd 2015-07-23 01:16:05 +02:00
Spencer Ahrens cec5360f1b [RN] Introduce initialValue prop to fix TextInputExamples
Summary:
Some of the examples relied on the fact that TextInput wasn't a controlled
component before.  This introduces a new `initialValue` prop which behaves the
way the `value` prop used to - that is, you could type without updating it and
it wouldn't get reset, thus acting as just an initial value - and switches the
examples to use it where appropriate.
2015-07-22 14:21:16 -08:00
Tadeu Zagallo 49b55804b1 [ReactNative] Fix crash when reload during profile (attempt #2)
Summary:
Fixes #1642

When reloading during profiling, the profile wouldn't unhook from the instance
being deallocated.
2015-07-22 11:02:32 -08:00
Hedger Wang 8dd1256c25 [Navigation] Implements NavigationContextFuture 2015-07-22 10:50:51 -08:00
Hedger Wang 280347d66a [Navigator]: Add method indexOf and slice to NavigationRouteStack 2015-07-22 10:46:57 -08:00
Felix Oghina 214c47ed76 [reactnative] move .android.js files to oss 2015-07-22 08:44:07 -08:00
Brent Vatne 75b220d6ce Merge pull request #2081 from MattFoley/patch-1
Enum Constants Explanation
2015-07-21 20:57:14 -07:00
Rui Chen 4e33b801ca Allow Animated.parallel to accept empty element in the array 2015-07-21 15:32:08 -08:00
Tj 1e5f22dc9c Updating for Code Review
Using UIStatusBarAnimation for real world example
2015-07-21 18:11:58 -04:00
Eric Vicenti 35aa9f3b97 [ReactNative] Remove idStack from Navigator
Summary:
We want to transition to NavigationRouteStack, so we need to simplify and remove all uses of idStack
2015-07-21 13:25:42 -08:00
Tj 4d3c3e625e Enum Constants Explanation
Explains the use of `RCT_ENUM_CONVERTER` for using `NS_ENUM` arguments in exported functions
2015-07-21 16:46:40 -04:00
Spencer Ahrens 961c1eb429 [ReactNative] TextInput bug fixes and features
Summary:
This introduces event counts to make sure JS doesn't set out of date values on
native text inputs, which can cause dropped characters and can mess with
autocomplete, and obviates the need for the input buffering which added lag and
complexity to the component.  Made sure to test simulated super-slow JS text
event processing to make sure characters aren't dropped, as well as typing
obviously correctable words and making sure autocomplete works as expected.

TextInput is now a controlled input by default without causing any issues for
most cases, so I removed the `controlled` prop.

Fixes selection state jumping by restoring it after setting new text values, so
highlighting the middle of some text in the new ReWrite example and hitting
space will replace that selection with an underscore and keep the cursor at a
sensible position as expected, instead of jumping to the end.

Ads `maxLength` prop to support the most commonly needed syncronous behavior:
preventing the user from typing too many characters.  It can also be used to
prevent users from continuing to type after entering special characters by
changing it to the current length after a regex match.  Made sure to verify it
works well with pasted input (including in the middle of existing text),
truncating it and collapsing the selection the same way it does on the web.

Fixes bug in TextEventsExample where it wouldn't show the submit and end events,
even though there were firing correctly.
2015-07-21 12:45:07 -08:00
Eric Vicenti 4f904b5d68 [ReactNative] Remove Navigator onItemRef
Summary:
Re-landing D2229686 after fixing bugs mentioned in D2250586

onItemRef is old and no longer needed now that the parent renders the scenes. This removes it from Navigator and all of our clients.

This is a breaking change to users of Navigator, but it is easy to transition to a ref in renderScene instead
2015-07-21 09:28:29 -08:00
Alex Akers 98ab7581a5 Remove images from offscreen image views 2015-07-21 09:02:28 -08:00
Nick Lockwood 85cb35c514 Fixed rotation and scaling issues when loading ALAssets using RCTImageLoader 2015-07-21 05:32:49 -08:00
Adam Roth 9c73e2ff7a [Image] Improved loading of Assets Library and Photos Framework images.
Summary:
Update to https://github.com/facebook/react-native/pull/1969

--
Recent improvements allow RCTImageLoader to select a more appropriate sized image based on the layout dimensions. Sizes:

	- asset.thumbnail
	- asset.aspectRatioThumbnail
	- asset.defaultRepresentation.fullScreenImage
	- asset.defaultRepresentation.fullResolutionImage

Prior, only the fullResolutionImage was used. This was memory intensive and resulted in crashes when loading several large images at once. The updated implementation works well, but can be made more efficient:

Consider loading 10 8MP (3264x2448) images in 150x150 pixel containers. The target size (150x150) is larger than asset.thumbnail (approx 100x100), therefore the fullScreenImage representation is used instead (approx 1334x1000).

This commit will scale the asset to the minimum size required while taking into account original aspect ratio and device scale. Memory usage is considerably lower and many more images can be loaded in
sequence without having to worry
Closes https://github.com/facebook/react-native/pull/2008
Github Author: Adam Roth <adamjroth@gmail.com>
2015-07-21 05:32:48 -08:00
Philipp von Weitershausen 9c5fe3612d [React Native][iOS] XHR upload progress events 2015-07-20 22:48:55 -08:00
Philipp von Weitershausen 151ddd9e42 [React Native] open source ImageStoreManager native module and plug into RCTImageLoader 2015-07-20 22:48:54 -08:00
Hedger Wang 6e2f07fb81 [Navigator] Add a callback that is called after emitting an event.
Summary:
While adeveloper requests the emitter to emit an event, the emitter
may not emit the event immediately instead of putting the request
into a queue and process it later.

This diff allows the developer to provide a callback which will be called
when the event has been emitted.

For instance:

```
class NavigationContext {
  push(nextRoute) {
    var nextStack = this._stack.push(nextRoute);
    this.emit(
      'change',
      {
        reason: 'push',
        nextStack: nextStack,
        nextRoute: nextRoute,
      },
      this._onPush
    );
  }

  _onPush(event){
    if (event.defaultPrevented) {
      return;
    }
    this._stack = event.nextStack;
    this.emit('change');
  }
}
```
2015-07-20 21:49:58 -08:00
Alex Kotliarskyi 9105b22925 [RN] Remove 14 more unused node_modules 2015-07-20 20:00:27 -08:00
Alex Kotliarskyi e54e452026 [RN] Remove extra copy of stacktrace-parser 2015-07-20 20:00:19 -08:00
Alex Kotliarskyi bf7497a418 [RN] Move ws to react-native-github 2015-07-20 20:00:18 -08:00
Tadeu Zagallo 270e09d46e [ReactNative][Profiler] Fix NSProcessInfo instacrash on iOS7
Summary:
`NSProcessInfo operatingSystemVersion` was being used to check the system version
for the Legacy Profiler on `RCTContextExecutor` but it's only available on iOS8+

Change it to `[UIDevice systemVersion]`
2015-07-20 19:36:13 -08:00
Christopher Chedeau 725053acfe [Animated][BREAKING_CHANGE] Convert <TouchableOpacity> to Animated
Summary:
Because we don't want to integrate Animated inside of the core of React, we can only pass Animated.Value to styles of <Animated.View>. TouchableOpacity unfortunately used cloneElement. This means that we should have asked every single call site to replace their children to Animated.View. This isn't great.

The other solution is to stop using cloneElement and instead wrap the children inside of an <Animated.View>. This has many advantages:
- We no longer use cloneElement so we're no longer messing up with elements that are not our own.
- Refs are now working correctly for children elements
- No longer need to enforce that there's only one child and that this child is a native element

The downside is that we're introducing a <View> into the hierarchy. Sadly with CSS there is no way to have a View that doesn't affect layout. What we need to do is to remove the inner <View> and transfer all the styles to the TouchableOpacity. It is annoying but fortunately a pretty mechanical process.

I think that having a wrapper is the best solution. I will investigate to see if we can make wrappers on TouchableHighliht and TouchableWithoutFeedback as well.

**Upgrade Path:**

If the child is a View, move the style of the View to TouchableOpacity and remove the View itself.

```
<TouchableOpacity onPress={...}>
  <View style={...}>
    ...
  </View>
</TouchableOpacity>

-->

<TouchableOpacity onPress={...} style={...}>
  ...
</TouchableOpacity>
```

If the child is an Image or Text, on all the examples at Facebook it worked without any change. But it is a great idea to double check them anyway.
2015-07-20 16:44:36 -08:00
Matheus Santos 6213950334 Added transitions 'VerticalUpSwipeJump' and 'VerticalDownSwipeJump' in…
Summary:
… NavigatorSceneConfigs
Closes https://github.com/facebook/react-native/pull/1822
Github Author: Matheus Santos <matheus.santos@struct.com.br>
2015-07-20 12:53:54 -08:00
Martín Bigio 95dc38929c [rn] revert D2201593 2015-07-20 11:48:08 -08:00
Martín Bigio 0d91b93aba [LAUNCH-BLOCKER] Revert JS callsite of D2201593 2015-07-20 11:48:07 -08:00
Tadeu Zagallo 72f7a1be6f [ReactNative] Add JavaScriptCore legacy profiler 2015-07-20 09:58:45 -08:00
Nick Lockwood 5db42643cf Added JSONKit support
Summary:
React Native will now use JSONKit if it's already available in the project, otherwise it will fall back to using NSJSONSerialization as before. This provides a small performance boost to JSON parsing in some cases.
2015-07-20 09:52:31 -08:00
Spencer Ahrens e3afc4efd8 Merge pull request #2049 from negativetwelve/docs/animated-input-events
[Docs] Fix Animated example for onScroll and onPanResponderMove to match paragraph description
2015-07-20 19:25:23 +02:00
Tadeu Zagallo f2d65ea85b [ReactNative] Fix RCTJavaScriptContext deallocation (attempt #2)
Summary:
The context wasn't being explicitly released before, since it'd be immediately
released. Now that the executors are bridge modules, it was only being deallocated
when the modules were released, what caused the threads to not be released at all.
2015-07-20 02:40:05 -08:00
Mark Miyashita f3dd07531c [Docs] Animated example for onScroll and onPanResponderMove should match the description in the paragraph above 2015-07-19 17:05:25 -07:00
Elliot Lynde 4a262e0f2b [React Native][Pokes Dashboard] Fix crash 2015-07-17 17:00:47 -08:00
Eric Vicenti c28d33f3a2 [ReactNative] Remove dependencies on Navigator idStack
Summary:
idStack is going away soon. This removes all references to it. Looking at the internal state of navigator will make you have a bad time.

The biggest change is switching to the new component-freezing techinique in the navigation bars. This way we avoid dependence on the idStack to provide a scalar ID for each route.
2015-07-17 15:28:57 -08:00
Eric Vicenti c4389c006f [ReactNative] Max RedBox windowLevel to always appear on top 2015-07-17 13:24:52 -08:00
Bill Fisher b56717ede9 [Storyline] SliderIOS responds to UIControlEventTouchUpOutside 2015-07-17 13:01:08 -08:00
DengYun 3c78aa6d25 [Bridge] remove unused semaphore
Summary:
dispatch_semaphore_wait with DISPATCH_TIME_NOW don't wait for the semaphore. It just test whether there's a signal and return the result.

So the line "dispatch_semaphore_wait(semaphore, DISPATCH_TIME_NOW);" does nothing here. It seems like a bug, but each executing in js thread will be queued, so it's safe to remove the unused semaphore instead of wait for it.
Closes https://github.com/facebook/react-native/pull/1915
Github Author: DengYun <tdzl2003@gmail.com>
2015-07-17 10:01:26 -08:00
Nick Lockwood 61c648d564 Merged RCTNetworkImageView functionality into RCTStaticImage
Summary:
RCTNetworkImageView and RCTStaticImage had significant overlap in functionality, but each had a different subset of features and bugs.

This diff merges most of the functionality of RCTNetworkImageView into RCTStaticImage, eliminating some bugs in the former, such as constant redrawing when properties were changed.

I've also removed the onLoadAbort event for now (as it wasn't implemented), and renamed the other events to match the web specs for `<img>` and XHMLHttpRequest. The API is essentially what Adobe proposed here: http://blogs.adobe.com/webplatform/2012/01/13/html5-image-progress-events/

The following features have not yet been ported from RCTNetworkImageView:

- Background color compositing. It's not clear that this adds much value and it increases memory consumption, etc.
- Image request cancelling when images are removed from view. Again, it's not clear if this is a huge benefit, but if it is it should be combined with other optimisations, such as unloading offscreen images.

(Note that this only affects the open source fork. For now, internal apps will still use FBNetworkImageView for remote images.)
2015-07-17 07:43:16 -08:00
Nick Lockwood 82a774e92b Added unit tests for gzip functionality 2015-07-17 04:55:27 -08:00
Spencer Ahrens fc23d0c40d Merge pull request #2030 from sahrens/Updates_From_Fri_July_17th
Updates from fri july 17th
2015-07-17 14:26:44 +02:00
Spencer Ahrens 4a5f12aa29 Updates from Fri July 17th 2015-07-17 14:14:30 +02:00
Spencer Ahrens c43e93d1b4 Reverted ca9d1b3bf5a6f46ec29babe8685634690ff9a2bc to unbreak groups 2015-07-17 04:03:01 -08:00
Christopher Chedeau 2771fc4c52 Add link for releases 2015-07-16 19:41:22 -07:00
Kevin Gozali 77a0cf27f2 [ReactNative] Revert onItemRef removal 2015-07-16 17:49:56 -08:00
Kevin Gozali 5ec60effea [ReactNative] revert 'unbreak navigation due to onItemRef removal' 2015-07-16 17:49:56 -08:00
Hedger Wang 326a66ba07 [ReactNative][Navigation]: Add method preventDefault() to NavigationEvent 2015-07-16 17:35:21 -08:00
Spencer Ahrens 4b82673484 revert [React Native] Fix scroll view sticky headers 2015-07-16 16:31:53 -08:00
Martín Bigio ab9a87c33a [cg] Perf logging 2015-07-16 14:24:49 -08:00
Hedger Wang fca16fbe40 [ReactNative] unbreak navigation due to onItemRef removal 2015-07-16 13:41:20 -08:00
Sean Powell fa4c570d33 Support debugger reconnection when the packager goes down.
Summary:
This should resolve the issue highlighted in #1709
Closes https://github.com/facebook/react-native/pull/1992
Github Author: Sean Powell <sean@longdivision.co.uk>
2015-07-16 13:32:01 -08:00
Nick Lockwood 81ad713f5f Added Gzip support
Summary:
Added Gzip function to RCTUtils. This uses dlopen to load the zlib library at runtime so there's no need to link it into your project.

The main reason for this feature is to support gzipping of HTTP request bodies. Now, if you add 'Content-Encoding:gzip' to your request headers when using XMLHttpRequest, your request body will be automatically gzipped on the native side before sending.

(Note: Gzip decoding of *response* bodies is handled automatically by iOS, and was already available).
2015-07-16 09:38:20 -08:00
Frédéric Sagnes 36f76e5893 Improve the performance of React Native tests 2015-07-16 08:41:06 -08:00
Adam Farhi f74efc13ed Add ListView Grid Layout Example to UIExplorer Examples
Summary:
On @brentvatne suggestion:
https://github.com/facebook/react-native/issues/1276#issuecomment-112161358

I imported my Grid Layout example (https://github.com/yelled3/react-native-grid-example) into UIExplorer.

![demo-grid](https://cloud.githubusercontent.com/assets/818124/8229685/c4325dd4-15c1-11e5-8817-cdf270ab1003.gif)
Closes https://github.com/facebook/react-native/pull/1668
Github Author: Adam Farhi <yelled3@gmail.com>
2015-07-16 06:02:15 -08:00
James Ide b362072c83 [Rendering] Set allowsEdgeAntialiasing for transformed views
Summary:
By default, the edges of rotated layers on iOS have jagged edges because they are not antialiased. Setting `allowsEdgeAntialiasing` makes them look a lot nicer by smoothing out the jaggies. This is particularly important for UIs like Tinder cards, for example.

Closes https://github.com/facebook/react-native/pull/1999
Github Author: James Ide <ide@jameside.com>
2015-07-16 04:33:03 -08:00
Mr Speaker 2cb634bb0b Nav ios hide hairline
Summary:
For the current project I am working on I needed to add a boolean option (`shadowHidden`) to remove the 1px hairline shadow from the NavigationIOS component:

`<NavigatorIOS shadowHidden={true} initialRoute={...} />`

By default, or with `shadowHidden={false}` it looks like this:

![withhairline](https://cloud.githubusercontent.com/assets/129330/8145401/d2704956-11d4-11e5-86e8-a75435b68480.png)
Setting the shadow hidden  with `shadowHidden={true}` looks like this:

![nohairline2](https://cloud.githubusercontent.com/assets/129330/8145405/148ed56e-11d5-11e5-85d6-f8cd3453d5ac.png)

The code it uses to do the actual hiding is... a bit of a hack (*I* think), but it's the only way currently to do it, and is the way they do it in the iPhone calendar app: iterating through the subviews and removing the shadow image.

This removes the shadow *and* keeps the translucent blurry effect with a ScrollView (see this [SO discussion](http://stackoverflow.com/questions/18160173/how-to-remove-uinavigationbar-inner
Closes https://github.com/facebook/react-native/pull/1615
Github Author: Mr Speaker <mrspeaker@gmail.com>
2015-07-16 04:31:17 -08:00
Mike Armstrong 9f94dd457a Camera node for scene hierarchy 2015-07-16 01:57:00 -08:00
John Ku 72694a722e Include jestSupport for npm package
Summary:
https://github.com/facebook/react-native/pull/1639 was closed for unknown reason. This will help unit test with Jest without manually copying them into node_modules/react-native.
Closes https://github.com/facebook/react-native/pull/1848
Github Author: John Ku <john.cmyk@gmail.com>
2015-07-15 19:00:15 -08:00
Mr Speaker 09236ccbe7 Allow horizontal ListView. Rename height -> size
Summary:
Infinite scrolling in horizontal ListViews. Rather than just using height and Y offset to determine when to load more rows, it checks `props.horizontal` and switches between width/height and offset X/Y accordingly.

This changed required some renaming. However, the only change external to `ListView.js` is exporting `contentSize` instead of `contentHeight` from the `getMetrics()` function. (This is not part of the API, but is used "for perf investigations or analytics" and isn't reference in the repo).

I believe this change works as expected (and the xcode tests pass) though it's possible that there may more complexity in this issue that I have overlooked.
Closes https://github.com/facebook/react-native/pull/1786
Github Author: Mr Speaker <mrspeaker@gmail.com>
2015-07-15 10:13:12 -08:00
Spencer Ahrens 28b9a6f69e Merge pull request #2007 from sahrens/Updates_from_Wed_July_15th
Updates from wed july 15th
2015-07-15 19:26:26 +02:00
Spencer Ahrens 902ffbbfb8 Updates from Wed July 15th 2015-07-15 19:05:08 +02:00
Christopher 5006eca4a8 [TextInput] Remove focus on TextInput if property editable is …
Summary:
Clicking on a TextField with editable set to false still would trigger a keyboard event.
In this case that the TextField was a multiline, it would scroll you down to the bottom.

Closes https://github.com/facebook/react-native/pull/1855
Github Author: Christopher <hello@blick-labs.com>
2015-07-15 08:37:22 -08:00
Dave Sibiski 70feab9d50 [Packager] Fix when loading a path that can't be handled
Summary:
[Packager] Adds `NotFoundError` when loading a path that can't be handled

Resolves https://github.com/facebook/react-native/issues/1944
Closes https://github.com/facebook/react-native/pull/1948
Github Author: Dave Sibiski <dsibiski@gmail.com>
2015-07-15 08:25:31 -08:00
chirag04 915540d237 [transform] add perspective property to transform
Summary:
![matrixflip](https://cloud.githubusercontent.com/assets/1509831/8701143/607b069c-2b10-11e5-9c54-8b9767e74e16.gif)

cc @sahrens @vjeux
Closes https://github.com/facebook/react-native/pull/1980
Github Author: chirag04 <jain_chirag04@yahoo.com>
2015-07-15 08:08:29 -08:00
Matt Revell 64c00dcd7a Issues/#1689 text input warning
Summary:
This should close issue 1689. Using Object.assign to pass Flow checks.
Closes https://github.com/facebook/react-native/pull/1956
Github Author: Matt Revell <mattrevell82@me.com>
2015-07-15 06:33:03 -08:00
Dorota Kapturkiewicz ba433be886 [ReactNative] Make ErrorCookie work. 2015-07-15 04:04:09 -08:00
Brent Vatne 94e2e51876 Merge pull request #1949 from sjmueller/master
Clarify docs to use animated over react-tween-state & rebound
2015-07-14 23:16:36 -07:00
chirag04 548549ea9f [style] expose rotate x, y, z transforms
Summary:
Added rotateX, rotateY, rotateZ transforms.

cc @sahrens
Closes https://github.com/facebook/react-native/pull/1976
Github Author: chirag04 <jain_chirag04@yahoo.com>
2015-07-14 19:58:26 -08:00
James Ide 19ddbac113 [Versions] Update versions in package.json and podspec to 0.7.1
Summary:
When developing against master I want to rely on the version numbers being reasonably accurate.
Closes https://github.com/facebook/react-native/pull/1804
Github Author: James Ide <ide@jameside.com>
2015-07-14 17:57:07 -08:00
chirag04 04fa09afef [Style] added backface-visibility. fixes #1973
Summary:
default behavior remains same(backface visible).

cc @sahrens
Closes https://github.com/facebook/react-native/pull/1977
Github Author: chirag04 <jain_chirag04@yahoo.com>
2015-07-14 17:38:05 -08:00
Spencer Ahrens 5d4140c513 [ReactNative] deepDiff by default 2015-07-14 17:32:25 -08:00
Pylipala 7a23651ee1 Fix the main.jsbundle url in comment
Summary:
Fix the url in comment
Closes https://github.com/facebook/react-native/pull/1959
Github Author: Pylipala <pylipala@gmail.com>
2015-07-14 16:44:35 -08:00
Tadeu Zagallo d30ada61f0 [ReactNative] Remove unused executor context id
Summary:
Remove `RCTGetExecutorID` and `RCTSetExecutorID`, it wasn't used anymore since
the bridge was refactored into `RCTBridge` and `RCTBatchedBridge`.
2015-07-14 16:40:21 -08:00
Tadeu Zagallo 9799c215cb [ReactNative] Add JS errors handling to iOS
Summary:
Every once in a while a guard is forgotten somewhere and the redbox is gone. I
want to remove the guards, but for that the stack traces have to be symbolicated
on the native side. So for now it just adds yet another check, in case a guard
is missing on JS.
2015-07-14 16:24:06 -08:00
Spencer Ahrens 3e8604d5d8 Merge pull request #1982 from IskenHuang/feature/bundle_cli
add cli bundle url params
2015-07-15 02:07:30 +02:00
Kevin Gozali 2e9d156fad [ReactNative] revert D2233419: 'Dynamic Text Sizes for Text component' 2015-07-14 15:55:06 -08:00
Eric Vicenti c3e75393ab [ReactNative] Remove Navigator onItemRef
Summary:
onItemRef is old and no longer needed now that the parent renders the scenes. This removes it from Navigator and all of our clients.

This is a breaking change to users of Navigator, but it is easy to transition to a ref in renderScene instead
2015-07-14 14:56:16 -08:00
Dmitriy Loktev 74f8055692 [Image] Add examples to UIExplorer, fix some bugs
Summary:
Add two simple examples.
![image](https://cloud.githubusercontent.com/assets/1004115/8674092/03052652-2a55-11e5-8531-8f01c7970af4.png)

Also:
- do not start the task at DownloadTaskWrapper (it starts from ImageDowloader if image isn't cached yet);
- fire `onLoadAbor`t event;
- send more readable `error.localizedDescription` with `onLoadError`;
- rename `onLoaded` to `onLoadEnd`
Closes https://github.com/facebook/react-native/pull/1987
Github Author: Dmitriy Loktev <unknownliveid@hotmail.com>
2015-07-14 14:33:02 -08:00
Nick Lockwood d1a82c4af1 Fixed image downloader bug
Summary:
RCTImageDownloader was ignoring server response codes. When receiving a response other than 200 it would treat this as success, meaning the image would never load, nor report failure.

This diff fixes that by treating responses with non-200 status as an error so that error handler is called.
2015-07-14 13:04:34 -08:00
Jared Forsyth a43987309d [react native] prepare the react native inspector for the new react devtools
Summary:
These are the changes needed for full interop with the (as yet unreleased) new
version of React Devtools.

- the on-device inspector is minimized when devtools is open
- devtools highlight -> device and device touch -> devtools select works
- editing react native styles :)
2015-07-14 12:35:43 -08:00
Spencer Ahrens 52f599a080 Merge pull request #1988 from sahrens/Updates_from_Tue_July_14th
Updates from tue july 14th
2015-07-14 21:04:23 +02:00
Spencer Ahrens 34c2157b66 Updates from Tue July 14th 2015-07-14 20:37:13 +02:00
Forbes Lindesay ebd046ae21 Remove bluebird 2015-07-14 10:25:16 -08:00
Jacob Rosenthal a8cb47e011 add local notification api schedule and present
Summary:
Add local notifications to the push library.
```
  var PushNotificationIOS = React.PushNotificationIOS;
  PushNotificationIOS.requestPermissions();

  var notification = {
    "fireDate": Date.now() + 10000,
    "alertBody":"Whats up pumpkin"
  };

  PushNotificationIOS.scheduleLocalNotification(notification);
 //lock screen or move away from app
```

Apple has another api for pushing immediately instead of scheduling, like when your background delegate has been called with some new data (bluetooth, location, etc)
```
  var PushNotificationIOS = React.PushNotificationIOS;
  PushNotificationIOS.requestPermissions();

  var notification = {
    "alertBody":"Whats up pumpkin"
  };

  PushNotificationIOS.presentLocalNotification(notification);
 //lock screen or move away from app
```

Closed https://github.com/facebook/react-native/pull/843 looks related:

See https://developer.apple.com/library/ios/documentation/iPhone/Reference/UILocalNotification_Class/ for much more available in
Closes https://github.com/facebook/react-native/pull/1616
Github Author: Jacob Rosenthal <jakerosenthal@gmail.com>
2015-07-14 09:08:30 -08:00
Jean Regisser 9936a2406d [TabBarIOS] Add translucent property to TabBarIOS
Summary:
To be on par with NavigatorIOS, I added the translucent property to TabBarIOS.

Usage:
```
<TabBarIOS
 translucent={false} // default is true
/>
```
Closes https://github.com/facebook/react-native/pull/1937
Github Author: Jean Regisser <jean.regisser@gmail.com>
2015-07-14 08:02:44 -08:00
Martín Bigio 691a1dafd1 s/RKScrollViewManager/RCTScrollViewManager 2015-07-14 07:52:30 -08:00
Nick Lockwood 0c61b49f0a Improved RCTCache performance + fixed border color crash
Summary:
RCTCache had really bad insertion performance when the cache was full due to having to LRU-sort the entries. This was making color
animations very slow.

I've fixed this in two ways:

1) by removing the sort and doing a linear search to remove old entries, which changes insertion perf to O(n) in the worst case instead of O(n log n) or even (n2).

2) by reducing the size of the color cache to 128 from 1024, which should be fine for normal use, without penalising animation performance.

Separately, border colors were not being retained, which caused crashes when the color cache was cleared. I've fixed that by retaining the border colors inside RCTView.
2015-07-14 04:56:25 -08:00
Nick Lockwood b34a85f4da Merged RCTStaticImage with FB internal version
Summary:
Merged RCTStaticImage with our internal RKStaticImage and ported over logic where assets are loaded at the optimal size and reloaded if the view size changes.
2015-07-14 04:06:18 -08:00
Alex Akers a65bbe14d3 [React Native] Update additional callsites with RCTResponseErrorBlock 2015-07-14 03:59:18 -08:00
Vladislav Alexeev be2cabc3f8 Dynamic Text Sizes for Text component
Summary:
Dynamic Text Sizes for Text component.
Text gains new prop - allowFontScaling (true by default).
There is also AccessibilityManager module that allows you to tune multipliers per each content size category, but predefined multipliers are there.
This could potentially break some apps so please test carefully.
2015-07-14 03:13:32 -08:00
Alex Akers eb06659711 [React Native] Update code comments about layout-only view 2015-07-14 02:52:45 -08:00
Isken Huang 6357931b61 add cli bundle url params 2015-07-14 10:40:39 +08:00
Nathan Spaun 875ab073ea [Treehouse] Sync from android permalink keyboard layout changes 2015-07-13 18:29:54 -08:00
Spencer Ahrens 0d153562be Merge pull request #1978 from sahrens/Updates_for_Mon_July_13th
Updates for mon july 13th
2015-07-14 02:18:18 +02:00
Spencer Ahrens 31b63ade13 Updates_for_Mon_July_13th 2015-07-14 00:27:24 +02:00
Spencer Ahrens 509e9c96e2 [ReactNative] Disable flaky Layout only node scenario tests 2015-07-13 14:20:10 -08:00
Param Aggarwal e1ce646275 Stray import statement - RCTTouchHandler
Summary:
Closes https://github.com/facebook/react-native/pull/1970
Github Author: Param Aggarwal <paramaggarwal@gmail.com>
2015-07-13 12:47:18 -08:00
Spencer Ahrens e5f7200213 [ReactNative] Fix crash in ListView 2015-07-13 12:36:56 -08:00
James Ide 9f07b9a2b6 [ListView] Operate on the true scroll responder instead of the scroll component
Summary:
When composing scroll views, `this.refs[SCROLLVIEW_REF]` may refer to another higher-order scroll component instead of a ScrollView. This can cause issues if you expect to need it to be a ScrollView backed by an RCTScrollView.

The solution is to call `getScrollResponder()` - as long as all higher-order scroll components implement this method, it will make its way down to the true ScrollView, which is what ListView wants here.

Closes https://github.com/facebook/react-native/pull/1927
Github Author: James Ide <ide@jameside.com>
2015-07-13 12:36:55 -08:00
James Ide d5943b0e47 [Image] Add support for tintColor to remote images
Summary:
Remote images now support the `tintColor` prop.

Also picked nicer demo colors for the UIExplorer example.

Fixes #1867

Closes https://github.com/facebook/react-native/pull/1932
Github Author: James Ide <ide@jameside.com>
2015-07-13 10:36:32 -08:00
Nick Lockwood 90dd7a13f0 Added support for URLs pointing to files inside application home 2015-07-13 10:34:48 -08:00
Alex Kotliarskyi d1b14ef062 [React Native] Log to ASL
Summary:
By default we were just writing all log messages to stderr. This also
adds support for [Apple System Log](https://developer.apple.com/library/ios/documentation/System/Conceptual/ManPages_iPhoneOS/man3/asl_log.3.html) that
can be viewed using standard tools.
2015-07-13 09:52:16 -08:00
Krzysztof Magiera 47315af069 [ReactNative] Fix SPY_MODE to show all JS->N communication. 2015-07-13 09:43:04 -08:00
Nick Lockwood 01151f8c7a Added LRU cache to fix out of memory issues with color caching 2015-07-13 08:50:00 -08:00
Alex Akers 4beef5bec3 [React Native] Re-enable testScenario{1,2}
Summary:
The tests are passing locally. Not sure why they weren't passing on FB CI.
2015-07-13 07:16:52 -08:00
Spencer Ahrens 9c4b9973f9 [ReactNative] add _flowconfig and _gitignore to SampleApp 2015-07-13 06:39:18 -08:00
Sam Mueller f732e46581 Clarify docs to use animated over react-tween-state & rebound 2015-07-10 14:04:45 -07:00
Hedger Wang 2cbcfcea88 [Android][JS]: supports prop "html" in WebView 2015-07-10 12:33:16 -08:00
Jared Forsyth 2b916f3cef Merge pull request #1947 from jaredly/Hotfix_Fri_10_July
Hotfix fri 10 july
2015-07-10 13:19:50 -07:00
Jared Forsyth 98a00f4840 Hotfix from Fri 10 July 2015-07-10 13:01:05 -07:00
Jared Forsyth b54594e42b [react native] fix inspector touch bug 2015-07-10 11:53:23 -08:00
Nick Lockwood f6d058dfea Merge pull request #1943 from nicklockwood/update_fri_10_jul
Updates for Friday 10th July
2015-07-10 18:07:28 +01:00
Nick Lockwood 7fa08e5c3f Updates for Fri 10 Jul 2015-07-10 17:48:12 +01:00
Nick Lockwood 9229eadff0 Fixed ART Text
Summary:
ART text was crashing due to a bug in the release logic.
2015-07-10 08:31:21 -08:00
Nick Lockwood 4f464962a0 Added missing semver dependency 2015-07-10 07:34:44 -08:00
Alexsander Akers ea959af850 [React Native] Fix test failures 2015-07-10 06:56:50 -08:00
Alexsander Akers 72b50dc32d [React Native] Update image downloader
Summary:
Change `RCTImageDownloader` so it stores the `RCTDownloadTaskWrapper` for reuse. Modify `RCTDownloadTaskWrapper` to use associated objects to store the completion/progress blocks.
2015-07-10 06:34:22 -08:00
Dmitriy Loktev 8e70c7f003 [Image] Add onLoadStart, onLoadProgress, onLoadError events to Image component
Summary:
This PR adds 4 native events to NetworkImage.

![demo](http://zippy.gfycat.com/MelodicLawfulCaecilian.gif)

Using these events I could wrap `Image` component into something like:
```javascript
class NetworkImage extends React.Component {
  getInitialState() {
    return {
      downloading: false,
      progress: 0
    }
  }

  render() {
    var loader = this.state.downloading ?
      <View style={this.props.loaderStyles}>
        <ActivityIndicatorIOS animating={true} size={'large'} />
        <Text style={{color: '#bbb'}}>{this.state.progress}%</Text>
      </View>
      :
      null;

    return <Image source={this.props.source}
      onLoadStart={() => this.setState({downloading: true}) }
      onLoaded={() => this.setState({downloading: false}) }
      onLoadProgress={(e)=> this.setState({progress: Math.round(100 * e.nativeEvent.written / e.nativeEvent.total)});
      onLoadError={(e)=> {
        alert('the image cannot be downloaded because: ', JSON.stringify(e));
        this.setState({downloading: false});
      }}>
      {loader}
    </Image>
  }
}
```
Useful on slow connections and server errors.

There are dozen lines of Objective C, which I don't have experience with. There are neither specific tests nor documentation yet. And I do realize that you're already working right now on better `<Image/>` (pipeline, new asset management, etc.). So this is basically a proof concept of events for images, and if this idea is not completely wrong I could improve it or help somehow.

Closes https://github.com/facebook/react-native/pull/1318
Github Author: Dmitriy Loktev <unknownliveid@hotmail.com>
2015-07-10 06:34:21 -08:00
Kostiantyn Koval 54c21ac651 add NSSet type to RCTConvert
Summary:
Add support for NSSet type
Closes https://github.com/facebook/react-native/pull/1938
Github Author: Kostiantyn Koval <konstantin.koval1@gmail.com>
2015-07-10 04:19:05 -08:00
Alex Akers ffaf16283f [React Native] Add new E2E tests 2015-07-10 04:12:28 -08:00
James Ide 40a043109d [io.js] Print a warning message if the user is not on io.js 2.x
Summary:
Detects if the user is on Node or io.js 1.x and prints a banner explaining how to upgrade. We probably should link to more detailed upgrade docs so this is just a start.

I also added a function to format banners that is kind of useful.

Addresses part of #1737

![packager-banner](https://cloud.githubusercontent.com/assets/379606/8447050/ad615402-1f67-11e5-8c02-ece5f7488135.png)

Closes https://github.com/facebook/react-native/pull/1824
Github Author: James Ide <ide@jameside.com>
2015-07-10 00:32:46 -08:00
Brent Vatne 86c815f1d4 Merge pull request #1930 from kphed/master
Minor grammatical fixes to EmbeddedApp.md
2015-07-09 20:42:35 -07:00
Khoa Phan 572157d14b Minor grammatical fixes:
1. 'Install' should be 'installed' (past tense)
2. Change 'checkout' to 'check out'
2015-07-09 19:48:25 -07:00
LYK fc059857e2 [Text] Get the system font instead of Helvetica programmatically and add a virtual fontName called "System"
Summary:
Get the system font instead of Helvetica programmatically and add a virtual fontName called "System" that defaults to whatever the current system font is.
#1611
Closes https://github.com/facebook/react-native/pull/1635
Github Author: LYK <dalinaum@gmail.com>
2015-07-09 15:48:49 -08:00
Peter Zich 10bb054b62 [react-native] Typo fix (s/monolithically/monotonically/) 2015-07-09 14:40:50 -08:00
Matthew Arbesfeld 23909cd6f6 [Image] Support loading images from application home directory.
Summary:
Image source uri's prefixed with ~ are expanded into a full path to
the app directory.

For example: `~/Documents/foo.png` is expanded into `Users/arbesfeld/Library/Developer/CoreSimulator/Devices/977988DF-A8BC-4CE5-A27A-75807A6DF085/data/Containers/Data/Application/CBEFC261-5900-4EF9-8646-603BC57B094A/Documents/foo.png`.

This lets us store and use images from the application home directory with the `Image` component:

```
<Image source={{uri: '~/Documents/foo.png', width: 300, height: 300}} />
```

Resolves #1178
Closes https://github.com/facebook/react-native/pull/1740
Github Author: Matthew Arbesfeld <arbesfeld@gmail.com>
2015-07-09 12:58:26 -08:00
Olivier Notteghem e1f53c043c Restore SPY mode to sniff traffic across bridge 2015-07-09 09:23:27 -08:00
Tadeu Zagallo 1419941f8e [ReactNative] Log with RCTPerformanceLogger only once per bridge instance
Summary:
Fixes #1809

Even if a bridge has more than one root view, it's not supported by the js side
right now, and it will keep warning that those timespans had already been
recorded.
2015-07-09 07:35:16 -08:00
Spencer Ahrens 8a5fa6cb3a Merge pull request #1899 from sahrens/AnimatedDocs
Add new Animated API to animation docs.
2015-07-09 14:48:28 +02:00
Spencer Ahrens bda7f7389a Add new Animated API to animation docs. 2015-07-09 14:47:47 +02:00
Spencer Ahrens a2578fed3c Merge pull request #1900 from sahrens/Update_Tue_Jul_7_Animated
Updates from Tue July 7 and Wed July 8th - includes new Animated API
2015-07-09 14:22:51 +02:00
Spencer Ahrens 233f80d6c2 Fix tests
e2e flowconfig needed update, plus tweaks
2015-07-09 14:12:56 +02:00
Spencer Ahrens 7ce8cd7222 Updates Tue July 7th and Wed July 8th including Animated 2015-07-09 12:59:47 +02:00
Spencer Ahrens fd2cb763df [ReactNative] add immutable dependency for NavigationRouteStack 2015-07-09 02:53:02 -08:00
Spencer Ahrens 04fe80b7a0 [ReactNative] Export Easing module so folks can use it 2015-07-09 02:44:13 -08:00
Spencer Ahrens 7d4b1877ae [RN] add Animated test for spring tracking 2015-07-09 01:59:49 -08:00
Krzysztof Magiera 9b162d7659 [ReactNative] Add support for onLayout View property. 2015-07-09 00:56:09 -08:00
Hedger Wang 21b98b23c9 [Navigator] Introducing NavigationRouteStack.
Summary:
Introducing the data structure NavigationRouteStack that focused on managing
navigation routes stack.

The goal is to make <Navigatior /> thinner by moving stack management logic into
its own class and make sure it's well-tested.

Teh next step will be cleaning up <Navigatior /> and add `NavigationRouteStack` to
`NavigationContext`.
2015-07-08 16:58:11 -08:00
Jarrod Mosen bb07817023 Update SegmentedControlIOSExample.js
Summary:
`event.nativeEvent` now uses `selectedSegmentIndex`, not `selectedIndex`.
Closes https://github.com/facebook/react-native/pull/1872
Github Author: Jarrod Mosen <jarrod.mosen@me.com>
2015-07-08 12:52:04 -08:00
Jani Evakallio b5c1cd7918 [Navigator] Guard navigator.state.routeStack from accidental mutation
Summary:
A minor improvement suggestion: `Navigator.getCurrentRoutes()` probably shouldn't return its `routeStack` backing array as-is, because the caller may mutate it, causing the internal state of the navigator to go out of sync. Instead a shallow copy of the routes should be returned.

I stumbled on this problem in my app by attempting to read the navigator state as follows:
```
let routes = Navigator.getCurrentRoutes();
let current = routes.pop();
let previous = routes.pop();
```

Which led to an exception at next navigation event.

CLA signed.

Closes https://github.com/facebook/react-native/pull/1888
Github Author: Jani Evakallio <jani.evakallio@gmail.com>
2015-07-08 12:49:52 -08:00
philipp.krone 4b5b952c32 Changing Error to Warning
Summary:
As discussed with @nicklockwood in the issue https://github.com/facebook/react-native/issues/1780, the error should be changed to a warning to not break fetch() to send a POST to a remote API without wanting to parse the reply. E.g. google sends back an empty 1x1px gif when POSTing something to google analytics.
Closes https://github.com/facebook/react-native/pull/1860
Github Author: "philipp.krone" <kronep@googlemail.com>
2015-07-08 09:36:13 -08:00
Alex Akers bfbc280fb4 [React Native] Fix scroll view sticky headers
Summary:
The `ScrollView` component tells the native side the subview indices of the views to make sticky. The problem is that, once layout-only views are collapsed, the indices are no longer reflective of the original views to make stick to the top.
2015-07-08 09:35:16 -08:00
Spencer Ahrens c66b1c64b5 [RN] quick fix to unblock OSS tests
Summary:
For some reason jest on github isn't checking invariants.
2015-07-08 07:46:41 -08:00
Nick Lockwood a886e4c66b Migrated RCTText into FBReactKit 2015-07-08 07:13:00 -08:00
Spencer Ahrens 57513fd24a make npm test command easier to find 2015-07-08 14:03:05 +02:00
Spencer Ahrens 2829be7de6 Note about setting up jest environment (io.js etc) 2015-07-08 14:01:28 +02:00
Spencer Ahrens 0d0b4c947b [RN: Animated] Fix delay anims
Summary:
They weren't calling onEnd because of duration: 0 optimiziation.
2015-07-08 03:18:13 -08:00
James Ide b3e0a702a7 [ListView] Allow different types of ScrollView to be composed
Summary:
This enables code like:
```js
<ListView renderScrollView={() => <CustomScrollView />} />
```

where CustomScrollView might be inverted or support pull-to-refresh, etc.
Closes https://github.com/facebook/react-native/pull/785
Github Author: James Ide <ide@jameside.com>
2015-07-08 02:35:29 -08:00
Natansh Verma 98521eb16e Revert "[ReactNative] Fix RCTJavaScriptContext deallocation" 2015-07-07 23:37:07 -08:00
Natansh Verma f21e79d5e1 Revert "[ReactNative] Fix crash when reload during profile" 2015-07-07 23:37:07 -08:00
Tadeu Zagallo 0ffb2d36eb [ReactNative] Fix crash when reload during profile
Summary:
Fixes #1642

When reloading during profiling, the profile wouldn't unhook from the instance
being deallocated.
2015-07-07 18:31:17 -08:00
Tadeu Zagallo a251316a5f [ReactNative] Fix RCTJavaScriptContext deallocation
Summary:
The context wasn't being explicitly released before, since it'd be immediately
released. Now that the executors are bridge modules, it was only being deallocated
when the modules were released, what caused the threads to not be released at all.
2015-07-07 18:31:17 -08:00
Hedger Wang bb141e3a3c Rename prop "injectedJavascriptIOS" to "injectedJavaScript
Summary:
Android WebView now supports the prop "injectedJavaScript", too.
It's time to rename "injectedJavascriptIOS" to "injectedJavaScript" for API
consistency between IOS and Android.
2015-07-07 17:17:22 -08:00
Nick Lockwood 1b7699f671 Migrate unit tests from FBReactKitModules to FBReactKit 2015-07-07 16:39:35 -08:00
Brent Vatne 90022023c9 Merge pull request #1802 from ide/iojs-docs
[Docs] Update installation docs to reference io.js instead of Node
2015-07-07 16:35:25 -07:00
Jean Regisser 5c01b1e1a0 Fix incorrect lowercase response headers set for XHR responses
Summary:
Trivial change to fix the lowercase response headers set for XHR responses.

What would happen is the first iterated header wouldn't be part of `_lowerCaseResponseHeaders`.
Also it would mutate the original `responseHeaders` object, mixing lowercase headers with the original values.
Closes https://github.com/facebook/react-native/pull/1876
Github Author: Jean Regisser <jean.regisser@gmail.com>
2015-07-07 15:05:45 -08:00
Spencer Ahrens 566ca9e58d [ReactNative] fix duplicate LayoutAnimation warning 2015-07-07 14:15:04 -08:00
Spencer Ahrens b770310555 [ReactNative] Move Animated to Open Source
Summary:
Moves the files over and Exports Animated from 'react-native'.
2015-07-07 13:44:09 -08:00
Spencer Ahrens d56ff42596 [ReactNative] Animated infra - ValueXY, addListener, fixes, etc
Summary:
This is most of the infra necessary for the gratuitous animation demo app.

I originally had things more split up, but it was just confusing because everything is so interlinked and dependent, so lower diffs would have code that wasn't even going to survive (and thus not useful to review), so I merged it all here.

- `Animated.event` now supports mapping to multiple arguments (needed for `onPanResponderMove` events which provide the `gestureState` as the second arg.
- Vectors: new `Animated.ValueXY` class which composes two `Animated.Value`s for convenience/brevity
- Listeners: values and events can be listened to in order to trigger state updates based on their values.  Intended to work as async updates from native that might lag behind truth.
- Offsets: a common pattern with pan and other gestures is to track where you left off.  This is easily encoded in the Value directly with `setOffset(offset)`, typically used on grant, and can be flattened back into the base value and reset with `flattenOffset()`, typically called on release.
- Tracking: supports `Animated.Value/ValueXY` for `toValue` with all animations, enabling linking multiple values together with some curve or physics.  `Animated.timing` can be used with `duration: 0` to rigidly link the values with no lag, or `Animated.spring` can be used to link them like chat heads.
- `Animated.Image` as a default export.
- Various cleanup, bug, flow and lint fixes.
2015-07-07 13:44:07 -08:00
Alex Akers c928d9495b [React Native] Fix whitespace 2015-07-07 12:12:01 -08:00
Brent Vatne c27defee7b Merge pull request #1894 from colinramsay/patch-1
Update NativeModule documentation to show correct event emitter usage
2015-07-07 10:11:40 -07:00
Alex Akers 3c541ca540 [React Native] Update native error callback handling
Summary:
This introduces a new `RCTResponseErrorBlock` block type that allows a bridge module writer to call it with an `NSError` instance rather than a dictionary.
2015-07-07 08:54:05 -08:00
Martín Bigio 66d3f3c616 [rn] Keep native ListView child frames in sync on JS wrapper
Summary: At the moment the `ListView.js` `_childFrames` variable is only updated on scroll. As a consequence, `onChangeVisibleRows` won't get triggered for the initial render, nor any future render not trigered by scroll events. To fix this we need to make sure native and JS have the child frames in sync.
2015-07-07 07:40:56 -08:00
KJlmfe b57a14d07c <Text> module add textDecoration style attributes
Summary:
This is simply a rebased and squashed version of @KJlmfe's PR over at https://github.com/facebook/react-native/pull/845

It was actually already squashed into one commit, but for some reason that was hard to see from the original PR.
Closes https://github.com/facebook/react-native/pull/1869
Github Author: KJlmfe <kjlmfe@gmail.com>
2015-07-07 06:15:20 -08:00
Colin Ramsay b13e2e8c2e Update NativeModule documentation to show correct event emitter usage
It looks like in the various changes to native module events, the documentation has become a little confused. As far as I can tell, if you use `sendAppEventWithName` then the `NativeAppEventEmitter` is used and if `sendDeviceEventWithName` then it should be `DeviceEventEmitter`.
2015-07-07 15:04:50 +01:00
Alexsander Akers 02db374e50 [React Native] Remove layout-only nodes (Take 2!)
Summary:
Remove layout-only views. Works by checking properties against a list of known properties that only affect layout. The `RCTShadowView` hierarchy still has a 1:1 correlation with the JS nodes.

This works by adjusting the tags and indices in `manageChildren`. For example, if JS told us to insert tag 1 at index 0 and tag 1 is layout-only with children whose tags are 2 and 3, we adjust it so we insert tags 2 and 3 at indices 0 and 1. This keeps changes out of `RCTView` and `RCTScrollView`. In order to simplify this logic, view moves are now processed as view removals followed by additions. A move from index 0 to 1 is recorded as a removal of view at indices 0 and 1 and an insertion of tags 1 and 2 at indices 0 and 1. Of course, the remaining indices have to be offset to take account for this.

The `collapsible` attribute is a bit of a hack to force `RCTScrollView` to always have one child. This was easier than rethinking out the logic there, but we could change this later.
2015-07-07 05:06:50 -08:00
Alexsander Akers fe2155e238 Merge pull request #1893 from a2/Update_Tue_7_Jul
Updates from Tuesday, 7 July
2015-07-07 14:05:39 +01:00
Alexsander Akers 3325e8f768 Updates from Tuesday, 7 July 2015-07-07 13:56:11 +01:00
Param Aggarwal 0f2d8e662e [ScrollView] Pick data from older event on coalescing.
Summary:
The `ScrollView` sends important `updatedChildFrames` data to the `ListView` to be able to implement `onChangeVisibleRows` method. Coalescing operates very strongly on older devices like the iPhone 4s where this data is then lost.

Fixes #1782.

`ListView` has a method called `onChangeVisibleRows` that is called whenever the rows visible on screen change. This method is critical to be able to implement deletion/creation of views and hence be conservative in memory usage. I have an infinite scrolling view which uses this method to only render the full rows for what is visible on screen and put placeholders for everything else.

In the `RCTEventDispatcher`, we [coalesce events](https://github.com/facebook/react-native/blob/522fd33d6f3c8fb339b0dde35b05df34c1233306/React/Base/RCTEventDispatcher.m#L135-L152) that are meant to be sent across the bridge. They are [dequeued](https://github.com/facebook/react-native/blob/522fd33d6f3c8fb339b0dde35b05df34c1233306/React/Base/RCTEventDispatcher.m#L180-L188) on each
Closes https://github.com/facebook/react-native/pull/1783
Github Author: Param Aggarwal <paramaggarwal@gmail.com>
2015-07-06 17:27:40 -08:00
Eric Vicenti 65027e8e29 [ReactNative] Fix timeout edge-case in POPAnimation hack 2015-07-06 15:15:56 -08:00
Pieter De Baets 3955236b0f Update StaticContainer from static_upstream 2015-07-06 15:06:59 -08:00
Nick Lockwood 652ffa28b2 Added regenerator to node_modules 2015-07-06 14:08:06 -08:00
Alex Akers c065d98112 [React Native] Change nil to Nil because it's more correct
Summary: #OCD
2015-07-06 11:15:45 -08:00
Brent Vatne c045c566e9 Remove unnecessary imports for RCTHTTPRequestHandler to fix Cocoapods build
Summary:
@tadeuzagallo - We discussed this ~a week ago when I was putting together the 0.7.0-rc release, only got around to creating the PR for it now so it's properly sync'd.
Closes https://github.com/facebook/react-native/pull/1865
Github Author: Brent Vatne <brentvatne@gmail.com>
2015-07-06 10:12:43 -08:00
Alex Akers ca791dfe6f [React Native] Update RCTAdSupport
Summary:
No longer check for the `ASIdentifierManager` class. Since we only target iOS 7.0 and up, this is unnecessary. Instead, we should check for whether the `advertisingIdentifier` is non-nil. If it is, we send it; otherwise we send an error.
2015-07-06 09:44:51 -08:00
Pieter De Baets 7e70ee2e03 Check for RCTSettingsManager in Settings.ios 2015-07-06 04:47:04 -08:00
Alex Akers b4cd019f39 [React Native] Remove animated GIFs from TicTacToe example 2015-07-06 04:11:03 -08:00
James Ide f5ad9c2103 [Crashfix] Replace dispatch_get_current_queue with DISPATCH_CURRENT_QUEUE_LABEL
Summary:
I encountered a crash when `RCTCurrentThreadName` called `dispatch_get_current_queue`. There are reports of it crashing e.g. https://github.com/CocoaLumberjack/CocoaLumberjack/issues/108 so better not to call it at all, plus it is deprecated.

Since we still want helpful debugging information, use `DISPATCH_CURRENT_QUEUE_LABEL` instead. It's kind of strange that this constant is defined to be NULL and the docs for `dispatch_get_queue_label` say not to pass in NULL, but in practice `DISPATCH_CURRENT_QUEUE_LABEL` is provided by the iOS SDK and works correctly.

Closes https://github.com/facebook/react-native/pull/1868
Github Author: James Ide <ide@jameside.com>
2015-07-06 03:17:03 -08:00
Alex Akers aba148061f [React Native] Re-alphabetize file names in Xcode projects
Summary:
Fixes my OCD problems.
2015-07-06 01:57:06 -08:00
Alexsander Akers fe9af98a28 Merge pull request #1694 from prathamesh-sonpatki/async-storage
[DOC] Removed unwanted "e.g" from documentation of multiSet
2015-07-05 11:37:41 +02:00
Alexsander Akers 60b56455c4 Merge pull request #1858 from a2/Update_Thu_3_Jul
Updates from Thursday, 3 July
2015-07-03 13:36:32 +01:00
Alexsander Akers e37e794ccf Merge new changes from fbobjc 2015-07-03 13:22:43 +01:00
Alex Akers 93d3cc135d [React Native] Fix failing UIExplorer integration tests 2015-07-03 04:15:54 -08:00
Alexsander Akers c1d7c0df47 Updates from Thu 3 Jul 2015-07-03 11:37:17 +01:00
Alex Akers 16cb41a24e [React Native] Fix padding in UIExplorer 2015-07-03 02:24:56 -08:00
Alex Akers 4fdeed0214 [React Native] Fix crash if current queue has no label
Summary:
If the current queue has no label, `dispatch_queue_get_label()` returns `NULL` and `@((char *)0)` will crash the app.

Closes facebook#1833
2015-07-03 02:24:30 -08:00
Alex Akers 88cfc1aaa6 [React Native] Fix navigation bar translucency 2015-07-03 02:12:28 -08:00
James Ide 3441847aa1 [Crashfix] Ensure that the image response is non-nil before caching it
Summary:
If you try to create a cached response from a nil response the app will crash. Looking at the code that uses NSURLSession and NSURLCache, this fix looks correct to me.

Fixes #1850

Closes https://github.com/facebook/react-native/pull/1852
Github Author: James Ide <ide@jameside.com>
2015-07-03 02:01:20 -08:00
Rui Chen 66e32dc406 [Treehouse RN] Sync for D2161376 2015-07-02 19:50:47 -08:00
Eric Vicenti 4e650f05d1 [ReactNative] setTimeout hack avoids POPAnimation race condition
Summary:
Having bugs in Groups because POPAnimation experiences a race condition. This hack avoids that for now while we transition away from POPAnimation altogether.
2015-07-02 10:51:48 -08:00
James Ide a97a866570 [Docs] Update installation docs to reference io.js instead of Node
It's pretty straightforward -- io.js is available through Homebrew so all you run is `brew install iojs` and then you can still run `node` from the command line. Also mentioned nvm since it's really good for switching between Node/io.js versions.
2015-07-02 11:42:25 -07:00
Alex Akers 00e85cbc85 [React Native] Persist open UIExplorer example between refreshes 2015-07-02 09:36:26 -08:00
Alexsander Akers 1d1386e735 Merge pull request #1839 from a2/Update_Wed_1_Jul
Updates from Wed 1 Jul
2015-07-02 12:15:35 +01:00
Alexsander Akers 13be9454cc Update with test fixes 2015-07-02 11:19:17 +01:00
Hedger Wang 54825b304a [WebView]: Kill shouldInjectAJAXHandler, and add injectedJavascriptIOS
Summary:
@public

The API and implementation of `shouldInjectAJAXHandler` is very opinionated, and it does not solve many of the use cases that we'd like to address.

Since  `shouldInjectAJAXHandler` is basically juts injecting JS to the web page, we should let developer inject whatever JS that address different issues that they want to fix.

Test Plan:
Test this snippet at <Playground />

```
<WebView
  url="http://www.facebook.com"
  injectedJavascriptIOS="document.body.style.border='solid 10px red'"
/>
```
2015-07-01 18:56:14 -08:00
Amjad Masad b45e2ed7ed [react-packager] fix test 2015-07-01 17:37:51 -08:00
Alexsander Akers d0cb80c072 Merge branch 'iojs-tests' of https://github.com/ide/react-native into Update_Wed_1_Jul
Conflicts:
	package.json
2015-07-01 22:07:41 +01:00
Alexsander Akers 4886b3dc57 Merge branch 'flow-13' of https://github.com/ide/react-native into Update_Wed_1_Jul 2015-07-01 22:06:24 +01:00
Alexsander Akers d161640f52 Update with required PRs 2015-07-01 22:05:10 +01:00
James Ide 5aa27586f0 [Tests] Update tests to run on io.js with the latest version of jest
Summary:
[This is a preview diff for getting RN's tests to pass with a future version of jest that supports io.js and other future versions of Node. This can be merged once the diff to update jest is merged upstream and published.]

Updates the tests in small ways so they run on io.js with two updates:

 - The Cache test which relies on Promises uses `runAllImmediates` for modern versions of Node because bluebird uses `setImmediate` instead of `process.nextTick` for Node >0.10.

Closes https://github.com/facebook/react-native/pull/1382
Github Author: James Ide <ide@jameside.com>

Test Plan:  Run `npm test` with the latest version of jest.
2015-07-01 13:02:29 -08:00
James Ide 7a8398b956 [Flow] Update flowconfig's version req to 0.13.1, fix Movies example typechecking
Summary:
This should fix tests.

Closes https://github.com/facebook/react-native/pull/1819
Github Author: James Ide <ide@jameside.com>

Test Plan:  Run Travis CI tests. Also run the movies app and verify that there are no invariant violations.
2015-07-01 13:01:52 -08:00
James Ide 212bd2250c [Tests] Update tests to run on io.js with the latest version of jest
Updates the tests in small ways so they run on io.js with some updates:

 - The Cache test which relies on Promises uses `runAllImmediates` for modern versions of Node because bluebird uses `setImmediate` instead of `process.nextTick` for Node >0.10.

Test Plan: Run `npm test` with the latest version of jest.
2015-07-01 11:38:17 -07:00
Alexsander Akers 44c587e828 Updates from Wed 1 Jul 2015-07-01 19:10:35 +01:00
Joe Savona 776dc97437 InteractionManager: remove dev timeout warnings 2015-07-01 04:51:28 -08:00
James Ide 5418cdf071 [CocoaPods] Run npm install --production when installing React.podspec
Summary:
This omits the devDependencies (e.g. test infra), which are intended only for people working on RN.

Part of #1737.
Closes https://github.com/facebook/react-native/pull/1803
Github Author: James Ide <ide@jameside.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-07-01 03:18:05 -08:00
Philipp von Weitershausen 14fef6474d [ReactNative] expose missing haste modules through 'react-native' node module 2015-06-30 18:57:26 -08:00
Alex Kotliarskyi d7ddff7554 [ReactNative] Fix dev menu customization when JS fails to load 2015-06-30 17:13:27 -08:00
James Ide 301c01260d [Flow] Update flowconfig's version req to 0.13.1, fix Movies example typechecking
This should fix tests.

Test Plan: Run Travis CI tests. Also run the movies app and verify that there are no invariant violations.
2015-06-30 16:52:55 -07:00
Brent Vatne 4e6f48c650 Merge pull request #1820 from rnplay/runnable-docs
Start adding links to runnable examples in the documentation
2015-06-30 14:51:07 -07:00
Joshua Sierles 5af8849aa4 [Docs] Add a 'run this example' link to AlertIOS docs, plus supporting code to add more links progressively 2015-06-30 23:39:49 +02:00
James Ide eee630827a Merge pull request #1818 from facebook/amasad-patch-1
Don't encourage the use of internal modules
2015-06-30 13:13:50 -07:00
James Ide 5a206d2fee Merge pull request #1817 from facebook/amasad-docs-patch
Don't encourage the use of internal modules
2015-06-30 13:13:13 -07:00
Amjad Masad 82ca3364c6 Don't encourage the use of internal modules 2015-06-30 13:12:47 -07:00
Amjad Masad e5ba0f388b Don't encourage the use of internal modules 2015-06-30 13:12:00 -07:00
Brent Vatne 97bf9a6b4d Merge pull request #1811 from dhrrgn/dhrrgn-timermixin-docs
[Docs] Update TimerMixin docs.
2015-06-30 10:41:50 -07:00
Dan Horrigan cae410bda0 [Docs] Update TimerMixin docs.
Adds in install instructions for `react-timer-mixin` to the `TimerMixin` docs.
2015-06-30 13:23:40 -04:00
James Ide e3225f3403 [Bridge] Support nullability annotations in bridged methods
Summary:
Fixes a crash due to the selector regex not knowing about the nullability annotations. Adds support for both the core annotations `__nullable` and `__nonnull` plus their shorthand counterparts `nullable` and `nonnull`.

Objective-C allows the shorthand versions only at the front of a parameter type declaration like `(nullable NSString *)` but the regex will pick up `(NSString * nullable)` too. This shouldn't cause any adverse effects and I left the code this way to keep the regex readable.

Fixes #1795

Closes https://github.com/facebook/react-native/pull/1796
Github Author: James Ide <ide@jameside.com>

Test Plan:
 Wrote a bridge method that uses a nullability annotation and verified that it didn't cause the app to crash:
```
RCT_EXPORT_METHOD(method:(nullable NSNumber *)reactTag)
{
}
```

Also added a nullable annotation to RCTTest.
2015-06-30 04:17:20 -08:00
Amjad Masad 7d184adf1a [react-packager] Use latest babel-core in place of babel (40% perf improvement) 2015-06-30 03:55:21 -08:00
Jeff Morrison 9f22f67599 [flow 0.13.1] Deploy to 2015-06-29 20:49:05 -08:00
Dmitry Soshnikov 555236865b [react-native][jest] Sync to 0.5.x and update to io.js 2015-06-29 20:36:34 -08:00
Matt Revell cf6ff3f815 #1562 Rename 'tick' to 'onTick' to pass iTunes Connect validation.
Summary:
Should close this issue and successfully pass iTunes Connect validation.
Closes https://github.com/facebook/react-native/pull/1722
Github Author: Matt Revell <mattrevell82@me.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-06-29 06:51:44 -08:00
Alex Akers 454b5f3c0b [React Native] Replace RCTCache with NSURLCache 2015-06-29 05:26:35 -08:00
James Ide c953aa7e0b [Executor] Make executor ID functions non-static to fix ASan
Summary:
When `RCTGetExecutorID` was a static function in the header file, it would return nil when the app was running with ASan enabled even though directly calling `objc_getAssociatedObject(executor, RCTJavaScriptExecutorID)` returned the correct ID as an NSNumber. Moving this function into the .m file fixes this issue.

Closes https://github.com/facebook/react-native/pull/1712
Github Author: James Ide <ide@jameside.com>

Test Plan:  Run the UIExplorer with ASan enabled in Xcode 7. Before this diff, the app would just hang since the executor was unable to read a valid ID and so it would bail out from running JS. With this diff the executor runs the JS and the UIExplorer works fine.
2015-06-29 04:30:29 -08:00
Andy Street 7196445cc6 [react_native] Update common UI examples 2015-06-29 04:20:04 -08:00
Nick Lockwood 8708c35702 Restructuring FBReactKit project: Part 2 2015-06-28 11:49:41 -08:00
Amjad Masad 73b032ab87 [react-packager] Update sane to get a new version of fb-watchman (perf) 2015-06-26 17:48:39 -08:00
Joe Wood 19e32399b0 [Packager] Windows support for Packager - Blacklist changes
Summary:
Another Pull Request implementing the changes in issue #468 - Enabled Packager to run on Windows
This change relates to the blacklist fixes. It includes the path conversion for blacklist and changes to the default watched directory.  It has no impact on Mac OSX.
Closes https://github.com/facebook/react-native/pull/893
Github Author: Joe Wood <joewood>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-06-26 16:27:12 -08:00
Amjad Masad de020b44c9 [react-packager] Enable watchman fs crawl
Summary:
@public
Now that watchman perf issue was fixed we can enable watchman-based fs crawling which is faster than node.
This showed an existing issue with some files missing from the blacklist which I addressed.

Test Plan:
./fbrnios.sh run
click around and scroll all the apps
2015-06-26 16:20:50 -08:00
Johannes Lumpe 1461e4a17e [Packager] Allow user to specify a custom transformer file
Summary:
This is an edited re-submission of #1458 because I'm stupid.
Closes https://github.com/facebook/react-native/pull/1497
Github Author: Johannes Lumpe <johannes@johanneslumpe.de>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-06-26 16:00:37 -08:00
Alexander Kotliarskyi 951b5f9517 Merge pull request #1761 from frantic/updates-26-jun
Updates from Fri, 26 Jun
2015-06-26 15:37:06 -07:00
Alex Kotliarskyi 843e181542 Updates from Fri 26, Jun 2015-06-26 15:16:59 -07:00
Spencer Ahrens 29e49bdb91 [ReactNative] LayoutAnimation brevity
Summary:
@public

Less verbose - now can just do `LayoutAnimation.easeInEaseOut()` instead of
`LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut)`

Test Plan: D2171336, play with AdsManager pickers.
2015-06-26 10:48:36 -08:00
James Ide fe7edf0860 [ListView] Defer measurement one frame after componentDidMount to fix error
Summary:
When `UIManager.measure` is called from `componentDidMount` it causes the error "Attempted to measure layout but offset or dimensions were NaN". Deferring the layout by one frame solves this problem. Layout measurement is already asynchronous anyway, so I believe adding the `requestAnimationFrame` call doesn't affect the program's correctness.

Fixes #1749

Closes https://github.com/facebook/react-native/pull/1750
Github Author: James Ide <ide@jameside.com>

Test Plan:
 Load UIExplorer and no longer get a redbox that says "Attempted to measure layout but offset or dimensions were NaN".
2015-06-26 10:26:07 -08:00
Owen Kelly 1cca4fb769 [NavigatorIOS] Allow translucent on NavigatorIOS
Summary:
Hi,

I've updated the NavigatorIOS component to allow setting the translucent property.

usage is:
```
            <NavigatorIOS
                translucent={false}
            />
```

This is my first contrib to react-native, so apologies if I've missed something.

Cheers,
Owen
Closes https://github.com/facebook/react-native/pull/1273
Github Author: Owen Kelly <owen@novede.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-06-26 07:17:54 -08:00
Kevin Gozali 3ec3312c7c [madman]: Fix MapView crashing problem. 2015-06-25 21:21:08 -08:00
Eric Vicenti e3e60983e6 [ReactNative] Navigator improved willFocus logic
Summary:
This makes sure to call willFocus before new scenes get mounted. This fixes cases where the keyboard is dismissed on willfocus events which incorrectly happens *after* the autofocus in a new scene. The keyboard was opening and getting immediately closed

@public

Test Plan: Test keyboard autofocus in new nav scenes on iOS
2015-06-25 14:45:23 -08:00
chaceliang 7159a4e947 Revert "[React Native] Remove layout-only nodes" 2015-06-25 13:30:06 -08:00
Eric Vicenti 7963add0d5 [ReactNative] Revamp Navigator scene cache strategy
Summary:
Updating range is too complicated. We can keep cached versions of the previously rendered scenes in a map.

@public

Test Plan: Verify that the active scene is the only thing that get re-rendered, and that rendering doesn't happen during transitions or gestures. Test navigation thouroughly in AdsManager
2015-06-25 10:36:49 -08:00
Tadeu Zagallo 5e71d352a6 [ReactNative] Guard agains errors during reconciliation
Summary:
@public

After refactoring the MessageQueue a guard was missing on around `batchedUpdates`
call.

Test Plan: Introduce an error on `getInitialState` of `AdsManagerTabsModalView.ios.js`
2015-06-25 09:40:48 -08:00
Stanislav Vishnevskiy f383bf2b83 [LayoutAnimation] RCTAnimationTypeKeyboard
Summary:
This adds the Keyboard animation type for when you want to animate UI based on the keyboard appearing/disappearing.
Closes https://github.com/facebook/react-native/pull/1366
Github Author: Stanislav Vishnevskiy <vishnevskiy@gmail.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-06-25 09:17:01 -08:00
David Mohl 99bc08cf61 [MapView] Support for annotation callouts, annotation press, callout presses and pin animation
Summary:
Started from here - https://github.com/facebook/react-native/issues/1120. Most functionality for annotations were missing so I started implementing and somehow got caught up until the entire thing was done.

![screen shot 2015-05-12 at 10 07 43 pm](https://cloud.githubusercontent.com/assets/688326/7588677/8479a7a4-f8f9-11e4-99a4-1dc3c7691810.png)

2 new events:
- callout presses (left / right)
- annotation presses

6 new properties for annotations:
- hasLeftCallout
- hasRightCallout
- onLeftCalloutPress
- onRightCalloutPress
- animateDrop
- id

1 new property for MapView
- onAnnotationPress

---
Now the important thing is, that I implemented all of this the way "I would do it". I am not sure this is the 'reacty' way so please let me know my mistakes 😄

The problem is that there is no real way to identify annotations which makes it difficult to distinguish which one got clicked. The idea is to pass a `id` and whether it has callouts the entire way with the annotation. I had to
Closes https://github.com/facebook/react-native/pull/1247
Github Author: David Mohl <me@dave.cx>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-06-25 09:15:21 -08:00
Alex Akers 3c5b4b0a9f [React Native] Remove layout-only nodes
Summary:
Remove layout-only views. Works by checking properties against a list of known properties that only affect layout. The `RCTShadowView` hierarchy still has a 1:1 correlation with the JS nodes.

This works by adjusting the tags and indices in `manageChildren`. For example, if JS told us to insert tag 1 at index 0 and tag 1 is layout-only with children whose tags are 2 and 3, we adjust it so we insert tags 2 and 3 at indices 0 and 1. This keeps changes out of `RCTView` and `RCTScrollView`. In order to simplify this logic, view moves are now processed as view removals followed by additions. A move from index 0 to 1 is recorded as a removal of view at indices 0 and 1 and an insertion of tags 1 and 2 at indices 0 and 1. Of course, the remaining indices have to be offset to take account for this.

The `collapsible` attribute is a bit of a hack to force `RCTScrollView` to always have one child. This was easier than rethinking out the logic there, but we could change this later.

@public

Test Plan: There are tests in `RCTUIManagerTests.m` that test the tag- and index-manipulation logic works. There are various scenarios including add-only, remove-only, and move. In addition, two scenario tests verify that the optimization works by checking the number of views and shadow views after various situations happen.
2015-06-25 09:12:00 -08:00
Prathamesh Sonpatki ffe80fa10a [DOC] Removed unwanted "e.g" from documentation of multiSet 2015-06-20 10:31:48 +05:30
Leonardo YongUk Kim 01d93d294d Remove invariant of Sample.ios.js that is not used 2015-05-26 18:25:00 -07:00
Leonardo YongUk Kim 253461cb51 Use singlequote instead of doublequoe on Sample.android.js 2015-05-26 14:12:28 -07:00
1273 changed files with 93717 additions and 15010 deletions
+1 -6
View File
@@ -55,7 +55,6 @@
"no-debugger": 1, // disallow use of debugger
"no-dupe-keys": 1, // disallow duplicate keys when creating object literals
"no-empty": 0, // disallow empty statements
"no-empty-class": 1, // disallow the use of empty character classes in regular expressions
"no-ex-assign": 1, // disallow assigning to the exception in a catch block
"no-extra-boolean-cast": 1, // disallow double-negation boolean casts in a boolean context
"no-extra-parens": 0, // disallow unnecessary parentheses (off by default)
@@ -126,9 +125,7 @@
// Strict Mode
// These rules relate to using strict mode.
"global-strict": [2, "always"], // require or disallow the "use strict" pragma in the global scope (off by default in the node environment)
"no-extra-strict": 1, // disallow unnecessary use of "use strict"; when already in strict mode
"strict": 0, // require that all functions are run in strict mode
"strict": [2, "global"], // require or disallow the "use strict" pragma in the global scope (off by default in the node environment)
// Variables
// These rules have to do with variable declarations.
@@ -174,11 +171,9 @@
"no-lonely-if": 0, // disallow if as the only statement in an else block (off by default)
"no-new-object": 1, // disallow use of the Object constructor
"no-spaced-func": 1, // disallow space between function identifier and application
"no-space-before-semi": 1, // disallow space before semicolon
"no-ternary": 0, // disallow the use of ternary operators (off by default)
"no-trailing-spaces": 1, // disallow trailing whitespace at the end of lines
"no-underscore-dangle": 0, // disallow dangling underscores in identifiers
"no-wrap-func": 1, // disallow wrapping of non-IIFE statements in parens
"no-mixed-spaces-and-tabs": 1, // disallow mixed spaces and tabs for indentation
"quotes": [1, "single", "avoid-escape"], // specify whether double or single quotes should be used
"quote-props": 0, // require quotes around object literal property names (off by default)
+12 -9
View File
@@ -9,11 +9,10 @@
# Ignore react-tools where there are overlaps, but don't ignore anything that
# react-native relies on
.*/node_modules/react-tools/src/vendor/core/ExecutionEnvironment.js
.*/node_modules/react-tools/src/browser/eventPlugins/ResponderEventPlugin.js
.*/node_modules/react-tools/src/browser/ui/React.js
.*/node_modules/react-tools/src/core/ReactInstanceHandles.js
.*/node_modules/react-tools/src/event/EventPropagators.js
.*/node_modules/react-tools/src/React.js
.*/node_modules/react-tools/src/renderers/shared/event/EventPropagators.js
.*/node_modules/react-tools/src/renderers/shared/event/eventPlugins/ResponderEventPlugin.js
.*/node_modules/react-tools/src/shared/vendor/core/ExecutionEnvironment.js
# Ignore commoner tests
.*/node_modules/commoner/test/.*
@@ -31,18 +30,22 @@
[libs]
Libraries/react-native/react-native-interface.js
Examples/UIExplorer/ImageMocks.js
[options]
module.system=haste
munge_underscores=true
module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
module.name_mapper='^[./a-zA-Z0-9$_-]+\.png$' -> 'RelativeImageStub'
suppress_type=$FlowIssue
suppress_type=$FlowFixMe
suppress_type=$FixMe
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(1[0-2]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(1[0-2]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)? #[0-9]+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(1[0-7]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(1[0-7]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)? #[0-9]+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
[version]
0.12.0
0.17.0
+12 -3
View File
@@ -4,7 +4,6 @@
!**/*.xcworkspacedata
!**/*.xcsettings
!**/*.xcscheme
build/
*.pbxuser
!default.pbxuser
*.mode1v3
@@ -22,9 +21,19 @@ DerivedData
*.xcuserstate
project.xcworkspace
# OS X
.DS_Store
# Xcode, Gradle
build/
# Android
.idea
.gradle
local.properties
*.iml
# Node
node_modules
*.log
.nvm
# OS X
.DS_Store
+20 -11
View File
@@ -1,28 +1,25 @@
language: objective-c
osx_image: beta-xcode6.3
osx_image: xcode7
cache:
directories:
- node_modules
- .nvm
before_install:
- brew update
install:
- brew reinstall flow xctool nvm
- brew reinstall nvm
- mkdir -p .nvm
- cp $(brew --prefix nvm)/nvm-exec .nvm/
- export NVM_DIR=.nvm
- export NVM_DIR="$PWD/.nvm"
- source $(brew --prefix nvm)/nvm.sh
- nvm install v0.10
- nvm install 4
- rm -Rf "${TMPDIR}/jest_preprocess_cache"
- npm config set spin=false
- npm install -g flow-bin@`node -p "require('fs').readFileSync('.flowconfig', 'utf8').split('[version]')[1].trim()"`
- npm install
script:
- |
nvm use v0.10
if [ "$TEST_TYPE" = objc ]
then
@@ -31,13 +28,23 @@ script:
elif [ "$TEST_TYPE" = js ]
then
flow check && npm test
flow check && npm test -- '\/Libraries\/'
elif [ "$TEST_TYPE" = packager ]
then
npm test -- '\/packager\/'
elif [ "$TEST_TYPE" = cli ]
then
npm test -- '\/(local|private|react-native)-cli\/'
elif [ "$TEST_TYPE" = build_website ]
then
cd website
npm install
$(which npm) install
./setup.sh
if [ "$TRAVIS_PULL_REQUEST" = false ] && [ "$TRAVIS_BRANCH" = master ]; then
# Automatically publish the website
@@ -60,6 +67,8 @@ env:
matrix:
- TEST_TYPE=objc
- TEST_TYPE=js
- TEST_TYPE=packager
- TEST_TYPE=cli
- TEST_TYPE=build_website
- TEST_TYPE=e2e
global:
+3 -2
View File
@@ -21,7 +21,8 @@ The core team will be monitoring for pull requests. When we get one, we'll run s
3. If you've changed APIs, update the documentation.
4. Ensure tests pass on Travis.
5. Make sure your code lints (`node linter.js <files touched>`).
6. If you haven't already, complete the CLA.
6. Squash your commits (`git rebase -i`).
7. If you haven't already, complete the CLA.
### Contributor License Agreement (CLA)
@@ -33,7 +34,7 @@ In order to accept your pull request, we need you to submit a CLA. You only need
### Where to Find Known Issues
We will be using GitHub Issues for our public bugs. We will keep a close eye on this and try to make it clear when we have an internal fix in progress. Before filing a new task, try to make sure your problem doesn't already exist.
We are using GitHub Issues for our public bugs. We keep a close eye on this and try to make it clear when we have an internal fix in progress. Before filing a new task, try to make sure your problem doesn't already exist.
### Reporting New Issues
+19 -25
View File
@@ -12,7 +12,7 @@
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
1461632D1AC3E23900C2F5AD /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 1461632C1AC3E22900C2F5AD /* libReact.a */; };
58C1E40E1ACF54E9006D1A47 /* libRCTAnimationExperimental.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 58C1E40B1ACF54B4006D1A47 /* libRCTAnimationExperimental.a */; };
5F82F1781B85785200FAE87E /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5F82F1771B85784500FAE87E /* libRCTWebSocket.a */; };
832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; };
/* End PBXBuildFile section */
@@ -24,12 +24,12 @@
remoteGlobalIDString = 83CBBA2E1A601D0E00E9B192;
remoteInfo = React;
};
58C1E40A1ACF54B4006D1A47 /* PBXContainerItemProxy */ = {
5F82F1761B85784500FAE87E /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
containerPortal = 13ACB66C1AC2113500FF4204 /* RCTAnimationExperimental.xcodeproj */;
containerPortal = 5F82F1721B85784500FAE87E /* RCTWebSocket.xcodeproj */;
proxyType = 2;
remoteGlobalIDString = 134814201AA4EA6300B7C361;
remoteInfo = RCTAnimationExperimental;
remoteGlobalIDString = 3C86DF461ADF2C930047B81A;
remoteInfo = RCTWebSocket;
};
832341B41AAA6A8300B99B32 /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
@@ -41,7 +41,6 @@
/* End PBXContainerItemProxy section */
/* Begin PBXFileReference section */
13ACB66C1AC2113500FF4204 /* RCTAnimationExperimental.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTAnimationExperimental.xcodeproj; path = ../../Libraries/Animation/RCTAnimationExperimental.xcodeproj; sourceTree = "<group>"; };
13B07F961A680F5B00A75B9A /* 2048.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = 2048.app; sourceTree = BUILT_PRODUCTS_DIR; };
13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = 2048/AppDelegate.h; sourceTree = "<group>"; };
13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = 2048/AppDelegate.m; sourceTree = "<group>"; };
@@ -50,6 +49,7 @@
13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = 2048/Info.plist; sourceTree = "<group>"; };
13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = 2048/main.m; sourceTree = "<group>"; };
146163271AC3E22900C2F5AD /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../../React/React.xcodeproj; sourceTree = "<group>"; };
5F82F1721B85784500FAE87E /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../../Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../../Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
/* End PBXFileReference section */
@@ -58,8 +58,8 @@
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
5F82F1781B85785200FAE87E /* libRCTWebSocket.a in Frameworks */,
1461632D1AC3E23900C2F5AD /* libReact.a in Frameworks */,
58C1E40E1ACF54E9006D1A47 /* libRCTAnimationExperimental.a in Frameworks */,
832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
@@ -88,10 +88,10 @@
name = Products;
sourceTree = "<group>";
};
58C1E4071ACF54B4006D1A47 /* Products */ = {
5F82F1731B85784500FAE87E /* Products */ = {
isa = PBXGroup;
children = (
58C1E40B1ACF54B4006D1A47 /* libRCTAnimationExperimental.a */,
5F82F1771B85784500FAE87E /* libRCTWebSocket.a */,
);
name = Products;
sourceTree = "<group>";
@@ -99,9 +99,9 @@
832341AE1AAA6A7D00B99B32 /* Libraries */ = {
isa = PBXGroup;
children = (
5F82F1721B85784500FAE87E /* RCTWebSocket.xcodeproj */,
146163271AC3E22900C2F5AD /* React.xcodeproj */,
832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */,
13ACB66C1AC2113500FF4204 /* RCTAnimationExperimental.xcodeproj */,
);
name = Libraries;
sourceTree = "<group>";
@@ -174,14 +174,14 @@
productRefGroup = 83CBBA001A601CBA00E9B192 /* Products */;
projectDirPath = "";
projectReferences = (
{
ProductGroup = 58C1E4071ACF54B4006D1A47 /* Products */;
ProjectRef = 13ACB66C1AC2113500FF4204 /* RCTAnimationExperimental.xcodeproj */;
},
{
ProductGroup = 832341B11AAA6A8300B99B32 /* Products */;
ProjectRef = 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */;
},
{
ProductGroup = 5F82F1731B85784500FAE87E /* Products */;
ProjectRef = 5F82F1721B85784500FAE87E /* RCTWebSocket.xcodeproj */;
},
{
ProductGroup = 146163281AC3E22900C2F5AD /* Products */;
ProjectRef = 146163271AC3E22900C2F5AD /* React.xcodeproj */;
@@ -202,11 +202,11 @@
remoteRef = 1461632B1AC3E22900C2F5AD /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
58C1E40B1ACF54B4006D1A47 /* libRCTAnimationExperimental.a */ = {
5F82F1771B85784500FAE87E /* libRCTWebSocket.a */ = {
isa = PBXReferenceProxy;
fileType = archive.ar;
path = libRCTAnimationExperimental.a;
remoteRef = 58C1E40A1ACF54B4006D1A47 /* PBXContainerItemProxy */;
path = libRCTWebSocket.a;
remoteRef = 5F82F1761B85784500FAE87E /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
832341B51AAA6A8300B99B32 /* libRCTText.a */ = {
@@ -266,10 +266,7 @@
);
INFOPLIST_FILE = "$(SRCROOT)/2048/Info.plist";
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"/Users/sahrens/src/fbobjc-hg/Libraries/FBReactKit/js/react-native-github/Libraries/Animation/build/Debug-iphoneos",
);
LIBRARY_SEARCH_PATHS = "$(inherited)";
OTHER_LDFLAGS = "-ObjC";
PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
PRODUCT_NAME = 2048;
@@ -287,10 +284,7 @@
);
INFOPLIST_FILE = "$(SRCROOT)/2048/Info.plist";
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
LIBRARY_SEARCH_PATHS = (
"$(inherited)",
"/Users/sahrens/src/fbobjc-hg/Libraries/FBReactKit/js/react-native-github/Libraries/Animation/build/Debug-iphoneos",
);
LIBRARY_SEARCH_PATHS = "$(inherited)";
OTHER_LDFLAGS = "-ObjC";
PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
PRODUCT_NAME = 2048;
+3 -2
View File
@@ -36,14 +36,14 @@
* on the same Wi-Fi network.
*/
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/2048/Game2048.includeRequire.runModule.bundle"];
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/2048/Game2048.bundle?platform=ios&dev=true"];
/**
* OPTION 2
* Load from pre-bundled file on disk. To re-generate the static bundle, `cd`
* to your Xcode project folder in the terminal, and run
*
* $ curl 'http://localhost:8081/Examples/2048/Game2048.includeRequire.runModule.bundle' -o main.jsbundle
* $ curl 'http://localhost:8081/Examples/2048/Game2048.bundle?platform=ios' -o main.jsbundle
*
* then add the `main.jsbundle` file to your project and uncomment this line:
*/
@@ -52,6 +52,7 @@
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"Game2048"
initialProperties:nil
launchOptions:launchOptions];
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
+39 -41
View File
@@ -24,7 +24,7 @@ var {
View,
} = React;
var AnimationExperimental = require('AnimationExperimental');
var Animated = require('Animated');
var GameBoard = require('GameBoard');
var TouchableBounce = require('TouchableBounce');
@@ -53,58 +53,58 @@ class Board extends React.Component {
}
class Tile extends React.Component {
static _getPosition(index): number {
return BOARD_PADDING + (index * (CELL_SIZE + CELL_MARGIN * 2) + CELL_MARGIN);
}
constructor(props: {}) {
super(props);
var tile = this.props.tile;
this.state = {
opacity: new Animated.Value(0),
top: new Animated.Value(Tile._getPosition(tile.toRow())),
left: new Animated.Value(Tile._getPosition(tile.toColumn())),
};
}
calculateOffset(): {top: number; left: number; opacity: number} {
var tile = this.props.tile;
var pos = (i) => {
return BOARD_PADDING + (i * (CELL_SIZE + CELL_MARGIN * 2) + CELL_MARGIN);
};
var animationPosition = (i) => {
return pos(i) + (CELL_SIZE / 2);
};
var offset = {
top: pos(tile.toRow()),
left: pos(tile.toColumn()),
opacity: 1,
top: this.state.top,
left: this.state.left,
opacity: this.state.opacity,
};
if (tile.isNew()) {
offset.opacity = 0;
} else {
var point = {
x: animationPosition(tile.toColumn()),
y: animationPosition(tile.toRow()),
};
AnimationExperimental.startAnimation({
node: this.refs['this'],
Animated.timing(this.state.opacity, {
duration: 100,
easing: 'easeInOutQuad',
property: 'position',
toValue: point,
});
toValue: 1,
}).start();
} else {
Animated.parallel([
Animated.timing(offset.top, {
duration: 100,
toValue: Tile._getPosition(tile.toRow()),
}),
Animated.timing(offset.left, {
duration: 100,
toValue: Tile._getPosition(tile.toColumn()),
}),
]).start();
}
return offset;
}
componentDidMount() {
AnimationExperimental.startAnimation({
node: this.refs['this'],
duration: 100,
easing: 'easeInOutQuad',
property: 'opacity',
toValue: 1,
});
}
render() {
var tile = this.props.tile;
var tileStyles = [
styles.tile,
styles['tile' + tile.value],
this.calculateOffset()
this.calculateOffset(),
];
var textStyles = [
@@ -115,9 +115,9 @@ class Tile extends React.Component {
];
return (
<View ref="this" style={tileStyles}>
<Animated.View style={tileStyles}>
<Text style={textStyles}>{tile.value}</Text>
</View>
</Animated.View>
);
}
}
@@ -136,10 +136,8 @@ class GameEndOverlay extends React.Component {
return (
<View style={styles.overlay}>
<Text style={styles.overlayMessage}>{message}</Text>
<TouchableBounce onPress={this.props.onRestart}>
<View style={styles.tryAgain}>
<Text style={styles.tryAgainText}>Try Again?</Text>
</View>
<TouchableBounce onPress={this.props.onRestart} style={styles.tryAgain}>
<Text style={styles.tryAgainText}>Try Again?</Text>
</TouchableBounce>
</View>
);
+8 -2
View File
@@ -19,9 +19,11 @@ var React = require('react-native');
var {
Image,
PixelRatio,
Platform,
StyleSheet,
Text,
TouchableHighlight,
TouchableNativeFeedback,
View
} = React;
@@ -32,9 +34,13 @@ var getTextFromScore = require('./getTextFromScore');
var MovieCell = React.createClass({
render: function() {
var criticsScore = this.props.movie.ratings.critics_score;
var TouchableElement = TouchableHighlight;
if (Platform.OS === 'android') {
TouchableElement = TouchableNativeFeedback;
}
return (
<View>
<TouchableHighlight
<TouchableElement
onPress={this.props.onSelect}
onShowUnderlay={this.props.onHighlight}
onHideUnderlay={this.props.onUnhighlight}>
@@ -59,7 +65,7 @@ var MovieCell = React.createClass({
</Text>
</View>
</View>
</TouchableHighlight>
</TouchableElement>
</View>
);
}
@@ -216,7 +216,7 @@
83CBB9F71A601CBA00E9B192 /* Project object */ = {
isa = PBXProject;
attributes = {
LastUpgradeCheck = 0610;
LastUpgradeCheck = 0700;
ORGANIZATIONNAME = Facebook;
};
buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "Movies" */;
@@ -358,6 +358,7 @@
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
LIBRARY_SEARCH_PATHS = "$(inherited)";
OTHER_LDFLAGS = "-ObjC";
PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
PRODUCT_NAME = Movies;
USER_HEADER_SEARCH_PATHS = "$(SRCROOT)/../../Libraries/**";
};
@@ -376,6 +377,7 @@
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
LIBRARY_SEARCH_PATHS = "$(inherited)";
OTHER_LDFLAGS = "-ObjC";
PRODUCT_BUNDLE_IDENTIFIER = "com.facebook.$(PRODUCT_NAME:rfc1034identifier)";
PRODUCT_NAME = Movies;
USER_HEADER_SEARCH_PATHS = "$(SRCROOT)/../../Libraries/**";
};
@@ -401,6 +403,7 @@
"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
COPY_PHASE_STRIP = NO;
ENABLE_STRICT_OBJC_MSGSEND = YES;
ENABLE_TESTABILITY = YES;
GCC_C_LANGUAGE_STANDARD = gnu99;
GCC_DYNAMIC_NO_PIC = NO;
GCC_OPTIMIZATION_LEVEL = 0;
@@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<Scheme
LastUpgradeVersion = "0610"
LastUpgradeVersion = "0700"
version = "1.3">
<BuildAction
parallelizeBuildables = "YES"
@@ -38,6 +38,8 @@
ReferencedContainer = "container:Movies.xcodeproj">
</BuildableReference>
</MacroExpansion>
<AdditionalOptions>
</AdditionalOptions>
</TestAction>
<LaunchAction
selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
@@ -47,8 +49,10 @@
buildConfiguration = "Debug"
ignoresPersistentStateOnLaunch = "NO"
debugDocumentVersioning = "YES"
debugServiceExtension = "internal"
allowLocationSimulation = "YES">
<BuildableProductRunnable>
<BuildableProductRunnable
runnableDebuggingMode = "0">
<BuildableReference
BuildableIdentifier = "primary"
BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
@@ -66,7 +70,8 @@
useCustomWorkingDirectory = "NO"
buildConfiguration = "Release"
debugDocumentVersioning = "YES">
<BuildableProductRunnable>
<BuildableProductRunnable
runnableDebuggingMode = "0">
<BuildableReference
BuildableIdentifier = "primary"
BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
+3 -2
View File
@@ -37,14 +37,14 @@
* on the same Wi-Fi network.
*/
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/Movies/MoviesApp.includeRequire.runModule.bundle"];
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/Movies/MoviesApp.ios.bundle?platform=ios&dev=true"];
/**
* OPTION 2
* Load from pre-bundled file on disk. To re-generate the static bundle, `cd`
* to your Xcode project folder in the terminal, and run
*
* $ curl 'http://localhost:8081/Examples/Movies/MoviesApp.includeRequire.runModule.bundle' -o main.jsbundle
* $ curl 'http://localhost:8081/Examples/Movies/MoviesApp.ios.bundle?platform=ios&dev=true' -o main.jsbundle
*
* then add the `main.jsbundle` file to your project and uncomment this line:
*/
@@ -53,6 +53,7 @@
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"MoviesApp"
initialProperties:nil
launchOptions:launchOptions];
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
+6 -7
View File
@@ -7,7 +7,7 @@
<key>CFBundleExecutable</key>
<string>$(EXECUTABLE_NAME)</string>
<key>CFBundleIdentifier</key>
<string>com.facebook.$(PRODUCT_NAME:rfc1034identifier)</string>
<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
<key>CFBundleInfoDictionaryVersion</key>
<string>6.0</string>
<key>CFBundleName</key>
@@ -33,6 +33,11 @@
<string>1</string>
<key>LSRequiresIPhoneOS</key>
<true/>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
<key>UILaunchStoryboardName</key>
<string>LaunchScreen</string>
<key>UIRequiredDeviceCapabilities</key>
@@ -47,11 +52,5 @@
</array>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
<key>NSAppTransportSecurity</key>
<dict>
<!--See http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/-->
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
</dict>
</plist>
+94
View File
@@ -0,0 +1,94 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @providesModule MoviesApp
* @flow
*/
'use strict';
var React = require('react-native');
var {
AppRegistry,
BackAndroid,
Navigator,
StyleSheet,
ToolbarAndroid,
View,
} = React;
var MovieScreen = require('./MovieScreen');
var SearchScreen = require('./SearchScreen');
var _navigator;
BackAndroid.addEventListener('hardwareBackPress', () => {
if (_navigator && _navigator.getCurrentRoutes().length > 1) {
_navigator.pop();
return true;
}
return false;
});
var RouteMapper = function(route, navigationOperations, onComponentRef) {
_navigator = navigationOperations;
if (route.name === 'search') {
return (
<SearchScreen navigator={navigationOperations} />
);
} else if (route.name === 'movie') {
return (
<View style={{flex: 1}}>
<ToolbarAndroid
actions={[]}
navIcon={require('image!android_back_white')}
onIconClicked={navigationOperations.pop}
style={styles.toolbar}
titleColor="white"
title={route.movie.title} />
<MovieScreen
style={{flex: 1}}
navigator={navigationOperations}
movie={route.movie}
/>
</View>
);
}
};
var MoviesApp = React.createClass({
render: function() {
var initialRoute = {name: 'search'};
return (
<Navigator
style={styles.container}
initialRoute={initialRoute}
configureScene={() => Navigator.SceneConfigs.FadeAndroid}
renderScene={RouteMapper}
/>
);
}
});
var styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: 'white',
},
toolbar: {
backgroundColor: '#a9a9a9',
height: 56,
},
});
AppRegistry.registerComponent('MoviesApp', () => MoviesApp);
module.exports = MoviesApp;
+41
View File
@@ -0,0 +1,41 @@
# Movies app
The Movies app is a demonstration of basic concepts, such as fetching data, rendering a list of data including images, and navigating between different screens.
## Running this app
Before running the app, make sure you ran:
cd react-native
npm install
### Running on iOS
Mac OS and Xcode are required.
- Open `Examples/Movies/Movies.xcodeproj` in Xcode
- Hit the Run button
See [Running on device](https://facebook.github.io/react-native/docs/running-on-device-ios.html) if you want to use a physical device.
### Running on Android
You'll need to have all the [prerequisites](https://github.com/facebook/react-native/tree/master/ReactAndroid#prerequisites) (SDK, NDK) for Building React Native installed.
Start an Android emulator ([Genymotion](https://www.genymotion.com) is recommended).
cd react-native
./gradlew :Examples:Movies:android:app:installDebug
./packager/packager.sh
_Note: Building for the first time can take a while._
Open the Movies app in your emulator.
See [Running on Device](https://facebook.github.io/react-native/docs/running-on-device-android.html) in case you want to use a physical device.
## Built from source
Building the app on both iOS and Android means building the React Native framework from source. This way you're running the latest native and JS code the way you see it in your clone of the github repo.
This is different from apps created using `react-native init` which have a dependency on a specific version of React Native JS and native code, declared in a `package.json` file (and `build.gradle` for Android apps).
+104
View File
@@ -0,0 +1,104 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @providesModule SearchBar
* @flow
*/
'use strict';
var React = require('react-native');
var {
Image,
Platform,
ProgressBarAndroid,
TextInput,
StyleSheet,
TouchableNativeFeedback,
View,
} = React;
var IS_RIPPLE_EFFECT_SUPPORTED = Platform.Version >= 21;
var SearchBar = React.createClass({
render: function() {
var loadingView;
if (this.props.isLoading) {
loadingView = (
<ProgressBarAndroid
styleAttr="Large"
style={styles.spinner}
/>
);
} else {
loadingView = <View style={styles.spinner} />;
}
var background = IS_RIPPLE_EFFECT_SUPPORTED ?
TouchableNativeFeedback.SelectableBackgroundBorderless() :
TouchableNativeFeedback.SelectableBackground();
return (
<View style={styles.searchBar}>
<TouchableNativeFeedback
background={background}
onPress={() => this.refs.input && this.refs.input.focus()}>
<View>
<Image
source={require('image!android_search_white')}
style={styles.icon}
/>
</View>
</TouchableNativeFeedback>
<TextInput
ref="input"
autoCapitalize="none"
autoCorrect={false}
autoFocus={true}
onChange={this.props.onSearchChange}
placeholder="Search a movie..."
placeholderTextColor="rgba(255, 255, 255, 0.5)"
onFocus={this.props.onFocus}
style={styles.searchBarInput}
/>
{loadingView}
</View>
);
}
});
var styles = StyleSheet.create({
searchBar: {
flexDirection: 'row',
alignItems: 'center',
backgroundColor: '#a9a9a9',
height: 56,
},
searchBarInput: {
flex: 1,
fontSize: 20,
fontWeight: 'bold',
color: 'white',
height: 50,
padding: 0,
backgroundColor: 'transparent'
},
spinner: {
width: 30,
height: 30,
},
icon: {
width: 24,
height: 24,
marginHorizontal: 8,
},
});
module.exports = SearchBar;
+66
View File
@@ -0,0 +1,66 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @providesModule SearchBar
* @flow
*/
'use strict';
var React = require('react-native');
var {
ActivityIndicatorIOS,
TextInput,
StyleSheet,
View,
} = React;
var SearchBar = React.createClass({
render: function() {
return (
<View style={styles.searchBar}>
<TextInput
autoCapitalize="none"
autoCorrect={false}
onChange={this.props.onSearchChange}
placeholder="Search a movie..."
onFocus={this.props.onFocus}
style={styles.searchBarInput}
/>
<ActivityIndicatorIOS
animating={this.props.isLoading}
style={styles.spinner}
/>
</View>
);
}
});
var styles = StyleSheet.create({
searchBar: {
marginTop: 64,
padding: 3,
paddingLeft: 8,
flexDirection: 'row',
alignItems: 'center',
},
searchBarInput: {
fontSize: 15,
flex: 1,
height: 30,
},
spinner: {
width: 30,
},
});
module.exports = SearchBar;
+35 -47
View File
@@ -19,6 +19,8 @@ var React = require('react-native');
var {
ActivityIndicatorIOS,
ListView,
Platform,
ProgressBarAndroid,
StyleSheet,
Text,
TextInput,
@@ -26,8 +28,12 @@ var {
} = React;
var TimerMixin = require('react-timer-mixin');
var invariant = require('invariant');
var dismissKeyboard = require('dismissKeyboard');
var MovieCell = require('./MovieCell');
var MovieScreen = require('./MovieScreen');
var SearchBar = require('SearchBar');
/**
* This is for demo purposes only, and rate limited.
@@ -73,18 +79,16 @@ var SearchScreen = React.createClass({
this.searchMovies('');
},
_urlForQueryAndPage: function(query: string, pageNumber: ?number): string {
_urlForQueryAndPage: function(query: string, pageNumber: number): string {
var apiKey = API_KEYS[this.state.queryNumber % API_KEYS.length];
if (query) {
return (
// $FlowFixMe(>=0.13.0) - pageNumber may be null or undefined
API_URL + 'movies.json?apikey=' + apiKey + '&q=' +
encodeURIComponent(query) + '&page_limit=20&page=' + pageNumber
);
} else {
// With no query, load latest movies
return (
// $FlowFixMe(>=0.13.0) - pageNumber may be null or undefined
API_URL + 'lists/movies/in_theaters.json?apikey=' + apiKey +
'&page_limit=20&page=' + pageNumber
);
@@ -176,6 +180,7 @@ var SearchScreen = React.createClass({
});
var page = resultsCache.nextPageNumberForQuery[query];
invariant(page != null, 'Next page number for "%s" is missing', query);
fetch(this._urlForQueryAndPage(query, page))
.then((response) => response.json())
.catch((error) => {
@@ -218,11 +223,20 @@ var SearchScreen = React.createClass({
},
selectMovie: function(movie: Object) {
this.props.navigator.push({
title: movie.title,
component: MovieScreen,
passProps: {movie},
});
if (Platform.OS === 'ios') {
this.props.navigator.push({
title: movie.title,
component: MovieScreen,
passProps: {movie},
});
} else {
dismissKeyboard();
this.props.navigator.push({
title: movie.title,
name: 'movie',
movie: movie,
});
}
},
onSearchChange: function(event: Object) {
@@ -236,7 +250,15 @@ var SearchScreen = React.createClass({
if (!this.hasMore() || !this.state.isLoadingTail) {
return <View style={styles.scrollSpinner} />;
}
return <ActivityIndicatorIOS style={styles.scrollSpinner} />;
if (Platform.OS === 'ios') {
return <ActivityIndicatorIOS style={styles.scrollSpinner} />;
} else {
return (
<View style={{alignItems: 'center'}}>
<ProgressBarAndroid styleAttr="Large"/>
</View>
);
}
},
renderSeparator: function(
@@ -261,6 +283,7 @@ var SearchScreen = React.createClass({
) {
return (
<MovieCell
key={movie.id}
onSelect={() => this.selectMovie(movie)}
onHighlight={() => highlightRowFunc(sectionID, rowID)}
onUnhighlight={() => highlightRowFunc(null, null)}
@@ -293,7 +316,8 @@ var SearchScreen = React.createClass({
<SearchBar
onSearchChange={this.onSearchChange}
isLoading={this.state.isLoading}
onFocus={() => this.refs.listview.getScrollResponder().scrollTo(0, 0)}
onFocus={() =>
this.refs.listview && this.refs.listview.getScrollResponder().scrollTo(0, 0)}
/>
<View style={styles.separator} />
{content}
@@ -306,7 +330,7 @@ var NoMovies = React.createClass({
render: function() {
var text = '';
if (this.props.filter) {
text = `No results for ${this.props.filter}`;
text = `No results for "${this.props.filter}"`;
} else if (!this.props.isLoading) {
// If we're looking at the latest movies, aren't currently loading, and
// still have no results, show a message
@@ -321,27 +345,6 @@ var NoMovies = React.createClass({
}
});
var SearchBar = React.createClass({
render: function() {
return (
<View style={styles.searchBar}>
<TextInput
autoCapitalize="none"
autoCorrect={false}
onChange={this.props.onSearchChange}
placeholder="Search a movie..."
onFocus={this.props.onFocus}
style={styles.searchBarInput}
/>
<ActivityIndicatorIOS
animating={this.props.isLoading}
style={styles.spinner}
/>
</View>
);
}
});
var styles = StyleSheet.create({
container: {
flex: 1,
@@ -354,25 +357,10 @@ var styles = StyleSheet.create({
marginTop: 80,
color: '#888888',
},
searchBar: {
marginTop: 64,
padding: 3,
paddingLeft: 8,
flexDirection: 'row',
alignItems: 'center',
},
searchBarInput: {
fontSize: 15,
flex: 1,
height: 30,
},
separator: {
height: 1,
backgroundColor: '#eeeeee',
},
spinner: {
width: 30,
},
scrollSpinner: {
marginVertical: 20,
},
+35
View File
@@ -0,0 +1,35 @@
apply plugin: 'com.android.application'
android {
compileSdkVersion 23
buildToolsVersion "23.0.1"
defaultConfig {
applicationId "com.facebook.react.movies"
minSdkVersion 16
targetSdkVersion 22
versionCode 1
versionName "1.0"
ndk {
abiFilters "armeabi-v7a", "x86"
}
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
compile 'com.android.support:appcompat-v7:23.0.1'
// Depend on pre-built React Native
compile 'com.facebook.react:react-native:0.11.+'
// Depend on React Native source.
// This is useful for testing your changes when working on React Native.
// compile project(':ReactAndroid')
}
@@ -0,0 +1 @@
android.useDeprecatedNdk=true
+17
View File
@@ -0,0 +1,17 @@
# Add project specific ProGuard rules here.
# By default, the flags in this file are appended to flags specified
# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
# You can edit the include path and order by changing the proguardFiles
# directive in build.gradle.
#
# For more details, see
# http://developer.android.com/guide/developing/tools/proguard.html
# Add any project specific keep options here:
# If your project uses WebView with JS, uncomment the following
# and specify the fully qualified class name to the JavaScript interface
# class:
#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
# public *;
#}
@@ -0,0 +1,21 @@
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.facebook.react.movies">
<uses-permission android:name="android.permission.INTERNET" />
<application
android:allowBackup="true"
android:label="@string/app_name"
android:icon="@drawable/rotten_tomatoes_icon"
android:theme="@style/AppTheme">
<activity
android:name=".MoviesActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>
</manifest>
@@ -0,0 +1,89 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
package com.facebook.react.movies;
import android.app.Activity;
import android.os.Bundle;
import android.view.KeyEvent;
import com.facebook.react.LifecycleState;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactRootView;
import com.facebook.react.modules.core.DefaultHardwareBackBtnHandler;
import com.facebook.react.shell.MainReactPackage;
public class MoviesActivity extends Activity implements DefaultHardwareBackBtnHandler {
private ReactInstanceManager mReactInstanceManager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mReactInstanceManager = ReactInstanceManager.builder()
.setApplication(getApplication())
.setBundleAssetName("MoviesApp.android.bundle")
.setJSMainModuleName("Examples/Movies/MoviesApp.android")
.addPackage(new MainReactPackage())
.setUseDeveloperSupport(true)
.setInitialLifecycleState(LifecycleState.RESUMED)
.build();
((ReactRootView) findViewById(R.id.react_root_view))
.startReactApplication(mReactInstanceManager, "MoviesApp", null);
}
@Override
public boolean onKeyUp(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_MENU && mReactInstanceManager != null) {
mReactInstanceManager.showDevOptionsDialog();
return true;
}
return super.onKeyUp(keyCode, event);
}
@Override
protected void onPause() {
super.onPause();
if (mReactInstanceManager != null) {
mReactInstanceManager.onPause();
}
}
@Override
protected void onResume() {
super.onResume();
if (mReactInstanceManager != null) {
mReactInstanceManager.onResume(this);
}
}
@Override
public void onBackPressed() {
if (mReactInstanceManager != null) {
mReactInstanceManager.onBackPressed();
} else {
super.onBackPressed();
}
}
@Override
public void invokeDefaultOnBackPressed() {
super.onBackPressed();
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 237 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 575 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 190 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 337 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 266 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 581 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 337 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 930 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 57 KiB

@@ -0,0 +1,12 @@
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MoviesApp">
<com.facebook.react.ReactRootView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/react_root_view"/>
</RelativeLayout>
@@ -0,0 +1,3 @@
<resources>
<string name="app_name">MoviesApp</string>
</resources>
@@ -0,0 +1,8 @@
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
</style>
</resources>
+3 -1
View File
@@ -22,7 +22,9 @@ var {
var MAX_VALUE = 200;
function getStyleFromScore(score: number): {color: string} {
import type { StyleObj } from 'StyleSheetTypes';
function getStyleFromScore(score: number): StyleObj {
if (score < 0) {
return styles.noScore;
}
-27
View File
@@ -1,27 +0,0 @@
# OSX
#
.DS_Store
# Xcode
#
build/
*.pbxuser
!default.pbxuser
*.mode1v3
!default.mode1v3
*.mode2v3
!default.mode2v3
*.perspectivev3
!default.perspectivev3
xcuserdata
*.xccheckout
*.moved-aside
DerivedData
*.hmap
*.ipa
*.xcuserstate
# node.js
#
node_modules/
npm-debug.log
-36
View File
@@ -1,36 +0,0 @@
[ignore]
# We fork some components by platform.
.*/*.web.js
.*/*.android.js
# Some modules have their own node_modules with overlap
.*/node_modules/node-haste/.*
# Ignore react-tools where there are overlaps, but don't ignore anything that
# react-native relies on
.*/node_modules/react-tools/src/vendor/core/ExecutionEnvironment.js
.*/node_modules/react-tools/src/browser/eventPlugins/ResponderEventPlugin.js
.*/node_modules/react-tools/src/browser/ui/React.js
.*/node_modules/react-tools/src/core/ReactInstanceHandles.js
.*/node_modules/react-tools/src/event/EventPropagators.js
# Ignore commoner tests
.*/node_modules/commoner/test/.*
# See https://github.com/facebook/flow/issues/442
.*/react-tools/node_modules/commoner/lib/reader.js
# Ignore jest
.*/react-native/node_modules/jest-cli/.*
[include]
[libs]
node_modules/react-native/Libraries/react-native/react-native-interface.js
[options]
module.system=haste
[version]
0.12.0
@@ -14,6 +14,8 @@
13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
144C5F691AC3E5E300B004E7 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 144C5F681AC3E5D800B004E7 /* libReact.a */; };
58C572511AA6229D00CDF9C8 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 58C5724D1AA6224400CDF9C8 /* libRCTText.a */; };
5FF8942E1B85571A007731BE /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5FF8942D1B8556F8007731BE /* libRCTWebSocket.a */; };
832044981B492C2500E297FC /* libRCTSettings.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832044951B492C1E00E297FC /* libRCTSettings.a */; };
/* End PBXBuildFile section */
/* Begin PBXContainerItemProxy section */
@@ -38,6 +40,20 @@
remoteGlobalIDString = 58B5119B1A9E6C1200147676;
remoteInfo = RCTText;
};
5FF8942C1B8556F8007731BE /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
containerPortal = 5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */;
proxyType = 2;
remoteGlobalIDString = 3C86DF461ADF2C930047B81A;
remoteInfo = RCTWebSocket;
};
832044941B492C1E00E297FC /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
containerPortal = 8320448F1B492C1E00E297FC /* RCTSettings.xcodeproj */;
proxyType = 2;
remoteGlobalIDString = 134814201AA4EA6300B7C361;
remoteInfo = RCTSettings;
};
/* End PBXContainerItemProxy section */
/* Begin PBXFileReference section */
@@ -51,6 +67,8 @@
13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = TicTacToe/main.m; sourceTree = "<group>"; };
144C5F631AC3E5D800B004E7 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../../React/React.xcodeproj; sourceTree = "<group>"; };
587650DA1A9EB0DB008B8F17 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../../Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../../Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
8320448F1B492C1E00E297FC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = ../../Libraries/Settings/RCTSettings.xcodeproj; sourceTree = "<group>"; };
/* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */
@@ -58,9 +76,11 @@
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
5FF8942E1B85571A007731BE /* libRCTWebSocket.a in Frameworks */,
144C5F691AC3E5E300B004E7 /* libReact.a in Frameworks */,
1341803E1AA91802003F314A /* libRCTImage.a in Frameworks */,
58C572511AA6229D00CDF9C8 /* libRCTText.a in Frameworks */,
832044981B492C2500E297FC /* libRCTSettings.a in Frameworks */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@@ -99,8 +119,10 @@
58C572071AA6126D00CDF9C8 /* Libraries */ = {
isa = PBXGroup;
children = (
5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */,
144C5F631AC3E5D800B004E7 /* React.xcodeproj */,
134180381AA917ED003F314A /* RCTImage.xcodeproj */,
8320448F1B492C1E00E297FC /* RCTSettings.xcodeproj */,
587650DA1A9EB0DB008B8F17 /* RCTText.xcodeproj */,
);
name = Libraries;
@@ -114,6 +136,22 @@
name = Products;
sourceTree = "<group>";
};
5FF894291B8556F8007731BE /* Products */ = {
isa = PBXGroup;
children = (
5FF8942D1B8556F8007731BE /* libRCTWebSocket.a */,
);
name = Products;
sourceTree = "<group>";
};
832044901B492C1E00E297FC /* Products */ = {
isa = PBXGroup;
children = (
832044951B492C1E00E297FC /* libRCTSettings.a */,
);
name = Products;
sourceTree = "<group>";
};
83CBB9F61A601CBA00E9B192 = {
isa = PBXGroup;
children = (
@@ -178,10 +216,18 @@
ProductGroup = 134180391AA917ED003F314A /* Products */;
ProjectRef = 134180381AA917ED003F314A /* RCTImage.xcodeproj */;
},
{
ProductGroup = 832044901B492C1E00E297FC /* Products */;
ProjectRef = 8320448F1B492C1E00E297FC /* RCTSettings.xcodeproj */;
},
{
ProductGroup = 58C572481AA6224300CDF9C8 /* Products */;
ProjectRef = 587650DA1A9EB0DB008B8F17 /* RCTText.xcodeproj */;
},
{
ProductGroup = 5FF894291B8556F8007731BE /* Products */;
ProjectRef = 5FF894281B8556F8007731BE /* RCTWebSocket.xcodeproj */;
},
{
ProductGroup = 144C5F641AC3E5D800B004E7 /* Products */;
ProjectRef = 144C5F631AC3E5D800B004E7 /* React.xcodeproj */;
@@ -216,6 +262,20 @@
remoteRef = 58C5724C1AA6224400CDF9C8 /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
5FF8942D1B8556F8007731BE /* libRCTWebSocket.a */ = {
isa = PBXReferenceProxy;
fileType = archive.ar;
path = libRCTWebSocket.a;
remoteRef = 5FF8942C1B8556F8007731BE /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
832044951B492C1E00E297FC /* libRCTSettings.a */ = {
isa = PBXReferenceProxy;
fileType = archive.ar;
path = libRCTSettings.a;
remoteRef = 832044941B492C1E00E297FC /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
/* End PBXReferenceProxy section */
/* Begin PBXResourcesBuildPhase section */
+3 -2
View File
@@ -36,14 +36,14 @@
* on the same Wi-Fi network.
*/
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/TicTacToe/TicTacToeApp.includeRequire.runModule.bundle"];
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/TicTacToe/TicTacToeApp.bundle?platform=ios&dev=true"];
/**
* OPTION 2
* Load from pre-bundled file on disk. To re-generate the static bundle, `cd`
* to your Xcode project folder in the terminal, and run
*
* $ curl 'http://localhost:8081/Examples/TicTacToe/TicTacToeApp.includeRequire.runModule.bundle' -o main.jsbundle
* $ curl 'http://localhost:8081/Examples/TicTacToe/TicTacToeApp.bundle?platform=ios' -o main.jsbundle
*
* then add the `main.jsbundle` file to your project and uncomment this line:
*/
@@ -52,6 +52,7 @@
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"TicTacToeApp"
initialProperties:nil
launchOptions:launchOptions];
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
+3 -35
View File
@@ -19,7 +19,6 @@
var React = require('react-native');
var {
AppRegistry,
Image,
StyleSheet,
Text,
TouchableHighlight,
@@ -118,17 +117,6 @@ var Cell = React.createClass({
}
},
imageStyle() {
switch (this.props.player) {
case 1:
return styles.imageX;
case 2:
return styles.imageO;
default:
return {};
}
},
textContents() {
switch (this.props.player) {
case 1:
@@ -140,17 +128,6 @@ var Cell = React.createClass({
}
},
imageContents() {
switch (this.props.player) {
case 1:
return 'http://www.picgifs.com/alphabets/alphabets/children-5/alphabets-children-5-277623.gif';
case 2:
return 'http://www.picgifs.com/alphabets/alphabets/children-5/alphabets-children-5-730492.gif';
default:
return '';
}
},
render() {
return (
<TouchableHighlight
@@ -158,7 +135,9 @@ var Cell = React.createClass({
underlayColor="transparent"
activeOpacity={0.5}>
<View style={[styles.cell, this.cellStyle()]}>
<Image source={{uri: this.imageContents()}} style={this.imageStyle()}/>
<Text style={[styles.cellText, this.textStyle()]}>
{this.textContents()}
</Text>
</View>
</TouchableHighlight>
);
@@ -304,17 +283,6 @@ var styles = StyleSheet.create({
color: '#b9dc2f',
},
// CELL IMAGE
imageX: {
width: 34,
height: 42,
},
imageO: {
width: 45,
height: 41,
},
// GAME OVER
overlay: {
@@ -0,0 +1,213 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
*/
'use strict';
var React = require('react-native');
var {
StyleSheet,
Text,
View,
ToastAndroid,
TouchableWithoutFeedback,
} = React;
var UIExplorerBlock = require('./UIExplorerBlock');
var UIExplorerPage = require('./UIExplorerPage');
var importantForAccessibilityValues = ['auto', 'yes', 'no', 'no-hide-descendants'];
var AccessibilityAndroidExample = React.createClass({
statics: {
title: 'Accessibility',
description: 'Examples of using Accessibility API.',
},
getInitialState: function() {
return {
count: 0,
backgroundImportantForAcc: 0,
forgroundImportantForAcc: 0,
};
},
_addOne: function() {
this.setState({
count: ++this.state.count,
});
},
_changeBackgroundImportantForAcc: function() {
this.setState({
backgroundImportantForAcc: (this.state.backgroundImportantForAcc + 1) % 4,
});
},
_changeForgroundImportantForAcc: function() {
this.setState({
forgroundImportantForAcc: (this.state.forgroundImportantForAcc + 1) % 4,
});
},
render: function() {
return (
<UIExplorerPage title={'Accessibility'}>
<UIExplorerBlock title="Nonaccessible view with TextViews">
<View>
<Text style={{color: 'green',}}>
This is
</Text>
<Text style={{color: 'blue'}}>
nontouchable normal view.
</Text>
</View>
</UIExplorerBlock>
<UIExplorerBlock title="Accessible view with TextViews wihout label">
<View accessible={true}>
<Text style={{color: 'green',}}>
This is
</Text>
<Text style={{color: 'blue'}}>
nontouchable accessible view without label.
</Text>
</View>
</UIExplorerBlock>
<UIExplorerBlock title="Accessible view with TextViews with label">
<View accessible={true}
accessibilityLabel="I have label, so I read it instead of embedded text.">
<Text style={{color: 'green',}}>
This is
</Text>
<Text style={{color: 'blue'}}>
nontouchable accessible view with label.
</Text>
</View>
</UIExplorerBlock>
<UIExplorerBlock title="Touchable with component type = button">
<TouchableWithoutFeedback
onPress={() => ToastAndroid.show('Toasts work by default', ToastAndroid.SHORT)}
accessibilityComponentType="button">
<View style={styles.embedded}>
<Text>Click me</Text>
<Text>Or not</Text>
</View>
</TouchableWithoutFeedback>
</UIExplorerBlock>
<UIExplorerBlock title="LiveRegion">
<TouchableWithoutFeedback onPress={this._addOne}>
<View style={styles.embedded}>
<Text>Click me</Text>
</View>
</TouchableWithoutFeedback>
<Text accessibilityLiveRegion="polite">
Clicked {this.state.count} times
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Overlapping views and importantForAccessibility property">
<View style={styles.container}>
<View
style={{
position: 'absolute',
left: 10,
top: 10,
right: 10,
height: 100,
backgroundColor: 'green'}}
accessible={true}
accessibilityLabel="First layout"
importantForAccessibility={
importantForAccessibilityValues[this.state.backgroundImportantForAcc]}>
<View accessible={true}>
<Text style={{fontSize: 25}}>
Hello
</Text>
</View>
</View>
<View
style={{
position: 'absolute',
left: 10,
top: 25,
right: 10,
height: 110,
backgroundColor: 'yellow', opacity: 0.5}}
accessible={true}
accessibilityLabel="Second layout"
importantForAccessibility={
importantForAccessibilityValues[this.state.forgroundImportantForAcc]}>
<View accessible={true}>
<Text style={{fontSize: 20}}>
world
</Text>
</View>
</View>
</View>
<TouchableWithoutFeedback onPress={this._changeBackgroundImportantForAcc}>
<View style={styles.embedded}>
<Text>
Change importantForAccessibility for background layout.
</Text>
</View>
</TouchableWithoutFeedback>
<View accessible={true}>
<Text>
Background layout importantForAccessibility
</Text>
<Text>
{importantForAccessibilityValues[this.state.backgroundImportantForAcc]}
</Text>
</View>
<TouchableWithoutFeedback onPress={this._changeForgroundImportantForAcc}>
<View style={styles.embedded}>
<Text>
Change importantForAccessibility for forground layout.
</Text>
</View>
</TouchableWithoutFeedback>
<View accessible={true}>
<Text>
Forground layout importantForAccessibility
</Text>
<Text>
{importantForAccessibilityValues[this.state.forgroundImportantForAcc]}
</Text>
</View>
</UIExplorerBlock>
</UIExplorerPage>
);
},
});
var styles = StyleSheet.create({
embedded: {
backgroundColor: 'yellow',
padding:10,
},
container: {
flex: 1,
backgroundColor: 'white',
padding: 10,
height:150,
},
});
module.exports = AccessibilityAndroidExample;
+2 -1
View File
@@ -17,11 +17,12 @@
var React = require('react-native');
var {
ActionSheetIOS,
StyleSheet,
Text,
View,
} = React;
var ActionSheetIOS = require('ActionSheetIOS');
var BUTTONS = [
'Button Index: 0',
'Button Index: 1',
+1 -2
View File
@@ -15,10 +15,9 @@
*/
'use strict';
var AdSupportIOS = require('AdSupportIOS');
var React = require('react-native');
var {
AdSupportIOS,
StyleSheet,
Text,
View,
+230
View File
@@ -0,0 +1,230 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
Animated,
Easing,
StyleSheet,
Text,
View,
} = React;
var UIExplorerButton = require('./UIExplorerButton');
exports.framework = 'React';
exports.title = 'Animated - Examples';
exports.description = 'Animated provides a powerful ' +
'and easy-to-use API for building modern, ' +
'interactive user experiences.';
exports.examples = [
{
title: 'FadeInView',
description: 'Uses a simple timing animation to ' +
'bring opacity from 0 to 1 when the component ' +
'mounts.',
render: function() {
class FadeInView extends React.Component {
constructor(props) {
super(props);
this.state = {
fadeAnim: new Animated.Value(0), // opacity 0
};
}
componentDidMount() {
Animated.timing( // Uses easing functions
this.state.fadeAnim, // The value to drive
{
toValue: 1, // Target
duration: 2000, // Configuration
},
).start(); // Don't forget start!
}
render() {
return (
<Animated.View // Special animatable View
style={{
opacity: this.state.fadeAnim, // Binds
}}>
{this.props.children}
</Animated.View>
);
}
}
class FadeInExample extends React.Component {
constructor(props) {
super(props);
this.state = {
show: true,
};
}
render() {
return (
<View>
<UIExplorerButton onPress={() => {
this.setState((state) => (
{show: !state.show}
));
}}>
Press to {this.state.show ?
'Hide' : 'Show'}
</UIExplorerButton>
{this.state.show && <FadeInView>
<View style={styles.content}>
<Text>FadeInView</Text>
</View>
</FadeInView>}
</View>
);
}
}
return <FadeInExample />;
},
},
{
title: 'Transform Bounce',
description: 'One `Animated.Value` is driven by a ' +
'spring with custom constants and mapped to an ' +
'ordered set of transforms. Each transform has ' +
'an interpolation to convert the value into the ' +
'right range and units.',
render: function() {
this.anim = this.anim || new Animated.Value(0);
return (
<View>
<UIExplorerButton onPress={() => {
Animated.spring(this.anim, {
toValue: 0, // Returns to the start
velocity: 3, // Velocity makes it move
tension: -10, // Slow
friction: 1, // Oscillate a lot
}).start(); }}>
Press to Fling it!
</UIExplorerButton>
<Animated.View
style={[styles.content, {
transform: [ // Array order matters
{scale: this.anim.interpolate({
inputRange: [0, 1],
outputRange: [1, 4],
})},
{translateX: this.anim.interpolate({
inputRange: [0, 1],
outputRange: [0, 500],
})},
{rotate: this.anim.interpolate({
inputRange: [0, 1],
outputRange: [
'0deg', '360deg' // 'deg' or 'rad'
],
})},
]}
]}>
<Text>Transforms!</Text>
</Animated.View>
</View>
);
},
},
{
title: 'Composite Animations with Easing',
description: 'Sequence, parallel, delay, and ' +
'stagger with different easing functions.',
render: function() {
this.anims = this.anims || [1,2,3].map(
() => new Animated.Value(0)
);
return (
<View>
<UIExplorerButton onPress={() => {
var timing = Animated.timing;
Animated.sequence([ // One after the other
timing(this.anims[0], {
toValue: 200,
easing: Easing.linear,
}),
Animated.delay(400), // Use with sequence
timing(this.anims[0], {
toValue: 0,
easing: Easing.elastic(2), // Springy
}),
Animated.delay(400),
Animated.stagger(200,
this.anims.map((anim) => timing(
anim, {toValue: 200}
)).concat(
this.anims.map((anim) => timing(
anim, {toValue: 0}
))),
),
Animated.delay(400),
Animated.parallel([
Easing.inOut(Easing.quad), // Symmetric
Easing.back(1.5), // Goes backwards first
Easing.ease // Default bezier
].map((easing, ii) => (
timing(this.anims[ii], {
toValue: 320, easing, duration: 3000,
})
))),
Animated.delay(400),
Animated.stagger(200,
this.anims.map((anim) => timing(anim, {
toValue: 0,
easing: Easing.bounce, // Like a ball
duration: 2000,
})),
),
]).start(); }}>
Press to Animate
</UIExplorerButton>
{['Composite', 'Easing', 'Animations!'].map(
(text, ii) => (
<Animated.View
style={[styles.content, {
left: this.anims[ii]
}]}>
<Text>{text}</Text>
</Animated.View>
)
)}
</View>
);
},
},
{
title: 'Continuous Interactions',
description: 'Gesture events, chaining, 2D ' +
'values, interrupting and transitioning ' +
'animations, etc.',
render: () => (
<Text>Checkout the Gratuitous Animation App!</Text>
),
}
];
var styles = StyleSheet.create({
content: {
backgroundColor: 'deepskyblue',
borderWidth: 1,
borderColor: 'dodgerblue',
padding: 20,
margin: 20,
borderRadius: 10,
alignItems: 'center',
},
});
@@ -0,0 +1,321 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @providesModule AnExApp
* @flow
*/
'use strict';
var React = require('react-native');
var {
Animated,
LayoutAnimation,
PanResponder,
StyleSheet,
View,
} = React;
var AnExSet = require('AnExSet');
var CIRCLE_SIZE = 80;
var CIRCLE_MARGIN = 18;
var NUM_CIRCLES = 30;
class Circle extends React.Component {
_onLongPress: () => void;
_toggleIsActive: () => void;
constructor(props: Object): void {
super();
this._onLongPress = this._onLongPress.bind(this);
this._toggleIsActive = this._toggleIsActive.bind(this);
this.state = {
isActive: false,
pan: new Animated.ValueXY(), // Vectors reduce boilerplate. (step1: uncomment)
pop: new Animated.Value(0), // Initial value. (step2a: uncomment)
};
}
_onLongPress(): void {
var config = {tension: 40, friction: 3};
this.state.pan.addListener((value) => { // Async listener for state changes (step1: uncomment)
this.props.onMove && this.props.onMove(value);
});
Animated.spring(this.state.pop, {
toValue: 1, // Pop to larger size. (step2b: uncomment)
...config, // Reuse config for convenient consistency (step2b: uncomment)
}).start();
this.setState({panResponder: PanResponder.create({
onPanResponderMove: Animated.event([
null, // native event - ignore (step1: uncomment)
{dx: this.state.pan.x, dy: this.state.pan.y}, // links pan to gestureState (step1: uncomment)
]),
onPanResponderRelease: (e, gestureState) => {
LayoutAnimation.easeInEaseOut(); // @flowfixme animates layout update as one batch (step3: uncomment)
Animated.spring(this.state.pop, {
toValue: 0, // Pop back to 0 (step2c: uncomment)
...config,
}).start();
this.setState({panResponder: undefined});
this.props.onMove && this.props.onMove({
x: gestureState.dx + this.props.restLayout.x,
y: gestureState.dy + this.props.restLayout.y,
});
this.props.onDeactivate();
},
})}, () => {
this.props.onActivate();
});
}
render(): ReactElement {
if (this.state.panResponder) {
var handlers = this.state.panResponder.panHandlers;
var dragStyle = { // Used to position while dragging
position: 'absolute', // Hoist out of layout (step1: uncomment)
...this.state.pan.getLayout(), // Convenience converter (step1: uncomment)
};
} else {
handlers = {
onStartShouldSetResponder: () => !this.state.isActive,
onResponderGrant: () => {
this.state.pan.setValue({x: 0, y: 0}); // reset (step1: uncomment)
this.state.pan.setOffset(this.props.restLayout); // offset from onLayout (step1: uncomment)
this.longTimer = setTimeout(this._onLongPress, 300);
},
onResponderRelease: () => {
if (!this.state.panResponder) {
clearTimeout(this.longTimer);
this._toggleIsActive();
}
}
};
}
var animatedStyle: Object = {
shadowOpacity: this.state.pop, // no need for interpolation (step2d: uncomment)
transform: [
{scale: this.state.pop.interpolate({
inputRange: [0, 1],
outputRange: [1, 1.3] // scale up from 1 to 1.3 (step2d: uncomment)
})},
],
};
var openVal = this.props.openVal;
if (this.props.dummy) {
animatedStyle.opacity = 0;
} else if (this.state.isActive) {
var innerOpenStyle = [styles.open, { // (step4: uncomment)
left: openVal.interpolate({inputRange: [0, 1], outputRange: [this.props.restLayout.x, 0]}),
top: openVal.interpolate({inputRange: [0, 1], outputRange: [this.props.restLayout.y, 0]}),
width: openVal.interpolate({inputRange: [0, 1], outputRange: [CIRCLE_SIZE, this.props.containerLayout.width]}),
height: openVal.interpolate({inputRange: [0, 1], outputRange: [CIRCLE_SIZE, this.props.containerLayout.height]}),
margin: openVal.interpolate({inputRange: [0, 1], outputRange: [CIRCLE_MARGIN, 0]}),
borderRadius: openVal.interpolate({inputRange: [-0.15, 0, 0.5, 1], outputRange: [0, CIRCLE_SIZE / 2, CIRCLE_SIZE * 1.3, 0]}),
}];
}
return (
<Animated.View
onLayout={this.props.onLayout}
style={[styles.dragView, dragStyle, animatedStyle, this.state.isActive ? styles.open : null]}
{...handlers}>
<Animated.View style={[styles.circle, innerOpenStyle]}>
<AnExSet
containerLayout={this.props.containerLayout}
id={this.props.id}
isActive={this.state.isActive}
openVal={this.props.openVal}
onDismiss={this._toggleIsActive}
/>
</Animated.View>
</Animated.View>
);
}
_toggleIsActive(velocity) {
var config = {tension: 30, friction: 7};
if (this.state.isActive) {
Animated.spring(this.props.openVal, {toValue: 0, ...config}).start(() => { // (step4: uncomment)
this.setState({isActive: false}, this.props.onDeactivate);
}); // (step4: uncomment)
} else {
this.props.onActivate();
this.setState({isActive: true, panResponder: undefined}, () => {
// this.props.openVal.setValue(1); // (step4: comment)
Animated.spring(this.props.openVal, {toValue: 1, ...config}).start(); // (step4: uncomment)
});
}
}
}
class AnExApp extends React.Component {
_onMove: (position: Point) => void;
constructor(props: any): void {
super(props);
var keys = [];
for (var idx = 0; idx < NUM_CIRCLES; idx++) {
keys.push('E' + idx);
}
this.state = {
keys,
restLayouts: [],
openVal: new Animated.Value(0),
};
this._onMove = this._onMove.bind(this);
}
render(): ReactElement {
var circles = this.state.keys.map((key, idx) => {
if (key === this.state.activeKey) {
return <Circle key={key + 'd'} dummy={true} />;
} else {
if (!this.state.restLayouts[idx]) {
var onLayout = function(index, e) {
var layout = e.nativeEvent.layout;
this.setState((state) => {
state.restLayouts[index] = layout;
return state;
});
}.bind(this, idx);
}
return (
<Circle
key={key}
id={key}
openVal={this.state.openVal}
onLayout={onLayout}
restLayout={this.state.restLayouts[idx]}
onActivate={this.setState.bind(this, {
activeKey: key,
activeInitialLayout: this.state.restLayouts[idx],
})}
/>
);
}
});
if (this.state.activeKey) {
circles.push(
<Animated.View key="dark" style={[styles.darkening, {opacity: this.state.openVal}]} />
);
circles.push(
<Circle
openVal={this.state.openVal}
key={this.state.activeKey}
id={this.state.activeKey}
restLayout={this.state.activeInitialLayout}
containerLayout={this.state.layout}
onMove={this._onMove}
onDeactivate={() => { this.setState({activeKey: undefined}); }}
/>
);
}
return (
<View style={styles.container}>
<View style={styles.grid} onLayout={(e) => this.setState({layout: e.nativeEvent.layout})}>
{circles}
</View>
</View>
);
}
_onMove(position: Point): void {
var newKeys = moveToClosest(this.state, position);
if (newKeys !== this.state.keys) {
LayoutAnimation.easeInEaseOut(); // animates layout update as one batch (step3: uncomment)
this.setState({keys: newKeys});
}
}
}
type Point = {x: number, y: number};
function distance(p1: Point, p2: Point): number {
var dx = p1.x - p2.x;
var dy = p1.y - p2.y;
return dx * dx + dy * dy;
}
function moveToClosest({activeKey, keys, restLayouts}, position) {
var activeIdx = -1;
var closestIdx = activeIdx;
var minDist = Infinity;
var newKeys = [];
keys.forEach((key, idx) => {
var dist = distance(position, restLayouts[idx]);
if (key === activeKey) {
idx = activeIdx;
} else {
newKeys.push(key);
}
if (dist < minDist) {
minDist = dist;
closestIdx = idx;
}
});
if (closestIdx === activeIdx) {
return keys; // nothing changed
} else {
newKeys.splice(closestIdx, 0, activeKey);
return newKeys;
}
}
AnExApp.title = 'Animated - Gratuitous App';
AnExApp.description = 'Bunch of Animations - tap a circle to ' +
'open a view with more animations, or longPress and drag to reorder circles.';
var styles = StyleSheet.create({
container: {
flex: 1,
paddingTop: 64, // push content below nav bar
},
grid: {
flex: 1,
justifyContent: 'center',
flexDirection: 'row',
flexWrap: 'wrap',
backgroundColor: 'transparent',
},
circle: {
width: CIRCLE_SIZE,
height: CIRCLE_SIZE,
borderRadius: CIRCLE_SIZE / 2,
borderWidth: 1,
borderColor: 'black',
margin: CIRCLE_MARGIN,
overflow: 'hidden',
},
dragView: {
shadowRadius: 10,
shadowColor: 'rgba(0,0,0,0.7)',
shadowOffset: {height: 8},
alignSelf: 'flex-start',
backgroundColor: 'transparent',
},
open: {
position: 'absolute',
left: 0,
top: 0,
right: 0,
bottom: 0,
width: undefined, // unset value from styles.circle
height: undefined, // unset value from styles.circle
borderRadius: 0, // unset value from styles.circle
},
darkening: {
backgroundColor: 'black',
position: 'absolute',
left: 0,
top: 0,
right: 0,
bottom: 0,
},
});
module.exports = AnExApp;
@@ -0,0 +1,162 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @providesModule AnExBobble
* @flow
*/
'use strict';
var React = require('react-native');
var {
Animated,
Image,
PanResponder,
StyleSheet,
View,
} = React;
var NUM_BOBBLES = 5;
var RAD_EACH = Math.PI / 2 / (NUM_BOBBLES - 2);
var RADIUS = 160;
var BOBBLE_SPOTS = [...Array(NUM_BOBBLES)].map((_, i) => { // static positions
return i === 0 ? {x: 0, y: 0} : { // first bobble is the selector
x: -Math.cos(RAD_EACH * (i - 1)) * RADIUS,
y: -Math.sin(RAD_EACH * (i - 1)) * RADIUS,
};
});
class AnExBobble extends React.Component {
constructor(props: Object) {
super(props);
this.state = {};
this.state.bobbles = BOBBLE_SPOTS.map((_, i) => {
return new Animated.ValueXY();
});
this.state.selectedBobble = null;
var bobblePanListener = (e, gestureState) => { // async events => change selection
var newSelected = computeNewSelected(gestureState);
if (this.state.selectedBobble !== newSelected) {
if (this.state.selectedBobble !== null) {
var restSpot = BOBBLE_SPOTS[this.state.selectedBobble];
Animated.spring(this.state.bobbles[this.state.selectedBobble], {
toValue: restSpot, // return previously selected bobble to rest position
}).start();
}
if (newSelected !== null && newSelected !== 0) {
Animated.spring(this.state.bobbles[newSelected], {
toValue: this.state.bobbles[0], // newly selected should track the selector
}).start();
}
this.state.selectedBobble = newSelected;
}
};
var releaseBobble = () => {
this.state.bobbles.forEach((bobble, i) => {
Animated.spring(bobble, {
toValue: {x: 0, y: 0} // all bobbles return to zero
}).start();
});
};
this.state.bobbleResponder = PanResponder.create({
onStartShouldSetPanResponder: () => true,
onPanResponderGrant: () => {
BOBBLE_SPOTS.forEach((spot, idx) => {
Animated.spring(this.state.bobbles[idx], {
toValue: spot, // spring each bobble to its spot
friction: 3, // less friction => bouncier
}).start();
});
},
onPanResponderMove: Animated.event(
[ null, {dx: this.state.bobbles[0].x, dy: this.state.bobbles[0].y} ],
{listener: bobblePanListener} // async state changes with arbitrary logic
),
onPanResponderRelease: releaseBobble,
onPanResponderTerminate: releaseBobble,
});
}
render(): ReactElement {
return (
<View style={styles.bobbleContainer}>
{this.state.bobbles.map((_, i) => {
var j = this.state.bobbles.length - i - 1; // reverse so lead on top
var handlers = j > 0 ? {} : this.state.bobbleResponder.panHandlers;
return (
<Animated.Image
{...handlers}
source={{uri: BOBBLE_IMGS[j]}}
style={[styles.circle, {
backgroundColor: randColor(), // re-renders are obvious
transform: this.state.bobbles[j].getTranslateTransform(), // simple conversion
}]}
/>
);
})}
</View>
);
}
}
var styles = StyleSheet.create({
circle: {
position: 'absolute',
height: 60,
width: 60,
borderRadius: 30,
borderWidth: 0.5,
},
bobbleContainer: {
top: -68,
paddingRight: 66,
flexDirection: 'row',
flex: 1,
justifyContent: 'flex-end',
backgroundColor: 'transparent',
},
});
function computeNewSelected(
gestureState: Object,
): ?number {
var {dx, dy} = gestureState;
var minDist = Infinity;
var newSelected = null;
var pointRadius = Math.sqrt(dx * dx + dy * dy);
if (Math.abs(RADIUS - pointRadius) < 80) {
BOBBLE_SPOTS.forEach((spot, idx) => {
var delta = {x: spot.x - dx, y: spot.y - dy};
var dist = delta.x * delta.x + delta.y * delta.y;
if (dist < minDist) {
minDist = dist;
newSelected = idx;
}
});
}
return newSelected;
}
function randColor(): string {
var colors = [0,1,2].map(() => Math.floor(Math.random() * 150 + 100));
return 'rgb(' + colors.join(',') + ')';
}
var BOBBLE_IMGS = [
'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xpf1/t39.1997-6/10173489_272703316237267_1025826781_n.png',
'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/l/t39.1997-6/p240x240/851578_631487400212668_2087073502_n.png',
'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/t39.1997-6/p240x240/851583_654446917903722_178118452_n.png',
'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/t39.1997-6/p240x240/851565_641023175913294_875343096_n.png',
'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/t39.1997-6/851562_575284782557566_1188781517_n.png',
];
module.exports = AnExBobble;
@@ -0,0 +1,114 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @providesModule AnExChained
* @flow
*/
'use strict';
var React = require('react-native');
var {
Animated,
Image,
PanResponder,
StyleSheet,
View,
} = React;
class AnExChained extends React.Component {
constructor(props: Object) {
super(props);
this.state = {
stickers: [new Animated.ValueXY()], // 1 leader
};
var stickerConfig = {tension: 2, friction: 3}; // soft spring
for (var i = 0; i < 4; i++) { // 4 followers
var sticker = new Animated.ValueXY();
Animated.spring(sticker, {
...stickerConfig,
toValue: this.state.stickers[i], // Animated toValue's are tracked
}).start();
this.state.stickers.push(sticker); // push on the followers
}
var releaseChain = (e, gestureState) => {
this.state.stickers[0].flattenOffset(); // merges offset into value and resets
Animated.sequence([ // spring to start after decay finishes
Animated.decay(this.state.stickers[0], { // coast to a stop
velocity: {x: gestureState.vx, y: gestureState.vy},
deceleration: 0.997,
}),
Animated.spring(this.state.stickers[0], {
toValue: {x: 0, y: 0} // return to start
}),
]).start();
};
this.state.chainResponder = PanResponder.create({
onStartShouldSetPanResponder: () => true,
onPanResponderGrant: () => {
this.state.stickers[0].stopAnimation((value) => {
this.state.stickers[0].setOffset(value); // start where sticker animated to
this.state.stickers[0].setValue({x: 0, y: 0}); // avoid flicker before next event
});
},
onPanResponderMove: Animated.event(
[null, {dx: this.state.stickers[0].x, dy: this.state.stickers[0].y}] // map gesture to leader
),
onPanResponderRelease: releaseChain,
onPanResponderTerminate: releaseChain,
});
}
render() {
return (
<View style={styles.chained}>
{this.state.stickers.map((_, i) => {
var j = this.state.stickers.length - i - 1; // reverse so leader is on top
var handlers = (j === 0) ? this.state.chainResponder.panHandlers : {};
return (
<Animated.Image
{...handlers}
source={{uri: CHAIN_IMGS[j]}}
style={[styles.sticker, {
transform: this.state.stickers[j].getTranslateTransform(), // simple conversion
}]}
/>
);
})}
</View>
);
}
}
var styles = StyleSheet.create({
chained: {
alignSelf: 'flex-end',
top: -160,
right: 126
},
sticker: {
position: 'absolute',
height: 120,
width: 120,
backgroundColor: 'transparent',
},
});
var CHAIN_IMGS = [
'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xpf1/t39.1997-6/p160x160/10574705_1529175770666007_724328156_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xfa1/t39.1997-6/p160x160/851575_392309884199657_1917957497_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xfa1/t39.1997-6/p160x160/851567_555288911225630_1628791128_n.png',
'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xfa1/t39.1997-6/p160x160/851583_531111513625557_903469595_n.png',
'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xpa1/t39.1997-6/p160x160/851577_510515972354399_2147096990_n.png',
];
module.exports = AnExChained;
@@ -0,0 +1,115 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @providesModule AnExScroll
*/
'use strict';
var React = require('react-native');
var {
Animated,
Image,
ScrollView,
StyleSheet,
Text,
View,
} = React;
class AnExScroll extends React.Component {
constructor(props) {
super(props);
this.state = {
scrollX: new Animated.Value(0),
};
}
render() {
var width = this.props.panelWidth;
return (
<View style={styles.container}>
<ScrollView
automaticallyAdjustContentInsets={false}
scrollEventThrottle={16 /* get all events */ }
onScroll={Animated.event(
[{nativeEvent: {contentOffset: {x: this.state.scrollX}}}] // nested event mapping
)}
contentContainerStyle={{flex: 1, padding: 10}}
pagingEnabled={true}
horizontal={true}>
<View style={[styles.page, {width}]}>
<Image
style={{width: 180, height: 180}}
source={HAWK_PIC}
/>
<Text style={styles.text}>
{'I\'ll find something to put here.'}
</Text>
</View>
<View style={[styles.page, {width}]}>
<Text style={styles.text}>{'And here.'}</Text>
</View>
<View style={[styles.page, {width}]}>
<Text>{'But not here.'}</Text>
</View>
</ScrollView>
<Animated.Image
pointerEvents="none"
style={[styles.bunny, {transform: [
{translateX: this.state.scrollX.interpolate({
inputRange: [0, width, 2 * width],
outputRange: [0, 0, width / 3]}), // multi-part ranges
extrapolate: 'clamp'}, // default is 'extend'
{translateY: this.state.scrollX.interpolate({
inputRange: [0, width, 2 * width],
outputRange: [0, -200, -260]}),
extrapolate: 'clamp'},
{scale: this.state.scrollX.interpolate({
inputRange: [0, width, 2 * width],
outputRange: [0.5, 0.5, 2]}),
extrapolate: 'clamp'},
]}]}
source={BUNNY_PIC}
/>
</View>
);
}
}
var styles = StyleSheet.create({
container: {
backgroundColor: 'transparent',
flex: 1,
},
text: {
padding: 4,
paddingBottom: 10,
fontWeight: 'bold',
fontSize: 18,
backgroundColor: 'transparent',
},
bunny: {
backgroundColor: 'transparent',
position: 'absolute',
height: 160,
width: 160,
},
page: {
alignItems: 'center',
justifyContent: 'flex-end',
},
});
var HAWK_PIC = {uri: 'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xfa1/t39.1997-6/10734304_1562225620659674_837511701_n.png'};
var BUNNY_PIC = {uri: 'https://scontent-sea1-1.xx.fbcdn.net/hphotos-xaf1/t39.1997-6/851564_531111380292237_1898871086_n.png'};
module.exports = AnExScroll;
@@ -0,0 +1,150 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @providesModule AnExSet
* @flow
*/
'use strict';
var React = require('react-native');
var {
Animated,
PanResponder,
StyleSheet,
Text,
View,
} = React;
var AnExBobble = require('./AnExBobble');
var AnExChained = require('./AnExChained');
var AnExScroll = require('./AnExScroll');
var AnExTilt = require('./AnExTilt');
class AnExSet extends React.Component {
constructor(props: Object) {
super(props);
function randColor() {
var colors = [0,1,2].map(() => Math.floor(Math.random() * 150 + 100));
return 'rgb(' + colors.join(',') + ')';
}
this.state = {
closeColor: randColor(),
openColor: randColor(),
};
}
render(): ReactElement {
var backgroundColor = this.props.openVal ?
this.props.openVal.interpolate({
inputRange: [0, 1],
outputRange: [
this.state.closeColor, // interpolates color strings
this.state.openColor
],
}) :
this.state.closeColor;
var panelWidth = this.props.containerLayout && this.props.containerLayout.width || 320;
return (
<View style={styles.container}>
<Animated.View
style={[styles.header, { backgroundColor }]}
{...this.state.dismissResponder.panHandlers}>
<Text style={[styles.text, styles.headerText]}>
{this.props.id}
</Text>
</Animated.View>
{this.props.isActive &&
<View style={styles.stream}>
<View style={styles.card}>
<Text style={styles.text}>
July 2nd
</Text>
<AnExTilt isActive={this.props.isActive} />
<AnExBobble />
</View>
<AnExScroll panelWidth={panelWidth}/>
<AnExChained />
</View>
}
</View>
);
}
componentWillMount() {
this.state.dismissY = new Animated.Value(0);
this.state.dismissResponder = PanResponder.create({
onStartShouldSetPanResponder: () => this.props.isActive,
onPanResponderGrant: () => {
Animated.spring(this.props.openVal, { // Animated value passed in.
toValue: this.state.dismissY.interpolate({ // Track dismiss gesture
inputRange: [0, 300], // and interpolate pixel distance
outputRange: [1, 0], // to a fraction.
})
}).start();
},
onPanResponderMove: Animated.event(
[null, {dy: this.state.dismissY}] // track pan gesture
),
onPanResponderRelease: (e, gestureState) => {
if (gestureState.dy > 100) {
this.props.onDismiss(gestureState.vy); // delegates dismiss action to parent
} else {
Animated.spring(this.props.openVal, {
toValue: 1, // animate back open if released early
}).start();
}
},
});
}
}
var styles = StyleSheet.create({
container: {
flex: 1,
},
header: {
alignItems: 'center',
paddingTop: 18,
height: 90,
},
stream: {
flex: 1,
backgroundColor: 'rgb(230, 230, 230)',
},
card: {
margin: 8,
padding: 8,
borderRadius: 6,
backgroundColor: 'white',
shadowRadius: 2,
shadowColor: 'black',
shadowOpacity: 0.2,
shadowOffset: {height: 0.5},
},
text: {
padding: 4,
paddingBottom: 10,
fontWeight: 'bold',
fontSize: 18,
backgroundColor: 'transparent',
},
headerText: {
fontSize: 25,
color: 'white',
shadowRadius: 3,
shadowColor: 'black',
shadowOpacity: 1,
shadowOffset: {height: 1},
},
});
module.exports = AnExSet;
@@ -0,0 +1,107 @@
<br /><br />
# React Native: Animated
ReactEurope 2015, Paris - Spencer Ahrens - Facebook
<br /><br />
## Fluid Interactions
- People expect smooth, delightful experiences
- Complex interactions are hard
- Common patterns can be optimized
<br /><br />
## Declarative Interactions
- Wire up inputs (events) to outputs (props) + transforms (springs, easing, etc.)
- Arbitrary code can define/update this config
- Config can be serialized -> native/main thread
- No refs or lifecycle to worry about
<br /><br />
## var { Animated } = require('react-native');
- New library soon to be released for React Native
- 100% JS implementation -> X-Platform
- Per-platform native optimizations planned
- This talk -> usage examples, not implementation
<br /><br />
## Gratuitous Animation Demo App
- Layout uses `flexWrap: 'wrap'`
- longPress -> drag to reorder
- Tap to open example sets
<br /><br />
## Gratuitous Animation Codez
- Step 1: 2D tracking pan gesture
- Step 2: Simple pop-out spring on select
- Step 3: Animate grid reordering with `LayoutAnimation`
- Step 4: Opening animation
<br /><br />
## Animation Example Set
- `Animated.Value` `this.props.open` passed in from parent
- `interpolate` works with string "shapes," e.g. `'rgb(0, 0, 255)'`, `'45deg'`
- Examples easily composed as separate components
- Dismissing tracks interpolated gesture
- Custom release logic
<br /><br />
## Tilting Photo
- Pan -> translateX * 2, rotate, opacity (via tracking)
- Gesture release triggers separate animations
- `addListener` for async, arbitrary logic on animation progress
- `interpolate` easily creates parallax and other effects
<br /><br />
## Bobbles
- Static positions defined
- Listens to events to maybe change selection
- Springs previous selection back
- New selection tracks selector
- `getTranslateTransform` adds convenience
<br /><br />
## Chained
- Classic "Chat Heads" animation
- Each sticker tracks the one before it with a soft spring
- `decay` maintains gesture velocity, followed by `spring` to home
- `stopAnimation` provides the last value for `setOffset`
<br /><br />
## Scrolling
- `Animated.event` can track all sorts of stuff
- Multi-part ranges and extrapolation options
- Transforms decompose into ordered components
<br /><br />
# React Native: Animated
- Landing soon in master (days)
- GitHub: @vjeux, @sahrens
- Questions?
<br />
@@ -0,0 +1,139 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @providesModule AnExTilt
* @flow
*/
'use strict';
var React = require('react-native');
var {
Animated,
Image,
PanResponder,
StyleSheet,
View,
} = React;
class AnExTilt extends React.Component {
constructor(props: Object) {
super(props);
this.state = {
panX: new Animated.Value(0),
opacity: new Animated.Value(1),
burns: new Animated.Value(1.15),
};
this.state.tiltPanResponder = PanResponder.create({
onStartShouldSetPanResponder: () => true,
onPanResponderGrant: () => {
Animated.timing(this.state.opacity, {
toValue: this.state.panX.interpolate({
inputRange: [-300, 0, 300], // pan is in pixels
outputRange: [0, 1, 0], // goes to zero at both edges
}),
duration: 0, // direct tracking
}).start();
},
onPanResponderMove: Animated.event(
[null, {dx: this.state.panX}] // panX is linked to the gesture
),
onPanResponderRelease: (e, gestureState) => {
var toValue = 0;
if (gestureState.dx > 100) {
toValue = 500;
} else if (gestureState.dx < -100) {
toValue = -500;
}
Animated.spring(this.state.panX, {
toValue, // animate back to center or off screen
velocity: gestureState.vx, // maintain gesture velocity
tension: 10,
friction: 3,
}).start();
this.state.panX.removeAllListeners();
var id = this.state.panX.addListener(({value}) => { // listen until offscreen
if (Math.abs(value) > 400) {
this.state.panX.removeListener(id); // offscreen, so stop listening
Animated.timing(this.state.opacity, {
toValue: 1, // Fade back in. This unlinks it from tracking this.state.panX
}).start();
this.state.panX.setValue(0); // Note: stops the spring animation
toValue !== 0 && this._startBurnsZoom();
}
});
},
});
}
_startBurnsZoom() {
this.state.burns.setValue(1); // reset to beginning
Animated.decay(this.state.burns, {
velocity: 1, // sublte zoom
deceleration: 0.9999, // slow decay
}).start();
}
componentWillMount() {
this._startBurnsZoom();
}
render(): ReactElement {
return (
<Animated.View
{...this.state.tiltPanResponder.panHandlers}
style={[styles.tilt, {
opacity: this.state.opacity,
transform: [
{rotate: this.state.panX.interpolate({
inputRange: [-320, 320],
outputRange: ['-15deg', '15deg']})}, // interpolate string "shapes"
{translateX: this.state.panX},
],
}]}>
<Animated.Image
pointerEvents="none"
style={{
flex: 1,
transform: [
{translateX: this.state.panX.interpolate({
inputRange: [-3, 3], // small range is extended by default
outputRange: [2, -2]}) // parallax
},
{scale: this.state.burns.interpolate({
inputRange: [1, 3000],
outputRange: [1, 1.25]}) // simple multiplier
},
],
}}
source={NATURE_IMAGE}
/>
</Animated.View>
);
}
}
var styles = StyleSheet.create({
tilt: {
overflow: 'hidden',
height: 200,
marginBottom: 4,
backgroundColor: 'rgb(130, 130, 255)',
borderColor: 'rgba(0, 0, 0, 0.2)',
borderWidth: 1,
borderRadius: 20,
},
});
var NATURE_IMAGE = {uri: 'http://www.deshow.net/d/file/travel/2009-04/scenic-beauty-of-nature-photography-2-504-4.jpg'};
module.exports = AnExTilt;
@@ -0,0 +1,98 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
Image,
StyleSheet,
View,
ScrollView
} = React;
var AssetScaledImageExample = React.createClass({
getInitialState() {
return {
asset: this.props.asset
};
},
render() {
var image = this.state.asset.node.image;
return (
<ScrollView>
<View style={styles.row}>
<Image source={image} style={styles.imageWide}/>
</View>
<View style={styles.row}>
<Image source={image} style={styles.imageThumb}/>
<Image source={image} style={styles.imageThumb}/>
<Image source={image} style={styles.imageThumb}/>
</View>
<View style={styles.row}>
<Image source={image} style={styles.imageT1}/>
<Image source={image} style={styles.imageT2}/>
</View>
</ScrollView>
);
},
});
var styles = StyleSheet.create({
row: {
padding: 5,
flex: 1,
flexDirection: 'row',
alignSelf: 'center',
},
textColumn: {
flex: 1,
flexDirection: 'column',
},
imageWide: {
borderWidth: 1,
borderColor: 'black',
width: 320,
height: 240,
margin: 5,
},
imageThumb: {
borderWidth: 1,
borderColor: 'black',
width: 100,
height: 100,
margin: 5,
},
imageT1: {
borderWidth: 1,
borderColor: 'black',
width: 212,
height: 320,
margin: 5,
},
imageT2: {
borderWidth: 1,
borderColor: 'black',
width: 100,
height: 320,
margin: 5,
},
});
exports.title = '<AssetScaledImageExample>';
exports.description = 'Example component that displays the automatic scaling capabilities of the <Image /> tag';
module.exports = AssetScaledImageExample;
+30 -21
View File
@@ -29,18 +29,23 @@ var COLORS = ['red', 'orange', 'yellow', 'green', 'blue'];
var BasicStorageExample = React.createClass({
componentDidMount() {
AsyncStorage.getItem(STORAGE_KEY)
.then((value) => {
if (value !== null){
this.setState({selectedValue: value});
this._appendMessage('Recovered selection from disk: ' + value);
} else {
this._appendMessage('Initialized with no selection on disk.');
}
})
.catch((error) => this._appendMessage('AsyncStorage error: ' + error.message))
.done();
this._loadInitialState().done();
},
async _loadInitialState() {
try {
var value = await AsyncStorage.getItem(STORAGE_KEY);
if (value !== null){
this.setState({selectedValue: value});
this._appendMessage('Recovered selection from disk: ' + value);
} else {
this._appendMessage('Initialized with no selection on disk.');
}
} catch (error) {
this._appendMessage('AsyncStorage error: ' + error.message);
}
},
getInitialState() {
return {
selectedValue: COLORS[0],
@@ -80,19 +85,23 @@ var BasicStorageExample = React.createClass({
);
},
_onValueChange(selectedValue) {
async _onValueChange(selectedValue) {
this.setState({selectedValue});
AsyncStorage.setItem(STORAGE_KEY, selectedValue)
.then(() => this._appendMessage('Saved selection to disk: ' + selectedValue))
.catch((error) => this._appendMessage('AsyncStorage error: ' + error.message))
.done();
try {
await AsyncStorage.setItem(STORAGE_KEY, selectedValue);
this._appendMessage('Saved selection to disk: ' + selectedValue);
} catch (error) {
this._appendMessage('AsyncStorage error: ' + error.message);
}
},
_removeStorage() {
AsyncStorage.removeItem(STORAGE_KEY)
.then(() => this._appendMessage('Selection removed from disk.'))
.catch((error) => { this._appendMessage('AsyncStorage error: ' + error.message) })
.done();
async _removeStorage() {
try {
await AsyncStorage.removeItem(STORAGE_KEY);
this._appendMessage('Selection removed from disk.');
} catch (error) {
this._appendMessage('AsyncStorage error: ' + error.message);
}
},
_appendMessage(message) {
+4 -1
View File
@@ -94,7 +94,7 @@ var styles = StyleSheet.create({
});
exports.title = 'Border';
exports.description = 'View borders';
exports.description = 'Demonstrates some of the border styles available to Views.';
exports.examples = [
{
title: 'Equal-Width / Same-Color',
@@ -134,6 +134,7 @@ exports.examples = [
{
title: 'Custom Borders',
description: 'border*Width & border*Color',
platform: 'ios',
render() {
return <View style={[styles.box, styles.border5]} />;
}
@@ -141,6 +142,7 @@ exports.examples = [
{
title: 'Custom Borders',
description: 'border*Width & border*Color',
platform: 'ios',
render() {
return <View style={[styles.box, styles.border6]} />;
}
@@ -148,6 +150,7 @@ exports.examples = [
{
title: 'Custom Borders',
description: 'borderRadius & clipping',
platform: 'ios',
render() {
return (
<View style={[styles.box, styles.border7]}>
+26 -13
View File
@@ -24,9 +24,11 @@ var {
SwitchIOS,
Text,
View,
TouchableOpacity
} = React;
var CameraRollView = require('./CameraRollView.ios');
var AssetScaledImageExampleView = require('./AssetScaledImageExample');
var CAMERA_ROLL_VIEW = 'camera_roll_view';
@@ -54,7 +56,7 @@ var CameraRollExample = React.createClass({
<Text>{'Group Type: ' + this.state.groupTypes}</Text>
<CameraRollView
ref={CAMERA_ROLL_VIEW}
batchSize={5}
batchSize={20}
groupTypes={this.state.groupTypes}
renderImage={this._renderImage}
/>
@@ -62,24 +64,35 @@ var CameraRollExample = React.createClass({
);
},
loadAsset(asset){
this.props.navigator.push({
title: 'Camera Roll Image',
component: AssetScaledImageExampleView,
backButtonTitle: 'Back',
passProps: { asset: asset },
});
},
_renderImage(asset) {
var imageSize = this.state.bigImages ? 150 : 75;
var imageStyle = [styles.image, {width: imageSize, height: imageSize}];
var location = asset.node.location.longitude ?
JSON.stringify(asset.node.location) : 'Unknown location';
return (
<View key={asset} style={styles.row}>
<Image
source={asset.node.image}
style={imageStyle}
/>
<View style={styles.info}>
<Text style={styles.url}>{asset.node.image.uri}</Text>
<Text>{location}</Text>
<Text>{asset.node.group_name}</Text>
<Text>{new Date(asset.node.timestamp).toString()}</Text>
<TouchableOpacity onPress={ this.loadAsset.bind( this, asset ) }>
<View key={asset} style={styles.row}>
<Image
source={asset.node.image}
style={imageStyle}
/>
<View style={styles.info}>
<Text style={styles.url}>{asset.node.image.uri}</Text>
<Text>{location}</Text>
<Text>{asset.node.group_name}</Text>
<Text>{new Date(asset.node.timestamp).toString()}</Text>
</View>
</View>
</View>
</TouchableOpacity>
);
},
@@ -115,7 +128,7 @@ var styles = StyleSheet.create({
},
});
exports.title = '<CameraRollView>';
exports.title = 'Camera Roll';
exports.description = 'Example component that uses CameraRoll to list user\'s photos';
exports.examples = [
{
+3
View File
@@ -14,11 +14,14 @@
* @providesModule ExampleTypes
* @flow
*/
'use strict';
export type Example = {
title: string,
/* $FlowFixMe(>=0.16.0) */
render: () => ?ReactElement<any, any, any>,
description?: string,
platform?: string;
};
export type ExampleModule = {
+305
View File
@@ -0,0 +1,305 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
CameraRoll,
Image,
NativeModules,
ScrollView,
StyleSheet,
Text,
TouchableHighlight,
View,
} = React;
var ImageEditingManager = NativeModules.ImageEditingManager;
var RCTScrollViewConsts = NativeModules.UIManager.RCTScrollView.Constants;
var PAGE_SIZE = 20;
type ImageOffset = {
x: number;
y: number;
};
type ImageSize = {
width: number;
height: number;
};
type TransformData = {
offset: ImageOffset;
size: ImageSize;
}
class SquareImageCropper extends React.Component {
_isMounted: boolean;
_transformData: TransformData;
constructor(props) {
super(props);
this._isMounted = true;
this.state = {
randomPhoto: null,
measuredSize: null,
croppedImageURI: null,
cropError: null,
};
this._fetchRandomPhoto();
}
_fetchRandomPhoto() {
CameraRoll.getPhotos(
{first: PAGE_SIZE},
(data) => {
if (!this._isMounted) {
return;
}
var edges = data.edges;
var edge = edges[Math.floor(Math.random() * edges.length)];
var randomPhoto = edge && edge.node && edge.node.image;
if (randomPhoto) {
this.setState({randomPhoto});
}
},
(error) => undefined
);
}
componentWillUnmount() {
this._isMounted = false;
}
render() {
if (!this.state.measuredSize) {
return (
<View
style={styles.container}
onLayout={(event) => {
var measuredWidth = event.nativeEvent.layout.width;
if (!measuredWidth) {
return;
}
this.setState({
measuredSize: {width: measuredWidth, height: measuredWidth},
});
}}
/>
);
}
if (!this.state.croppedImageURI) {
return this._renderImageCropper();
}
return this._renderCroppedImage();
}
_renderImageCropper() {
if (!this.state.randomPhoto) {
return (
<View style={styles.container} />
);
}
var error = null;
if (this.state.cropError) {
error = (
<Text>{this.state.cropError.message}</Text>
);
}
return (
<View style={styles.container}>
<Text>Drag the image within the square to crop:</Text>
<ImageCropper
image={this.state.randomPhoto}
size={this.state.measuredSize}
style={[styles.imageCropper, this.state.measuredSize]}
onTransformDataChange={(data) => this._transformData = data}
/>
<TouchableHighlight
style={styles.cropButtonTouchable}
onPress={this._crop.bind(this)}>
<View style={styles.cropButton}>
<Text style={styles.cropButtonLabel}>
Crop
</Text>
</View>
</TouchableHighlight>
{error}
</View>
);
}
_renderCroppedImage() {
return (
<View style={styles.container}>
<Text>Here is the cropped image:</Text>
<Image
source={{uri: this.state.croppedImageURI}}
style={[styles.imageCropper, this.state.measuredSize]}
/>
<TouchableHighlight
style={styles.cropButtonTouchable}
onPress={this._reset.bind(this)}>
<View style={styles.cropButton}>
<Text style={styles.cropButtonLabel}>
Try again
</Text>
</View>
</TouchableHighlight>
</View>
);
}
_crop() {
ImageEditingManager.cropImage(
this.state.randomPhoto.uri,
this._transformData,
(croppedImageURI) => this.setState({croppedImageURI}),
(cropError) => this.setState({cropError})
);
}
_reset() {
this.setState({
randomPhoto: null,
croppedImageURI: null,
cropError: null,
});
this._fetchRandomPhoto();
}
}
class ImageCropper extends React.Component {
_scaledImageSize: ImageSize;
_contentOffset: ImageOffset;
componentWillMount() {
// Scale an image to the minimum size that is large enough to completely
// fill the crop box.
var widthRatio = this.props.image.width / this.props.size.width;
var heightRatio = this.props.image.height / this.props.size.height;
if (widthRatio < heightRatio) {
this._scaledImageSize = {
width: this.props.size.width,
height: this.props.image.height / widthRatio,
};
} else {
this._scaledImageSize = {
width: this.props.image.width / heightRatio,
height: this.props.size.height,
};
}
this._contentOffset = {
x: (this._scaledImageSize.width - this.props.size.width) / 2,
y: (this._scaledImageSize.height - this.props.size.height) / 2,
};
this._updateTransformData(
this._contentOffset,
this._scaledImageSize,
this.props.size
);
}
_onScroll(event) {
this._updateTransformData(
event.nativeEvent.contentOffset,
event.nativeEvent.contentSize,
event.nativeEvent.layoutMeasurement
);
}
_updateTransformData(offset, scaledImageSize, croppedImageSize) {
var offsetRatioX = offset.x / scaledImageSize.width;
var offsetRatioY = offset.y / scaledImageSize.height;
var sizeRatioX = croppedImageSize.width / scaledImageSize.width;
var sizeRatioY = croppedImageSize.height / scaledImageSize.height;
this.props.onTransformDataChange && this.props.onTransformDataChange({
offset: {
x: this.props.image.width * offsetRatioX,
y: this.props.image.height * offsetRatioY,
},
size: {
width: this.props.image.width * sizeRatioX,
height: this.props.image.height * sizeRatioY,
},
});
}
render() {
var decelerationRate =
RCTScrollViewConsts && RCTScrollViewConsts.DecelerationRate ?
RCTScrollViewConsts.DecelerationRate.Fast :
0;
return (
<ScrollView
alwaysBounceVertical={true}
automaticallyAdjustContentInsets={false}
contentOffset={this._contentOffset}
decelerationRate={decelerationRate}
horizontal={true}
maximumZoomScale={3.0}
onMomentumScrollEnd={this._onScroll.bind(this)}
onScrollEndDrag={this._onScroll.bind(this)}
showsHorizontalScrollIndicator={false}
showsVerticalScrollIndicator={false}
style={this.props.style}
scrollEventThrottle={16}>
<Image source={this.props.image} style={this._scaledImageSize} />
</ScrollView>
);
}
}
exports.framework = 'React';
exports.title = 'ImageEditingManager';
exports.description = 'Cropping and scaling with ImageEditingManager';
exports.examples = [{
title: 'Image Cropping',
render() {
return <SquareImageCropper/>;
}
}];
var styles = StyleSheet.create({
container: {
flex: 1,
alignSelf: 'stretch',
},
imageCropper: {
alignSelf: 'center',
marginTop: 12,
},
cropButtonTouchable: {
alignSelf: 'center',
marginTop: 12,
},
cropButton: {
padding: 12,
backgroundColor: 'blue',
borderRadius: 4,
},
cropButtonLabel: {
color: 'white',
fontSize: 16,
fontWeight: '500',
},
});
+140 -28
View File
@@ -21,10 +21,43 @@ var {
StyleSheet,
Text,
View,
ActivityIndicatorIOS
} = React;
var base64Icon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEsAAABLCAQAAACSR7JhAAADtUlEQVR4Ac3YA2Bj6QLH0XPT1Fzbtm29tW3btm3bfLZtv7e2ObZnms7d8Uw098tuetPzrxv8wiISrtVudrG2JXQZ4VOv+qUfmqCGGl1mqLhoA52oZlb0mrjsnhKpgeUNEs91Z0pd1kvihA3ULGVHiQO2narKSHKkEMulm9VgUyE60s1aWoMQUbpZOWE+kaqs4eLEjdIlZTcFZB0ndc1+lhB1lZrIuk5P2aib1NBpZaL+JaOGIt0ls47SKzLC7CqrlGF6RZ09HGoNy1lYl2aRSWL5GuzqWU1KafRdoRp0iOQEiDzgZPnG6DbldcomadViflnl/cL93tOoVbsOLVM2jylvdWjXolWX1hmfZbGR/wjypDjFLSZIRov09BgYmtUqPQPlQrPapecLgTIy0jMgPKtTeob2zWtrGH3xvjUkPCtNg/tm1rjwrMa+mdUkPd3hWbH0jArPGiU9ufCsNNWFZ40wpwn+62/66R2RUtoso1OB34tnLOcy7YB1fUdc9e0q3yru8PGM773vXsuZ5YIZX+5xmHwHGVvlrGPN6ZSiP1smOsMMde40wKv2VmwPPVXNut4sVpUreZiLBHi0qln/VQeI/LTMYXpsJtFiclUN+5HVZazim+Ky+7sAvxWnvjXrJFneVtLWLyPJu9K3cXLWeOlbMTlrIelbMDlrLenrjEQOtIF+fuI9xRp9ZBFp6+b6WT8RrxEpdK64BuvHgDk+vUy+b5hYk6zfyfs051gRoNO1usU12WWRWL73/MMEy9pMi9qIrR4ZpV16Rrvduxazmy1FSvuFXRkqTnE7m2kdb5U8xGjLw/spRr1uTov4uOgQE+0N/DvFrG/Jt7i/FzwxbA9kDanhf2w+t4V97G8lrT7wc08aA2QNUkuTfW/KimT01wdlfK4yEw030VfT0RtZbzjeMprNq8m8tnSTASrTLti64oBNdpmMQm0eEwvfPwRbUBywG5TzjPCsdwk3IeAXjQblLCoXnDVeoAz6SfJNk5TTzytCNZk/POtTSV40NwOFWzw86wNJRpubpXsn60NJFlHeqlYRbslqZm2jnEZ3qcSKgm0kTli3zZVS7y/iivZTweYXJ26Y+RTbV1zh3hYkgyFGSTKPfRVbRqWWVReaxYeSLarYv1Qqsmh1s95S7G+eEWK0f3jYKTbV6bOwepjfhtafsvUsqrQvrGC8YhmnO9cSCk3yuY984F1vesdHYhWJ5FvASlacshUsajFt2mUM9pqzvKGcyNJW0arTKN1GGGzQlH0tXwLDgQTurS8eIQAAAABJRU5ErkJggg==';
var ImageCapInsetsExample = require('./ImageCapInsetsExample');
var NetworkImageExample = React.createClass({
watchID: (null: ?number),
getInitialState: function() {
return {
error: false,
loading: false,
progress: 0
};
},
render: function() {
var loader = this.state.loading ?
<View style={styles.progress}>
<Text>{this.state.progress}%</Text>
<ActivityIndicatorIOS style={{marginLeft:5}}/>
</View> : null;
return this.state.error ?
<Text>{this.state.error}</Text> :
<Image
source={this.props.source}
style={[styles.base, {overflow: 'visible'}]}
onLoadStart={(e) => this.setState({loading: true})}
onError={(e) => this.setState({error: e.nativeEvent.error, loading: false})}
onProgress={(e) => this.setState({progress: Math.round(100 * e.nativeEvent.loaded / e.nativeEvent.total)})}
onLoad={() => this.setState({loading: false, error: false})}>
{loader}
</Image>;
}
});
exports.displayName = (undefined: ?string);
exports.framework = 'React';
exports.title = '<Image>';
@@ -59,6 +92,24 @@ exports.examples = [
);
},
},
{
title: 'Error Handler',
render: function() {
return (
<NetworkImageExample source={{uri: 'http://TYPO_ERROR_facebook.github.io/react/img/logo_og.png'}} />
);
},
platform: 'ios',
},
{
title: 'Image Download Progress',
render: function() {
return (
<NetworkImageExample source={{uri: 'http://facebook.github.io/origami/public/images/blog-hero.jpg?r=1'}}/>
);
},
platform: 'ios',
},
{
title: 'Border Color',
render: function() {
@@ -99,17 +150,12 @@ exports.examples = [
return (
<View style={styles.horizontal}>
<Image
style={[styles.base, styles.background, {borderRadius: 5}]}
source={smallImage}
style={[styles.base, {borderRadius: 5}]}
source={fullImage}
/>
<Image
style={[
styles.base,
styles.background,
styles.leftMargin,
{borderRadius: 19}
]}
source={smallImage}
style={[styles.base, styles.leftMargin, {borderRadius: 19}]}
source={fullImage}
/>
</View>
);
@@ -194,23 +240,46 @@ exports.examples = [
'pixels to the tint color.',
render: function() {
return (
<View style={styles.horizontal}>
<Image
source={require('image!uie_thumb_normal')}
style={[styles.icon, {tintColor: 'blue' }]}
/>
<Image
source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {tintColor: 'green' }]}
/>
<Image
source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {tintColor: 'red' }]}
/>
<Image
source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {tintColor: 'black' }]}
/>
<View>
<View style={styles.horizontal}>
<Image
source={require('image!uie_thumb_normal')}
style={[styles.icon, {borderRadius: 5, tintColor: '#5ac8fa' }]}
/>
<Image
source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {borderRadius: 5, tintColor: '#4cd964' }]}
/>
<Image
source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {borderRadius: 5, tintColor: '#ff2d55' }]}
/>
<Image
source={require('image!uie_thumb_normal')}
style={[styles.icon, styles.leftMargin, {borderRadius: 5, tintColor: '#8e8e93' }]}
/>
</View>
<Text style={styles.sectionText}>
It also works with downloaded images:
</Text>
<View style={styles.horizontal}>
<Image
source={smallImage}
style={[styles.base, {borderRadius: 5, tintColor: '#5ac8fa' }]}
/>
<Image
source={smallImage}
style={[styles.base, styles.leftMargin, {borderRadius: 5, tintColor: '#4cd964' }]}
/>
<Image
source={smallImage}
style={[styles.base, styles.leftMargin, {borderRadius: 5, tintColor: '#ff2d55' }]}
/>
<Image
source={smallImage}
style={[styles.base, styles.leftMargin, {borderRadius: 5, tintColor: '#8e8e93' }]}
/>
</View>
</View>
);
},
@@ -256,6 +325,30 @@ exports.examples = [
);
},
},
{
title: 'Animated GIF',
render: function() {
return (
<Image
style={styles.gif}
source={{uri: 'http://38.media.tumblr.com/9e9bd08c6e2d10561dd1fb4197df4c4e/tumblr_mfqekpMktw1rn90umo1_500.gif'}}
/>
);
},
platform: 'ios',
},
{
title: 'Base64 image',
render: function() {
return (
<Image
style={styles.base64}
source={{uri: base64Icon, scale: 3}}
/>
);
},
platform: 'ios',
},
{
title: 'Cap Insets',
description:
@@ -266,23 +359,33 @@ exports.examples = [
render: function() {
return <ImageCapInsetsExample />;
},
platform: 'ios',
},
];
var fullImage = {uri: 'http://facebook.github.io/react/img/logo_og.png'};
var smallImage = {uri: 'http://facebook.github.io/react/img/logo_small.png'};
var smallImage = {uri: 'http://facebook.github.io/react/img/logo_small_2x.png'};
var styles = StyleSheet.create({
base: {
width: 38,
height: 38,
},
progress: {
flex: 1,
alignItems: 'center',
flexDirection: 'row',
width: 100
},
leftMargin: {
marginLeft: 10,
},
background: {
backgroundColor: '#222222'
},
sectionText: {
marginVertical: 6,
},
nestedText: {
marginLeft: 12,
marginTop: 20,
@@ -305,5 +408,14 @@ var styles = StyleSheet.create({
},
horizontal: {
flexDirection: 'row',
}
},
gif: {
flex: 1,
height: 200,
},
base64: {
flex: 1,
height: 50,
resizeMode: 'contain',
},
});
-56
View File
@@ -1,56 +0,0 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
declare module 'image!story-background' {
/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
* into a proptype shape */
declare var uri: string;
declare var isStatic: boolean;
}
declare module 'image!uie_comment_highlighted' {
/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
* into a proptype shape */
declare var uri: string;
declare var isStatic: boolean;
}
declare module 'image!uie_comment_normal' {
/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
* into a proptype shape */
declare var uri: string;
declare var isStatic: boolean;
}
declare module 'image!uie_thumb_normal' {
/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
* into a proptype shape */
declare var uri: string;
declare var isStatic: boolean;
}
declare module 'image!uie_thumb_selected' {
/* $FlowIssue #7387208 - There's a flow bug preventing this type from flowing
* into a proptype shape */
declare var uri: string;
declare var isStatic: boolean;
}
declare module 'image!NavBarButtonPlus' {
declare var uri: string;
declare var isStatic: boolean;
}
+9 -7
View File
@@ -49,8 +49,7 @@ var LayoutEventExample = React.createClass({
() => {
console.log('layout animation done.');
this.addWrapText();
},
(error) => { throw new Error(JSON.stringify(error)); }
}
);
this.setState({
viewStyle: {
@@ -86,8 +85,7 @@ var LayoutEventExample = React.createClass({
return (
<View style={this.state.containerStyle}>
<Text>
onLayout events are called on mount and whenever layout is updated,
including after layout animations complete.{' '}
layout events are called on mount and whenever layout is recalculated. Note that the layout event will typically be received <Text style={styles.italicText}>before</Text> the layout has updated on screen, especially when using layout animations.{' '}
<Text style={styles.pressText} onPress={this.animateViewLayout}>
Press here to change layout.
</Text>
@@ -137,13 +135,17 @@ var styles = StyleSheet.create({
pressText: {
fontWeight: 'bold',
},
italicText: {
fontStyle: 'italic',
},
});
exports.title = 'onLayout';
exports.description = 'Layout events can be used to measure view size and position.';
exports.title = 'Layout Events';
exports.description = 'Examples that show how Layout events can be used to ' +
'measure view size and position.';
exports.examples = [
{
title: 'onLayout',
title: 'LayoutEventExample',
render: function(): ReactElement {
return <LayoutEventExample />;
},
+4 -1
View File
@@ -62,8 +62,11 @@ var CircleBlock = React.createClass({
var LayoutExample = React.createClass({
statics: {
title: 'Layout - Flexbox',
description: 'Examples of using the flexbox API to layout views.'
description: 'Examples of using the flexbox API to layout views.',
},
displayName: 'LayoutExample',
render: function() {
return (
<UIExplorerPage title={this.props.navigator ? null : 'Layout'}>
@@ -0,0 +1,149 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
Image,
ListView,
TouchableHighlight,
StyleSheet,
Text,
View,
} = React;
var THUMB_URLS = [
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-ash3/t39.1997/p128x128/851549_767334479959628_274486868_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851561_767334496626293_1958532586_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-ash3/t39.1997/p128x128/851579_767334503292959_179092627_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851589_767334513292958_1747022277_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851563_767334559959620_1193692107_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851593_767334566626286_1953955109_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851591_767334523292957_797560749_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851567_767334529959623_843148472_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851548_767334489959627_794462220_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851575_767334539959622_441598241_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-ash3/t39.1997/p128x128/851573_767334549959621_534583464_n.png',
'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-prn1/t39.1997/p128x128/851583_767334573292952_1519550680_n.png',
];
var ListViewGridLayoutExample = React.createClass({
statics: {
title: '<ListView> - Grid Layout',
description: 'Flexbox grid layout.'
},
getInitialState: function() {
var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
return {
dataSource: ds.cloneWithRows(this._genRows({})),
};
},
_pressData: ({}: {[key: number]: boolean}),
componentWillMount: function() {
this._pressData = {};
},
render: function() {
return (
// ListView wraps ScrollView and so takes on its properties.
// With that in mind you can use the ScrollView's contentContainerStyle prop to style the items.
<ListView
contentContainerStyle={styles.list}
dataSource={this.state.dataSource}
renderRow={this._renderRow}
/>
);
},
_renderRow: function(rowData: string, sectionID: number, rowID: number) {
var rowHash = Math.abs(hashCode(rowData));
var imgSource = {
uri: THUMB_URLS[rowHash % THUMB_URLS.length],
};
return (
<TouchableHighlight onPress={() => this._pressRow(rowID)} underlayColor="transparent">
<View>
<View style={styles.row}>
<Image style={styles.thumb} source={imgSource} />
<Text style={styles.text}>
{rowData}
</Text>
</View>
</View>
</TouchableHighlight>
);
},
_genRows: function(pressData: {[key: number]: boolean}): Array<string> {
var dataBlob = [];
for (var ii = 0; ii < 100; ii++) {
var pressedText = pressData[ii] ? ' (X)' : '';
dataBlob.push('Cell ' + ii + pressedText);
}
return dataBlob;
},
_pressRow: function(rowID: number) {
this._pressData[rowID] = !this._pressData[rowID];
this.setState({dataSource: this.state.dataSource.cloneWithRows(
this._genRows(this._pressData)
)});
},
});
/* eslint no-bitwise: 0 */
var hashCode = function(str) {
var hash = 15;
for (var ii = str.length - 1; ii >= 0; ii--) {
hash = ((hash << 5) - hash) + str.charCodeAt(ii);
}
return hash;
};
var styles = StyleSheet.create({
list: {
justifyContent: 'space-around',
flexDirection: 'row',
flexWrap: 'wrap'
},
row: {
justifyContent: 'center',
padding: 5,
margin: 3,
width: 100,
height: 100,
backgroundColor: '#F6F6F6',
alignItems: 'center',
borderWidth: 1,
borderRadius: 5,
borderColor: '#CCC'
},
thumb: {
width: 64,
height: 64
},
text: {
flex: 1,
marginTop: 5,
fontWeight: 'bold'
},
});
module.exports = ListViewGridLayoutExample;
+20 -21
View File
@@ -48,19 +48,19 @@ var Thumb = React.createClass({
},
render: function() {
return (
<TouchableOpacity onPress={this._onPressThumb}>
<View style={[styles.buttonContents, {flexDirection: this.state.dir}]}>
<Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
<Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
<Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
{this.state.dir === 'column' ?
<Text>
Oooo, look at this new text! So awesome it may just be crazy.
Let me keep typing here so it wraps at least one line.
</Text> :
<Text />
}
</View>
<TouchableOpacity
onPress={this._onPressThumb}
style={[styles.buttonContents, {flexDirection: this.state.dir}]}>
<Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
<Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
<Image style={styles.img} source={{uri: THUMB_URLS[this.state.thumbIndex]}} />
{this.state.dir === 'column' ?
<Text>
Oooo, look at this new text! So awesome it may just be crazy.
Let me keep typing here so it wraps at least one line.
</Text> :
<Text />
}
</TouchableOpacity>
);
}
@@ -127,14 +127,12 @@ var ListViewPagingExample = React.createClass({
<View><Text style={styles.text}>1 Like</Text></View> :
null;
return (
<TouchableOpacity onPress={this._onPressHeader}>
<View style={styles.header}>
{headerLikeText}
<View>
<Text style={styles.text}>
Table Header (click me)
</Text>
</View>
<TouchableOpacity onPress={this._onPressHeader} style={styles.header}>
{headerLikeText}
<View>
<Text style={styles.text}>
Table Header (click me)
</Text>
</View>
</TouchableOpacity>
);
@@ -212,6 +210,7 @@ var styles = StyleSheet.create({
width: 64,
height: 64,
marginHorizontal: 10,
backgroundColor: 'transparent',
},
section: {
flexDirection: 'column',
+1 -1
View File
@@ -16,9 +16,9 @@
'use strict';
var React = require('react-native');
var StyleSheet = require('StyleSheet');
var {
MapView,
StyleSheet,
Text,
TextInput,
View,
+172
View File
@@ -0,0 +1,172 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
Modal,
StyleSheet,
SwitchIOS,
Text,
TouchableHighlight,
View,
} = React;
exports.displayName = (undefined: ?string);
exports.framework = 'React';
exports.title = '<Modal>';
exports.description = 'Component for presenting modal views.';
var Button = React.createClass({
getInitialState() {
return {
active: false,
};
},
_onHighlight() {
this.setState({active: true});
},
_onUnhighlight() {
this.setState({active: false});
},
render() {
var colorStyle = {
color: this.state.active ? '#fff' : '#000',
};
return (
<TouchableHighlight
onHideUnderlay={this._onUnhighlight}
onPress={this.props.onPress}
onShowUnderlay={this._onHighlight}
style={[styles.button, this.props.style]}
underlayColor="#a9d9d4">
<Text style={[styles.buttonText, colorStyle]}>{this.props.children}</Text>
</TouchableHighlight>
);
}
});
var ModalExample = React.createClass({
getInitialState() {
return {
animated: true,
modalVisible: false,
transparent: false,
};
},
_setModalVisible(visible) {
this.setState({modalVisible: visible});
},
_toggleAnimated() {
this.setState({animated: !this.state.animated});
},
_toggleTransparent() {
this.setState({transparent: !this.state.transparent});
},
render() {
var modalBackgroundStyle = {
backgroundColor: this.state.transparent ? 'rgba(0, 0, 0, 0.5)' : '#f5fcff',
};
var innerContainerTransparentStyle = this.state.transparent
? {backgroundColor: '#fff', padding: 20}
: null;
return (
<View>
<Modal
animated={this.state.animated}
transparent={this.state.transparent}
visible={this.state.modalVisible}>
<View style={[styles.container, modalBackgroundStyle]}>
<View style={[styles.innerContainer, innerContainerTransparentStyle]}>
<Text>This modal was presented {this.state.animated ? 'with' : 'without'} animation.</Text>
<Button
onPress={this._setModalVisible.bind(this, false)}
style={styles.modalButton}>
Close
</Button>
</View>
</View>
</Modal>
<View style={styles.row}>
<Text style={styles.rowTitle}>Animated</Text>
<SwitchIOS value={this.state.animated} onValueChange={this._toggleAnimated} />
</View>
<View style={styles.row}>
<Text style={styles.rowTitle}>Transparent</Text>
<SwitchIOS value={this.state.transparent} onValueChange={this._toggleTransparent} />
</View>
<Button onPress={this._setModalVisible.bind(this, true)}>
Present
</Button>
</View>
);
},
});
exports.examples = [
{
title: 'Modal Presentation',
description: 'Modals can be presented with or without animation',
render: () => <ModalExample />,
},
];
var styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
padding: 20,
},
innerContainer: {
borderRadius: 10,
},
row: {
alignItems: 'center',
flex: 1,
flexDirection: 'row',
marginBottom: 20,
},
rowTitle: {
flex: 1,
fontWeight: 'bold',
},
button: {
borderRadius: 5,
flex: 1,
height: 44,
justifyContent: 'center',
overflow: 'hidden',
},
buttonText: {
fontSize: 18,
margin: 5,
textAlign: 'center',
},
modalButton: {
marginTop: 10,
},
});
@@ -55,26 +55,24 @@ var BreadcrumbNavSample = React.createClass({
return (
<TouchableOpacity
onPress={() => navigator.push(_getRandomRoute())}>
<View>
<Text style={styles.titleText}>{route.title}</Text>
</View>
<Text style={styles.titleText}>{route.title}</Text>
</TouchableOpacity>
);
},
iconForRoute: function(route, navigator) {
return (
<TouchableOpacity onPress={() => {
navigator.popToRoute(route);
}}>
<View style={styles.crumbIconPlaceholder} />
</TouchableOpacity>
<TouchableOpacity
onPress={() => { navigator.popToRoute(route); }}
style={styles.crumbIconPlaceholder}
/>
);
},
separatorForRoute: function(route, navigator) {
return (
<TouchableOpacity onPress={navigator.pop}>
<View style={styles.crumbSeparatorPlaceholder} />
</TouchableOpacity>
<TouchableOpacity
onPress={navigator.pop}
style={styles.crumbSeparatorPlaceholder}
/>
);
}
};
@@ -51,12 +51,11 @@ var NavigationBarRouteMapper = {
var previousRoute = navState.routeStack[index - 1];
return (
<TouchableOpacity
onPress={() => navigator.pop()}>
<View style={styles.navBarLeftButton}>
<Text style={[styles.navBarText, styles.navBarButtonText]}>
{previousRoute.title}
</Text>
</View>
onPress={() => navigator.pop()}
style={styles.navBarLeftButton}>
<Text style={[styles.navBarText, styles.navBarButtonText]}>
{previousRoute.title}
</Text>
</TouchableOpacity>
);
},
@@ -64,12 +63,11 @@ var NavigationBarRouteMapper = {
RightButton: function(route, navigator, index, navState) {
return (
<TouchableOpacity
onPress={() => navigator.push(newRandomRoute())}>
<View style={styles.navBarRightButton}>
<Text style={[styles.navBarText, styles.navBarButtonText]}>
Next
</Text>
</View>
onPress={() => navigator.push(newRandomRoute())}
style={styles.navBarRightButton}>
<Text style={[styles.navBarText, styles.navBarButtonText]}>
Next
</Text>
</TouchableOpacity>
);
},
@@ -66,6 +66,7 @@ var NavigatorIOSColors = React.createClass({
tintColor="#FFFFFF"
barTintColor="#183E63"
titleTextColor="#FFFFFF"
translucent={true}
/>
);
},
+16 -10
View File
@@ -11,27 +11,27 @@
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
* @flow-weak
*/
'use strict';
var React = require('react-native');
var {
StyleSheet,
PanResponder,
StyleSheet,
View,
processColor,
} = React;
var CIRCLE_SIZE = 80;
var CIRCLE_COLOR = 'blue';
var CIRCLE_HIGHLIGHT_COLOR = 'green';
var PanResponderExample = React.createClass({
statics: {
title: 'PanResponder Sample',
description: 'Basic gesture handling example',
description: 'Shows the use of PanResponder to provide basic gesture handling.',
},
_panResponder: {},
@@ -52,8 +52,10 @@ var PanResponderExample = React.createClass({
this._previousLeft = 20;
this._previousTop = 84;
this._circleStyles = {
left: this._previousLeft,
top: this._previousTop,
style: {
left: this._previousLeft,
top: this._previousTop
}
};
},
@@ -78,13 +80,17 @@ var PanResponderExample = React.createClass({
_highlight: function() {
this.circle && this.circle.setNativeProps({
backgroundColor: CIRCLE_HIGHLIGHT_COLOR
style: {
backgroundColor: processColor(CIRCLE_HIGHLIGHT_COLOR)
}
});
},
_unHighlight: function() {
this.circle && this.circle.setNativeProps({
backgroundColor: CIRCLE_COLOR
style: {
backgroundColor: processColor(CIRCLE_COLOR)
}
});
},
@@ -106,8 +112,8 @@ var PanResponderExample = React.createClass({
this._highlight();
},
_handlePanResponderMove: function(e: Object, gestureState: Object) {
this._circleStyles.left = this._previousLeft + gestureState.dx;
this._circleStyles.top = this._previousTop + gestureState.dy;
this._circleStyles.style.left = this._previousLeft + gestureState.dx;
this._circleStyles.style.top = this._previousTop + gestureState.dy;
this._updatePosition();
},
_handlePanResponderEnd: function(e: Object, gestureState: Object) {
+2 -2
View File
@@ -250,6 +250,6 @@ var styles = StyleSheet.create({
exports.framework = 'React';
exports.title = 'Pointer Events';
exports.description = '`pointerEvents` is a prop of View that gives control ' +
'of how touches should be handled.';
exports.description = 'Demonstrates the use of the pointerEvents prop of a ' +
'View to control how touches should be handled.';
exports.examples = exampleClasses.map(infoToExample);
@@ -0,0 +1,62 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var ProgressBar = require('ProgressBarAndroid');
var React = require('React');
var UIExplorerBlock = require('UIExplorerBlock');
var UIExplorerPage = require('UIExplorerPage');
var ProgressBarAndroidExample = React.createClass({
statics: {
title: '<ProgressBarAndroid>',
description: 'Visual indicator of progress of some operation. ' +
'Shows either a cyclic animation or a horizontal bar.',
},
render: function() {
return (
<UIExplorerPage title="ProgressBar Examples">
<UIExplorerBlock title="Default ProgressBar">
<ProgressBar />
</UIExplorerBlock>
<UIExplorerBlock title="Small ProgressBar">
<ProgressBar styleAttr="Small" />
</UIExplorerBlock>
<UIExplorerBlock title="Large ProgressBar">
<ProgressBar styleAttr="Large" />
</UIExplorerBlock>
<UIExplorerBlock title="Inverse ProgressBar">
<ProgressBar styleAttr="Inverse" />
</UIExplorerBlock>
<UIExplorerBlock title="Small Inverse ProgressBar">
<ProgressBar styleAttr="SmallInverse" />
</UIExplorerBlock>
<UIExplorerBlock title="Large Inverse ProgressBar">
<ProgressBar styleAttr="LargeInverse" />
</UIExplorerBlock>
</UIExplorerPage>
);
},
});
module.exports = ProgressBarAndroidExample;
+41
View File
@@ -0,0 +1,41 @@
# UIExplorer
The UIExplorer is a sample app that showcases React Native views and modules.
## Running this app
Before running the app, make sure you ran:
cd react-native
npm install
### Running on iOS
Mac OS and Xcode are required.
- Open `Examples/UIExplorer/UIExplorer.xcodeproj` in Xcode
- Hit the Run button
See [Running on device](https://facebook.github.io/react-native/docs/running-on-device-ios.html) if you want to use a physical device.
### Running on Android
You'll need to have all the [prerequisites](https://github.com/facebook/react-native/tree/master/ReactAndroid#prerequisites) (SDK, NDK) for Building React Native installed.
Start an Android emulator ([Genymotion](https://www.genymotion.com) is recommended).
cd react-native
./gradlew :Examples:UIExplorer:android:app:installDebug
./packager/packager.sh
_Note: Building for the first time can take a while._
Open the UIExplorer app in your emulator.
See [Running on Device](https://facebook.github.io/react-native/docs/running-on-device-android.html) in case you want to use a physical device.
## Built from source
Building the app on both iOS and Android means building the React Native framework from source. This way you're running the latest native and JS code the way you see it in your clone of the github repo.
This is different from apps created using `react-native init` which have a dependency on a specific version of React Native JS and native code, declared in a `package.json` file (and `build.gradle` for Android apps).
-136
View File
@@ -1,136 +0,0 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
StyleSheet,
PanResponder,
View,
} = React;
var CIRCLE_SIZE = 80;
var CIRCLE_COLOR = 'blue';
var CIRCLE_HIGHLIGHT_COLOR = 'green';
var NavigatorIOSExample = React.createClass({
statics: {
title: 'PanResponder Sample',
description: 'Basic gesture handling example',
},
_panResponder: {},
_previousLeft: 0,
_previousTop: 0,
_circleStyles: {},
circle: (null : ?{ setNativeProps(props: Object): void }),
componentWillMount: function() {
this._panResponder = PanResponder.create({
onStartShouldSetPanResponder: this._handleStartShouldSetPanResponder,
onMoveShouldSetPanResponder: this._handleMoveShouldSetPanResponder,
onPanResponderGrant: this._handlePanResponderGrant,
onPanResponderMove: this._handlePanResponderMove,
onPanResponderRelease: this._handlePanResponderEnd,
onPanResponderTerminate: this._handlePanResponderEnd,
});
this._previousLeft = 20;
this._previousTop = 84;
this._circleStyles = {
left: this._previousLeft,
top: this._previousTop,
};
},
componentDidMount: function() {
this._updatePosition();
},
render: function() {
return (
<View
style={styles.container}>
<View
ref={(circle) => {
this.circle = circle;
}}
style={styles.circle}
{...this._panResponder.panHandlers}
/>
</View>
);
},
_highlight: function() {
this.circle && this.circle.setNativeProps({
backgroundColor: CIRCLE_HIGHLIGHT_COLOR
});
},
_unHighlight: function() {
this.circle && this.circle.setNativeProps({
backgroundColor: CIRCLE_COLOR
});
},
_updatePosition: function() {
this.circle && this.circle.setNativeProps(this._circleStyles);
},
_handleStartShouldSetPanResponder: function(e: Object, gestureState: Object): boolean {
// Should we become active when the user presses down on the circle?
return true;
},
_handleMoveShouldSetPanResponder: function(e: Object, gestureState: Object): boolean {
// Should we become active when the user moves a touch over the circle?
return true;
},
_handlePanResponderGrant: function(e: Object, gestureState: Object) {
this._highlight();
},
_handlePanResponderMove: function(e: Object, gestureState: Object) {
this._circleStyles.left = this._previousLeft + gestureState.dx;
this._circleStyles.top = this._previousTop + gestureState.dy;
this._updatePosition();
},
_handlePanResponderEnd: function(e: Object, gestureState: Object) {
this._unHighlight();
this._previousLeft += gestureState.dx;
this._previousTop += gestureState.dy;
},
});
var styles = StyleSheet.create({
circle: {
width: CIRCLE_SIZE,
height: CIRCLE_SIZE,
borderRadius: CIRCLE_SIZE / 2,
backgroundColor: CIRCLE_COLOR,
position: 'absolute',
left: 0,
top: 0,
},
container: {
flex: 1,
paddingTop: 64,
},
});
module.exports = NavigatorIOSExample;
+2 -2
View File
@@ -33,9 +33,9 @@ exports.examples = [
render: function() {
return (
<ScrollView
automaticallyAdjustContentInsets={false}
onScroll={() => { console.log('onScroll!'); }}
scrollEventThrottle={200}
contentInset={{top: -50}}
style={styles.scrollView}>
{THUMBS.map(createThumbRow)}
</ScrollView>
@@ -47,8 +47,8 @@ exports.examples = [
render: function() {
return (
<ScrollView
automaticallyAdjustContentInsets={false}
horizontal={true}
contentInset={{top: -50}}
style={[styles.scrollView, styles.horizontalScrollView]}>
{THUMBS.map(createThumbRow)}
</ScrollView>
@@ -0,0 +1,82 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
ScrollView,
StyleSheet,
Text,
TouchableOpacity
} = React;
var NUM_ITEMS = 20;
var ScrollViewSimpleExample = React.createClass({
statics: {
title: '<ScrollView>',
description: 'Component that enables scrolling through child components.'
},
makeItems: function(nItems: number, styles): Array<any> {
var items = [];
for (var i = 0; i < nItems; i++) {
items[i] = (
<TouchableOpacity key={i} style={styles}>
<Text>{'Item ' + i}</Text>
</TouchableOpacity>
);
}
return items;
},
render: function() {
// One of the items is a horizontal scroll view
var items = this.makeItems(NUM_ITEMS, styles.itemWrapper);
items[4] = (
<ScrollView key={'scrollView'} horizontal={true}>
{this.makeItems(NUM_ITEMS, [styles.itemWrapper, styles.horizontalItemWrapper])}
</ScrollView>
);
var verticalScrollView = (
<ScrollView style={styles.verticalScrollView}>
{items}
</ScrollView>
);
return verticalScrollView;
}
});
var styles = StyleSheet.create({
verticalScrollView: {
margin: 10,
},
itemWrapper: {
backgroundColor: '#dddddd',
alignItems: 'center',
borderRadius: 5,
borderWidth: 5,
borderColor: '#a52a2a',
padding: 30,
margin: 5,
},
horizontalItemWrapper: {
padding: 50
}
});
module.exports = ScrollViewSimpleExample;
@@ -118,7 +118,7 @@ var EventSegmentedControlExample = React.createClass({
_onChange(event) {
this.setState({
selectedIndex: event.nativeEvent.selectedIndex,
selectedIndex: event.nativeEvent.selectedSegmentIndex,
});
},
@@ -83,6 +83,26 @@ exports.examples = [{
</View>
);
},
}, {
title: 'Status Bar Network Activity Indicator',
render() {
return (
<View>
<TouchableHighlight style={styles.wrapper}
onPress={() => StatusBarIOS.setNetworkActivityIndicatorVisible(true)}>
<View style={styles.button}>
<Text>setNetworkActivityIndicatorVisible(true)</Text>
</View>
</TouchableHighlight>
<TouchableHighlight style={styles.wrapper}
onPress={() => StatusBarIOS.setNetworkActivityIndicatorVisible(false)}>
<View style={styles.button}>
<Text>setNetworkActivityIndicatorVisible(false)</Text>
</View>
</TouchableHighlight>
</View>
);
},
}];
var styles = StyleSheet.create({
@@ -0,0 +1,70 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
*/
'use strict';
var React = require('React');
var SwitchAndroid = require('SwitchAndroid');
var Text = require('Text');
var UIExplorerBlock = require('UIExplorerBlock');
var UIExplorerPage = require('UIExplorerPage');
var SwitchAndroidExample = React.createClass({
statics: {
title: '<SwitchAndroid>',
description: 'Standard Android two-state toggle component.'
},
getInitialState : function() {
return {
trueSwitchIsOn: true,
falseSwitchIsOn: false,
colorTrueSwitchIsOn: true,
colorFalseSwitchIsOn: false,
eventSwitchIsOn: false,
};
},
render: function() {
return (
<UIExplorerPage title="<SwitchAndroid>">
<UIExplorerBlock title="Switches can be set to true or false">
<SwitchAndroid
onValueChange={(value) => this.setState({falseSwitchIsOn: value})}
style={{marginBottom: 10}}
value={this.state.falseSwitchIsOn} />
<SwitchAndroid
onValueChange={(value) => this.setState({trueSwitchIsOn: value})}
value={this.state.trueSwitchIsOn} />
</UIExplorerBlock>
<UIExplorerBlock title="Switches can be disabled">
<SwitchAndroid
disabled={true}
style={{marginBottom: 10}}
value={true} />
<SwitchAndroid
disabled={true}
value={false} />
</UIExplorerBlock>
<UIExplorerBlock title="Change events can be detected">
<SwitchAndroid
onValueChange={(value) => this.setState({eventSwitchIsOn: value})}
style={{marginBottom: 10}}
value={this.state.eventSwitchIsOn} />
<SwitchAndroid
onValueChange={(value) => this.setState({eventSwitchIsOn: value})}
style={{marginBottom: 10}}
value={this.state.eventSwitchIsOn} />
<Text>{this.state.eventSwitchIsOn ? "On" : "Off"}</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Switches are controlled components">
<SwitchAndroid />
<SwitchAndroid value={true} />
</UIExplorerBlock>
</UIExplorerPage>
);
}
});
module.exports = SwitchAndroidExample;
+14 -8
View File
@@ -23,12 +23,16 @@ var {
View,
} = React;
var base64Icon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEsAAABLCAQAAACSR7JhAAADtUlEQVR4Ac3YA2Bj6QLH0XPT1Fzbtm29tW3btm3bfLZtv7e2ObZnms7d8Uw098tuetPzrxv8wiISrtVudrG2JXQZ4VOv+qUfmqCGGl1mqLhoA52oZlb0mrjsnhKpgeUNEs91Z0pd1kvihA3ULGVHiQO2narKSHKkEMulm9VgUyE60s1aWoMQUbpZOWE+kaqs4eLEjdIlZTcFZB0ndc1+lhB1lZrIuk5P2aib1NBpZaL+JaOGIt0ls47SKzLC7CqrlGF6RZ09HGoNy1lYl2aRSWL5GuzqWU1KafRdoRp0iOQEiDzgZPnG6DbldcomadViflnl/cL93tOoVbsOLVM2jylvdWjXolWX1hmfZbGR/wjypDjFLSZIRov09BgYmtUqPQPlQrPapecLgTIy0jMgPKtTeob2zWtrGH3xvjUkPCtNg/tm1rjwrMa+mdUkPd3hWbH0jArPGiU9ufCsNNWFZ40wpwn+62/66R2RUtoso1OB34tnLOcy7YB1fUdc9e0q3yru8PGM773vXsuZ5YIZX+5xmHwHGVvlrGPN6ZSiP1smOsMMde40wKv2VmwPPVXNut4sVpUreZiLBHi0qln/VQeI/LTMYXpsJtFiclUN+5HVZazim+Ky+7sAvxWnvjXrJFneVtLWLyPJu9K3cXLWeOlbMTlrIelbMDlrLenrjEQOtIF+fuI9xRp9ZBFp6+b6WT8RrxEpdK64BuvHgDk+vUy+b5hYk6zfyfs051gRoNO1usU12WWRWL73/MMEy9pMi9qIrR4ZpV16Rrvduxazmy1FSvuFXRkqTnE7m2kdb5U8xGjLw/spRr1uTov4uOgQE+0N/DvFrG/Jt7i/FzwxbA9kDanhf2w+t4V97G8lrT7wc08aA2QNUkuTfW/KimT01wdlfK4yEw030VfT0RtZbzjeMprNq8m8tnSTASrTLti64oBNdpmMQm0eEwvfPwRbUBywG5TzjPCsdwk3IeAXjQblLCoXnDVeoAz6SfJNk5TTzytCNZk/POtTSV40NwOFWzw86wNJRpubpXsn60NJFlHeqlYRbslqZm2jnEZ3qcSKgm0kTli3zZVS7y/iivZTweYXJ26Y+RTbV1zh3hYkgyFGSTKPfRVbRqWWVReaxYeSLarYv1Qqsmh1s95S7G+eEWK0f3jYKTbV6bOwepjfhtafsvUsqrQvrGC8YhmnO9cSCk3yuY984F1vesdHYhWJ5FvASlacshUsajFt2mUM9pqzvKGcyNJW0arTKN1GGGzQlH0tXwLDgQTurS8eIQAAAABJRU5ErkJggg==';
var TabBarExample = React.createClass({
statics: {
title: '<TabBarIOS>',
description: 'Tab-based navigation.'
description: 'Tab-based navigation.',
},
displayName: 'TabBarExample',
getInitialState: function() {
return {
selectedTab: 'redTab',
@@ -37,11 +41,11 @@ var TabBarExample = React.createClass({
};
},
_renderContent: function(color: string, pageText: string) {
_renderContent: function(color: string, pageText: string, num?: number) {
return (
<View style={[styles.tabContent, {backgroundColor: color}]}>
<Text style={styles.tabText}>{pageText}</Text>
<Text style={styles.tabText}>{this.state.presses} re-renders of the More tab</Text>
<Text style={styles.tabText}>{num} re-renders of the {pageText}</Text>
</View>
);
},
@@ -49,10 +53,11 @@ var TabBarExample = React.createClass({
render: function() {
return (
<TabBarIOS
tintColor="black"
barTintColor="#3abeff">
tintColor="white"
barTintColor="darkslateblue">
<TabBarIOS.Item
title="Blue Tab"
icon={{uri: base64Icon, scale: 3}}
selected={this.state.selectedTab === 'blueTab'}
onPress={() => {
this.setState({
@@ -71,10 +76,11 @@ var TabBarExample = React.createClass({
notifCount: this.state.notifCount + 1,
});
}}>
{this._renderContent('#783E33', 'Red Tab')}
{this._renderContent('#783E33', 'Red Tab', this.state.notifCount)}
</TabBarIOS.Item>
<TabBarIOS.Item
systemIcon="more"
icon={require('./flux.png')}
title="More"
selected={this.state.selectedTab === 'greenTab'}
onPress={() => {
this.setState({
@@ -82,7 +88,7 @@ var TabBarExample = React.createClass({
presses: this.state.presses + 1
});
}}>
{this._renderContent('#21551C', 'Green Tab')}
{this._renderContent('#21551C', 'Green Tab', this.state.presses)}
</TabBarIOS.Item>
</TabBarIOS>
);
+358
View File
@@ -0,0 +1,358 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
StyleSheet,
Text,
View,
} = React;
var UIExplorerBlock = require('./UIExplorerBlock');
var UIExplorerPage = require('./UIExplorerPage');
var Entity = React.createClass({
render: function() {
return (
<Text style={{fontWeight: 'bold', color: '#527fe4'}}>
{this.props.children}
</Text>
);
}
});
var AttributeToggler = React.createClass({
getInitialState: function() {
return {fontWeight: 'bold', fontSize: 15};
},
toggleWeight: function() {
this.setState({
fontWeight: this.state.fontWeight === 'bold' ? 'normal' : 'bold'
});
},
increaseSize: function() {
this.setState({
fontSize: this.state.fontSize + 1
});
},
render: function() {
var curStyle = {fontWeight: this.state.fontWeight, fontSize: this.state.fontSize};
return (
<View>
<Text style={curStyle}>
Tap the controls below to change attributes.
</Text>
<Text>
<Text>See how it will even work on <Text style={curStyle}>this nested text</Text></Text>
</Text>
<Text>
<Text onPress={this.toggleWeight}>Toggle Weight</Text>
{' (with highlight onPress)'}
</Text>
<Text onPress={this.increaseSize} suppressHighlighting={true}>
Increase Size (suppressHighlighting true)
</Text>
</View>
);
}
});
var TextExample = React.createClass({
statics: {
title: '<Text>',
description: 'Base component for rendering styled text.',
},
render: function() {
return (
<UIExplorerPage title="<Text>">
<UIExplorerBlock title="Wrap">
<Text>
The text should wrap if it goes on multiple lines.
See, this is going to the next line.
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Padding">
<Text style={{padding: 10}}>
This text is indented by 10px padding on all sides.
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Font Family">
<Text style={{fontFamily: 'sans-serif'}}>
Sans-Serif
</Text>
<Text style={{fontFamily: 'sans-serif', fontWeight: 'bold'}}>
Sans-Serif Bold
</Text>
<Text style={{fontFamily: 'serif'}}>
Serif
</Text>
<Text style={{fontFamily: 'serif', fontWeight: 'bold'}}>
Serif Bold
</Text>
<Text style={{fontFamily: 'monospace'}}>
Monospace
</Text>
<Text style={{fontFamily: 'monospace', fontWeight: 'bold'}}>
Monospace Bold (After 5.0)
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Android Material Design fonts">
<View style={{flexDirection: 'row', alignItems: 'flex-start'}}>
<View style={{flex: 1}}>
<Text style={{fontFamily: 'sans-serif'}}>
Roboto Regular
</Text>
<Text style={{fontFamily: 'sans-serif', fontStyle: 'italic'}}>
Roboto Italic
</Text>
<Text style={{fontFamily: 'sans-serif', fontWeight: 'bold'}}>
Roboto Bold
</Text>
<Text style={{fontFamily: 'sans-serif', fontStyle: 'italic', fontWeight: 'bold'}}>
Roboto Bold Italic
</Text>
<Text style={{fontFamily: 'sans-serif-light'}}>
Roboto Light
</Text>
<Text style={{fontFamily: 'sans-serif-light', fontStyle: 'italic'}}>
Roboto Light Italic
</Text>
<Text style={{fontFamily: 'sans-serif-thin'}}>
Roboto Thin (After 4.2)
</Text>
<Text style={{fontFamily: 'sans-serif-thin', fontStyle: 'italic'}}>
Roboto Thin Italic (After 4.2)
</Text>
<Text style={{fontFamily: 'sans-serif-condensed'}}>
Roboto Condensed
</Text>
<Text style={{fontFamily: 'sans-serif-condensed', fontStyle: 'italic'}}>
Roboto Condensed Italic
</Text>
<Text style={{fontFamily: 'sans-serif-condensed', fontWeight: 'bold'}}>
Roboto Condensed Bold
</Text>
<Text style={{
fontFamily: 'sans-serif-condensed',
fontStyle: 'italic',
fontWeight: 'bold'}}>
Roboto Condensed Bold Italic
</Text>
<Text style={{fontFamily: 'sans-serif-medium'}}>
Roboto Medium (After 5.0)
</Text>
<Text style={{fontFamily: 'sans-serif-medium', fontStyle: 'italic'}}>
Roboto Medium Italic (After 5.0)
</Text>
</View>
</View>
</UIExplorerBlock>
<UIExplorerBlock title="Font Size">
<Text style={{fontSize: 23}}>
Size 23
</Text>
<Text style={{fontSize: 8}}>
Size 8
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Color">
<Text style={{color: 'red'}}>
Red color
</Text>
<Text style={{color: 'blue'}}>
Blue color
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Font Weight">
<Text style={{fontWeight: 'bold'}}>
Move fast and be bold
</Text>
<Text style={{fontWeight: 'normal'}}>
Move fast and be bold
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Font Style">
<Text style={{fontStyle: 'italic'}}>
Move fast and be bold
</Text>
<Text style={{fontStyle: 'normal'}}>
Move fast and be bold
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Font Style and Weight">
<Text style={{fontStyle: 'italic', fontWeight: 'bold'}}>
Move fast and be bold
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Nested">
<Text onPress={() => console.log('1st')}>
(Normal text,
<Text style={{fontWeight: 'bold'}} onPress={() => console.log('2nd')}>
(and bold
<Text style={{fontStyle: 'italic', fontSize: 11, color: '#527fe4'}} onPress={() => console.log('3rd')}>
(and tiny bold italic blue
<Text style={{fontWeight: 'normal', fontStyle: 'normal'}} onPress={() => console.log('4th')}>
(and tiny normal blue)
</Text>
)
</Text>
)
</Text>
)
</Text>
<Text style={{fontFamily: 'serif'}} onPress={() => console.log('1st')}>
(Serif
<Text style={{fontStyle: 'italic', fontWeight: 'bold'}} onPress={() => console.log('2nd')}>
(Serif Bold Italic
<Text
style={{fontFamily: 'monospace', fontStyle: 'normal', fontWeight: 'normal'}}
onPress={() => console.log('3rd')}>
(Monospace Normal
<Text
style={{fontFamily: 'sans-serif', fontWeight: 'bold'}}
onPress={() => console.log('4th')}>
(Sans-Serif Bold
<Text style={{fontWeight: 'normal'}} onPress={() => console.log('5th')}>
(and Sans-Serif Normal)
</Text>
)
</Text>
)
</Text>
)
</Text>
)
</Text>
<Text style={{fontSize: 12}}>
<Entity>Entity Name</Entity>
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Text Align">
<Text>
auto (default) - english LTR
</Text>
<Text>
أحب اللغة العربية auto (default) - arabic RTL
</Text>
<Text style={{textAlign: 'left'}}>
left left left left left left left left left left left left left left left
</Text>
<Text style={{textAlign: 'center'}}>
center center center center center center center center center center center
</Text>
<Text style={{textAlign: 'right'}}>
right right right right right right right right right right right right right
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Unicode">
<View style={{flex: 1}}>
<View style={{flexDirection: 'row'}}>
<Text style={{backgroundColor: 'red'}}>
星际争霸是世界上最好的游戏
</Text>
</View>
<View style={{flex: 1}}>
<Text style={{backgroundColor: 'red'}}>
星际争霸是世界上最好的游戏
</Text>
</View>
<View style={{flex: 1, alignItems: 'center'}}>
<Text style={{backgroundColor: 'red'}}>
星际争霸是世界上最好的游戏
</Text>
</View>
<View style={{flex: 1}}>
<Text style={{backgroundColor: 'red'}}>
星际争霸是世界上最好的游戏星际争霸是世界上最好的游戏星际争霸是世界上最好的游戏星际争霸是世界上最好的游戏
</Text>
</View>
</View>
</UIExplorerBlock>
<UIExplorerBlock title="Spaces">
<Text>
A {'generated'} {' '} {'string'} and some &nbsp;&nbsp;&nbsp; spaces
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Line Height">
<Text style={{lineHeight: 35}}>
Holisticly formulate inexpensive ideas before best-of-breed benefits. <Text style={{fontSize: 20}}>Continually</Text> expedite magnetic potentialities rather than client-focused interfaces.
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Empty Text">
<Text />
</UIExplorerBlock>
<UIExplorerBlock title="Toggling Attributes">
<AttributeToggler />
</UIExplorerBlock>
<UIExplorerBlock title="backgroundColor attribute">
<Text style={{backgroundColor: '#ffaaaa'}}>
Red background,
<Text style={{backgroundColor: '#aaaaff'}}>
{' '}blue background,
<Text>
{' '}inherited blue background,
<Text style={{backgroundColor: '#aaffaa'}}>
{' '}nested green background.
</Text>
</Text>
</Text>
</Text>
<Text style={{backgroundColor: 'rgba(100, 100, 100, 0.3)'}}>
Same alpha as background,
<Text>
Inherited alpha from background,
<Text style={{backgroundColor: 'rgba(100, 100, 100, 0.3)'}}>
Reapply alpha
</Text>
</Text>
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="containerBackgroundColor attribute">
<View style={{flexDirection: 'row', height: 85}}>
<View style={{backgroundColor: '#ffaaaa', width: 150}} />
<View style={{backgroundColor: '#aaaaff', width: 150}} />
</View>
<Text style={[styles.backgroundColorText, {top: -80}]}>
Default containerBackgroundColor (inherited) + backgroundColor wash
</Text>
<Text style={[styles.backgroundColorText, {top: -70, backgroundColor: 'transparent'}]}>
{"containerBackgroundColor: 'transparent' + backgroundColor wash"}
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="numberOfLines attribute">
<Text numberOfLines={1}>
Maximum of one line no matter now much I write here. If I keep writing it{"'"}ll just truncate after one line
</Text>
<Text numberOfLines={2} style={{marginTop: 20}}>
Maximum of two lines no matter now much I write here. If I keep writing it{"'"}ll just truncate after two lines
</Text>
<Text style={{marginTop: 20}}>
No maximum lines specified no matter now much I write here. If I keep writing it{"'"}ll just keep going and going
</Text>
</UIExplorerBlock>
</UIExplorerPage>
);
}
});
var styles = StyleSheet.create({
backgroundColorText: {
left: 5,
backgroundColor: 'rgba(100, 100, 100, 0.3)'
},
});
module.exports = TextExample;
+79 -1
View File
@@ -17,6 +17,7 @@
var React = require('react-native');
var {
Image,
StyleSheet,
Text,
View,
@@ -185,6 +186,44 @@ exports.examples = [
</View>
);
},
}, {
title: 'Text Decoration',
render: function() {
return (
<View>
<Text style={{textDecorationLine: 'underline', textDecorationStyle: 'solid'}}>
Solid underline
</Text>
<Text style={{textDecorationLine: 'underline', textDecorationStyle: 'double', textDecorationColor: '#ff0000'}}>
Double underline with custom color
</Text>
<Text style={{textDecorationLine: 'underline', textDecorationStyle: 'dashed', textDecorationColor: '#9CDC40'}}>
Dashed underline with custom color
</Text>
<Text style={{textDecorationLine: 'underline', textDecorationStyle: 'dotted', textDecorationColor: 'blue'}}>
Dotted underline with custom color
</Text>
<Text style={{textDecorationLine: 'none'}}>
None textDecoration
</Text>
<Text style={{textDecorationLine: 'line-through', textDecorationStyle: 'solid'}}>
Solid line-through
</Text>
<Text style={{textDecorationLine: 'line-through', textDecorationStyle: 'double', textDecorationColor: '#ff0000'}}>
Double line-through with custom color
</Text>
<Text style={{textDecorationLine: 'line-through', textDecorationStyle: 'dashed', textDecorationColor: '#9CDC40'}}>
Dashed line-through with custom color
</Text>
<Text style={{textDecorationLine: 'line-through', textDecorationStyle: 'dotted', textDecorationColor: 'blue'}}>
Dotted line-through with custom color
</Text>
<Text style={{textDecorationLine: 'underline line-through'}}>
Both underline and line-through
</Text>
</View>
);
},
}, {
title: 'Nested',
description: 'Nested text components will inherit the styles of their ' +
@@ -231,7 +270,7 @@ exports.examples = [
right right right right right right right right right right right right right
</Text>
<Text style={{textAlign: 'justify'}}>
justify: this text component's contents are laid out with "textAlign: justify"
justify: this text component{"'"}s contents are laid out with "textAlign: justify"
and as you can see all of the lines except the last one span the
available width of the parent container.
</Text>
@@ -331,6 +370,45 @@ exports.examples = [
</View>
);
},
}, {
title: 'Text highlighting (tap the link to see highlight)',
render: function() {
return (
<View>
<Text>Lorem ipsum dolor sit amet, <Text suppressHighlighting={false} style={{backgroundColor: 'white', textDecorationLine: 'underline', color: 'blue'}} onPress={() => null}>consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud</Text> exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</Text>
</View>
);
},
}, {
title: 'allowFontScaling attribute',
render: function() {
return (
<View>
<Text>
By default, text will respect Text Size accessibility setting on iOS.
It means that all font sizes will be increased or descreased depending on the value of Text Size setting in
{" "}<Text style={{fontWeight: 'bold'}}>Settings.app - Display & Brightness - Text Size</Text>
</Text>
<Text style={{marginTop: 10}}>
You can disable scaling for your Text component by passing {"\""}allowFontScaling={"{"}false{"}\""} prop.
</Text>
<Text allowFontScaling={false} style={{marginTop: 20}}>
This text will not scale.
</Text>
</View>
);
},
}, {
title: 'Inline images',
render: function() {
return (
<View>
<Text>
This text contains an inline image <Image source={require('./flux.png')}/>. Neat, huh?
</Text>
</View>
);
},
}];
var styles = StyleSheet.create({
@@ -0,0 +1,325 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
Text,
TextInput,
View,
StyleSheet,
} = React;
var TextEventsExample = React.createClass({
getInitialState: function() {
return {
curText: '<No Event>',
prevText: '<No Event>',
prev2Text: '<No Event>',
};
},
updateText: function(text) {
this.setState((state) => {
return {
curText: text,
prevText: state.curText,
prev2Text: state.prevText,
};
});
},
render: function() {
return (
<View>
<TextInput
autoCapitalize="none"
placeholder="Enter text to see events"
autoCorrect={false}
onFocus={() => this.updateText('onFocus')}
onBlur={() => this.updateText('onBlur')}
onChange={(event) => this.updateText(
'onChange text: ' + event.nativeEvent.text
)}
onEndEditing={(event) => this.updateText(
'onEndEditing text: ' + event.nativeEvent.text
)}
onSubmitEditing={(event) => this.updateText(
'onSubmitEditing text: ' + event.nativeEvent.text
)}
style={styles.singleLine}
/>
<Text style={styles.eventLabel}>
{this.state.curText}{'\n'}
(prev: {this.state.prevText}){'\n'}
(prev2: {this.state.prev2Text})
</Text>
</View>
);
}
});
class RewriteExample extends React.Component {
constructor(props) {
super(props);
this.state = {text: ''};
}
render() {
return (
<TextInput
onChangeText={(text) => {
text = text.replace(/ /g, '_');
this.setState({text});
}}
style={styles.singleLine}
value={this.state.text}
/>
);
}
}
var styles = StyleSheet.create({
multiline: {
height: 60,
fontSize: 16,
padding: 4,
marginBottom: 10,
},
eventLabel: {
margin: 3,
fontSize: 12,
},
singleLine: {
fontSize: 16,
padding: 4,
},
singleLineWithHeightTextInput: {
height: 30,
},
});
exports.title = '<TextInput>';
exports.description = 'Single and multi-line text inputs.';
exports.examples = [
{
title: 'Auto-focus',
render: function() {
return <TextInput autoFocus={true} style={styles.singleLine} />;
}
},
{
title: "Live Re-Write (<sp> -> '_')",
render: function() {
return <RewriteExample />;
}
},
{
title: 'Auto-capitalize',
render: function() {
var autoCapitalizeTypes = [
'none',
'sentences',
'words',
'characters',
];
var examples = autoCapitalizeTypes.map((type) => {
return (
<TextInput
key={type}
autoCapitalize={type}
placeholder={'autoCapitalize: ' + type}
style={styles.singleLine}
/>
);
});
return <View>{examples}</View>;
}
},
{
title: 'Auto-correct',
render: function() {
return (
<View>
<TextInput
autoCorrect={true}
placeholder="This has autoCorrect"
style={styles.singleLine}
/>
<TextInput
autoCorrect={false}
placeholder="This does not have autoCorrect"
style={styles.singleLine}
/>
</View>
);
}
},
{
title: 'Keyboard types',
render: function() {
var keyboardTypes = [
'default',
'email-address',
'numeric',
];
var examples = keyboardTypes.map((type) => {
return (
<TextInput
key={type}
keyboardType={type}
placeholder={'keyboardType: ' + type}
style={styles.singleLine}
/>
);
});
return <View>{examples}</View>;
}
},
{
title: 'Event handling',
render: function(): ReactElement { return <TextEventsExample />; },
},
{
title: 'Colors and text inputs',
render: function() {
return (
<View>
<TextInput
style={[styles.singleLine]}
defaultValue="Default color text"
/>
<TextInput
style={[styles.singleLine, {color: 'green'}]}
defaultValue="Green Text"
/>
<TextInput
placeholder="Default placeholder text color"
style={styles.singleLine}
/>
<TextInput
placeholder="Red placeholder text color"
placeholderTextColor="red"
style={styles.singleLine}
/>
<TextInput
placeholder="Default underline color"
style={styles.singleLine}
/>
<TextInput
placeholder="Blue underline color"
style={styles.singleLine}
underlineColorAndroid="blue"
/>
<TextInput
defaultValue="Same BackgroundColor as View "
style={[styles.singleLine, {backgroundColor: 'rgba(100, 100, 100, 0.3)'}]}>
<Text style={{backgroundColor: 'rgba(100, 100, 100, 0.3)'}}>
Darker backgroundColor
</Text>
</TextInput>
</View>
);
}
},
{
title: 'Text input, themes and heights',
render: function() {
return (
<TextInput
placeholder="If you set height, beware of padding set from themes"
style={[styles.singleLineWithHeightTextInput]}
/>
);
}
},
{
title: 'Passwords',
render: function() {
return (
<TextInput
defaultValue="iloveturtles"
password={true}
style={styles.singleLine}
/>
);
}
},
{
title: 'Editable',
render: function() {
return (
<TextInput
defaultValue="Can't touch this! (>'-')> ^(' - ')^ <('-'<) (>'-')> ^(' - ')^"
editable={false}
style={styles.singleLine}
/>
);
}
},
{
title: 'Multiline',
render: function() {
return (
<View>
<TextInput
autoCorrect={true}
placeholder="multiline, aligned top-left"
placeholderTextColor="red"
multiline={true}
textAlign="start"
textAlignVertical="top"
style={styles.multiline}
/>
<TextInput
autoCorrect={true}
placeholder="multiline, aligned center"
placeholderTextColor="green"
multiline={true}
textAlign="center"
textAlignVertical="center"
style={[styles.multiline]}
/>
<TextInput
autoCorrect={true}
multiline={true}
textAlign="end"
textAlignVertical="bottom"
style={[styles.multiline, {color: 'blue'}]}>
<Text style={styles.multiline}>multiline with children, aligned bottom-right</Text>
</TextInput>
</View>
);
}
},
{
title: 'Fixed number of lines',
platform: 'android',
render: function() {
return (
<View>
<TextInput numberOfLines={2}
multiline={true}
placeholder="Two line input"
/>
<TextInput numberOfLines={5}
multiline={true}
placeholder="Five line input"
/>
</View>
);
}
},
];
@@ -33,7 +33,7 @@ var WithLabel = React.createClass({
{this.props.children}
</View>
);
}
},
});
var TextEventsExample = React.createClass({
@@ -41,13 +41,17 @@ var TextEventsExample = React.createClass({
return {
curText: '<No Event>',
prevText: '<No Event>',
prev2Text: '<No Event>',
};
},
updateText: function(text) {
this.setState({
curText: text,
prevText: this.state.curText,
this.setState((state) => {
return {
curText: text,
prevText: state.curText,
prev2Text: state.prevText,
};
});
},
@@ -73,13 +77,43 @@ var TextEventsExample = React.createClass({
/>
<Text style={styles.eventLabel}>
{this.state.curText}{'\n'}
(prev: {this.state.prevText})
(prev: {this.state.prevText}){'\n'}
(prev2: {this.state.prev2Text})
</Text>
</View>
);
}
});
class RewriteExample extends React.Component {
constructor(props) {
super(props);
this.state = {text: ''};
}
render() {
var limit = 20;
var remainder = limit - this.state.text.length;
var remainderColor = remainder > 5 ? 'blue' : 'red';
return (
<View style={styles.rewriteContainer}>
<TextInput
multiline={false}
maxLength={limit}
onChangeText={(text) => {
text = text.replace(/ /g, '_');
this.setState({text});
}}
style={styles.default}
value={this.state.text}
/>
<Text style={[styles.remainder, {color: remainderColor}]}>
{remainder}
</Text>
</View>
);
}
}
var styles = StyleSheet.create({
page: {
paddingBottom: 300,
@@ -125,12 +159,19 @@ var styles = StyleSheet.create({
flex: 1,
},
label: {
width: 120,
justifyContent: 'flex-end',
flexDirection: 'row',
width: 115,
alignItems: 'flex-end',
marginRight: 10,
paddingTop: 2,
},
rewriteContainer: {
flexDirection: 'row',
alignItems: 'center',
},
remainder: {
textAlign: 'right',
width: 24,
},
});
exports.displayName = (undefined: ?string);
@@ -143,6 +184,12 @@ exports.examples = [
return <TextInput autoFocus={true} style={styles.default} />;
}
},
{
title: "Live Re-Write (<sp> -> '_') + maxLength",
render: function() {
return <RewriteExample />;
}
},
{
title: 'Auto-capitalize',
render: function() {
@@ -268,7 +315,7 @@ exports.examples = [
return (
<View>
<WithLabel label="true">
<TextInput password={true} style={styles.default} value="abc" />
<TextInput password={true} style={styles.default} defaultValue="abc" />
</WithLabel>
</View>
);
@@ -276,7 +323,7 @@ exports.examples = [
},
{
title: 'Event handling',
render: function(): ReactElement { return <TextEventsExample /> },
render: function(): ReactElement { return <TextEventsExample />; },
},
{
title: 'Colored input text',
@@ -285,11 +332,11 @@ exports.examples = [
<View>
<TextInput
style={[styles.default, {color: 'blue'}]}
value="Blue"
defaultValue="Blue"
/>
<TextInput
style={[styles.default, {color: 'green'}]}
value="Green"
defaultValue="Green"
/>
</View>
);
@@ -336,7 +383,7 @@ exports.examples = [
<WithLabel label="clearTextOnFocus">
<TextInput
placeholder="text is cleared on focus"
value="text is cleared on focus"
defaultValue="text is cleared on focus"
style={styles.default}
clearTextOnFocus={true}
/>
@@ -344,7 +391,7 @@ exports.examples = [
<WithLabel label="selectTextOnFocus">
<TextInput
placeholder="text is selected on focus"
value="text is selected on focus"
defaultValue="text is selected on focus"
style={styles.default}
selectTextOnFocus={true}
/>
@@ -364,7 +411,7 @@ exports.examples = [
style={styles.multiline}
/>
<TextInput
placeholder="mutliline text input with font styles and placeholder"
placeholder="multiline text input with font styles and placeholder"
multiline={true}
clearTextOnFocus={true}
autoCorrect={true}
@@ -374,7 +421,7 @@ exports.examples = [
style={[styles.multiline, styles.multilineWithFontStyles]}
/>
<TextInput
placeholder="uneditable mutliline text input"
placeholder="uneditable multiline text input"
editable={false}
multiline={true}
style={styles.multiline}
+18 -38
View File
@@ -18,27 +18,14 @@
var React = require('react-native');
var {
AlertIOS,
StyleSheet,
Platform,
Text,
ToastAndroid,
TouchableHighlight,
View,
} = React;
var TimerMixin = require('react-timer-mixin');
var Button = React.createClass({
render: function() {
return (
<TouchableHighlight
onPress={this.props.onPress}
style={styles.button}
underlayColor="#eeeeee">
<Text>
{this.props.children}
</Text>
</TouchableHighlight>
);
},
});
var UIExplorerButton = require('./UIExplorerButton');
var TimerTester = React.createClass({
mixins: [TimerMixin],
@@ -52,9 +39,9 @@ var TimerTester = React.createClass({
render: function() {
var args = 'fn' + (this.props.dt !== undefined ? ', ' + this.props.dt : '');
return (
<Button onPress={this._run}>
<UIExplorerButton onPress={this._run}>
Measure: {this.props.type}({args}) - {this._ii || 0}
</Button>
</UIExplorerButton>
);
},
@@ -88,7 +75,11 @@ var TimerTester = React.createClass({
var msg = 'Finished ' + this._ii + ' ' + this.props.type + ' calls.\n' +
'Elapsed time: ' + e + ' ms\n' + (e / this._ii) + ' ms / iter';
console.log(msg);
AlertIOS.alert(msg);
if (Platform.OS === 'ios') {
AlertIOS.alert(msg);
} else if (Platform.OS === 'android') {
ToastAndroid.show(msg, ToastAndroid.SHORT);
}
this._start = 0;
this.forceUpdate(() => { this._ii = 0; });
return;
@@ -112,18 +103,6 @@ var TimerTester = React.createClass({
},
});
var styles = StyleSheet.create({
button: {
borderColor: 'gray',
borderRadius: 8,
borderWidth: 1,
padding: 10,
margin: 5,
alignItems: 'center',
justifyContent: 'center',
},
});
exports.framework = 'React';
exports.title = 'Timers, TimerMixin';
exports.description = 'The TimerMixin provides timer functions for executing ' +
@@ -181,8 +160,12 @@ exports.examples = [
render: function() {
if (this.state.showTimer) {
var timer =
<TimerTester ref="interval" dt={25} type="setInterval" />;
var timer = [
<TimerTester ref="interval" dt={25} type="setInterval" />,
<UIExplorerButton onPress={() => this.refs.interval.clear() }>
Clear interval
</UIExplorerButton>
];
var toggleText = 'Unmount timer';
} else {
var timer = null;
@@ -191,12 +174,9 @@ exports.examples = [
return (
<View>
{timer}
<Button onPress={() => this.refs.interval.clear() }>
Clear interval
</Button>
<Button onPress={this._toggleTimer}>
<UIExplorerButton onPress={this._toggleTimer}>
{toggleText}
</Button>
</UIExplorerButton>
</View>
);
},
@@ -0,0 +1,69 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
StyleSheet,
Text,
ToastAndroid,
TouchableWithoutFeedback,
} = React;
var UIExplorerBlock = require('UIExplorerBlock');
var UIExplorerPage = require('UIExplorerPage');
var ToastExample = React.createClass({
statics: {
title: 'Toast Example',
description: 'Example that demostrates the use of an Android Toast to provide feedback.',
},
getInitialState: function() {
return {};
},
render: function() {
return (
<UIExplorerPage title="ToastAndroid">
<UIExplorerBlock title="Simple toast">
<TouchableWithoutFeedback
onPress={() =>
ToastAndroid.show('This is a toast with short duration', ToastAndroid.SHORT)}>
<Text style={styles.text}>Click me.</Text>
</TouchableWithoutFeedback>
</UIExplorerBlock>
<UIExplorerBlock title="Toast with long duration">
<TouchableWithoutFeedback
onPress={() =>
ToastAndroid.show('This is a toast with long duration', ToastAndroid.LONG)}>
<Text style={styles.text}>Click me too.</Text>
</TouchableWithoutFeedback>
</UIExplorerBlock>
</UIExplorerPage>
);
},
});
var styles = StyleSheet.create({
text: {
color: 'black',
},
});
module.exports = ToastExample;
@@ -0,0 +1,127 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
StyleSheet,
Text,
View,
} = React;
var UIExplorerBlock = require('./UIExplorerBlock');
var UIExplorerPage = require('./UIExplorerPage');
var SwitchAndroid = require('SwitchAndroid');
var ToolbarAndroid = require('ToolbarAndroid');
var ToolbarAndroidExample = React.createClass({
statics: {
title: '<ToolbarAndroid>',
description: 'Examples of using the Android toolbar.'
},
getInitialState: function() {
return {
actionText: 'Example app with toolbar component',
toolbarSwitch: false,
colorProps: {
titleColor: '#3b5998',
subtitleColor: '#6a7180',
},
};
},
render: function() {
return (
<UIExplorerPage title="<ToolbarAndroid>">
<UIExplorerBlock title="Toolbar with title/subtitle and actions">
<ToolbarAndroid
actions={toolbarActions}
navIcon={require('image!ic_menu_black_24dp')}
onActionSelected={this._onActionSelected}
onIconClicked={() => this.setState({actionText: 'Icon clicked'})}
style={styles.toolbar}
subtitle={this.state.actionText}
title="Toolbar" />
<Text>{this.state.actionText}</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Toolbar with logo & custom title view (a View with Switch+Text)">
<ToolbarAndroid
logo={require('image!launcher_icon')}
style={styles.toolbar}>
<View style={{height: 56, flexDirection: 'row', alignItems: 'center'}}>
<SwitchAndroid
value={this.state.toolbarSwitch}
onValueChange={(value) => this.setState({'toolbarSwitch': value})} />
<Text>{'\'Tis but a switch'}</Text>
</View>
</ToolbarAndroid>
</UIExplorerBlock>
<UIExplorerBlock title="Toolbar with no icon">
<ToolbarAndroid
actions={toolbarActions}
style={styles.toolbar}
subtitle="There be no icon here" />
</UIExplorerBlock>
<UIExplorerBlock title="Toolbar with navIcon & logo, no title">
<ToolbarAndroid
actions={toolbarActions}
logo={require('image!launcher_icon')}
navIcon={require('image!ic_menu_black_24dp')}
style={styles.toolbar} />
</UIExplorerBlock>
<UIExplorerBlock title="Toolbar with custom title colors">
<ToolbarAndroid
navIcon={require('image!ic_menu_black_24dp')}
onIconClicked={() => this.setState({colorProps: {}})}
title="Wow, such toolbar"
style={styles.toolbar}
subtitle="Much native"
{...this.state.colorProps} />
<Text>
Touch the icon to reset the custom colors to the default (theme-provided) ones.
</Text>
</UIExplorerBlock>
<UIExplorerBlock title="Toolbar with remote logo & navIcon">
<ToolbarAndroid
actions={[{title: 'Bunny', icon: require('./bunny.png'), show: 'always'}]}
logo={require('./hawk.png')}
navIcon={require('./bunny.png')}
title="Bunny and Hawk"
style={styles.toolbar} />
</UIExplorerBlock>
</UIExplorerPage>
);
},
_onActionSelected: function(position) {
this.setState({
actionText: 'Selected ' + toolbarActions[position].title,
});
},
});
var toolbarActions = [
{title: 'Create', icon: require('image!ic_create_black_48dp'), show: 'always'},
{title: 'Filter'},
{title: 'Settings', icon: require('image!ic_settings_black_48dp'), show: 'always'},
];
var styles = StyleSheet.create({
toolbar: {
backgroundColor: '#e9eaed',
height: 56,
},
});
module.exports = ToolbarAndroidExample;
+7 -4
View File
@@ -27,6 +27,7 @@ var {
} = React;
exports.displayName = (undefined: ?string);
exports.description = 'Touchable and onPress examples.';
exports.title = '<Touchable*> and onPress';
exports.examples = [
{
@@ -130,10 +131,11 @@ var TouchableFeedbackEvents = React.createClass({
},
render: function() {
return (
<View>
<View testID="touchable_feedback_events">
<View style={[styles.row, {justifyContent: 'center'}]}>
<TouchableOpacity
style={styles.wrapper}
testID="touchable_feedback_events_button"
onPress={() => this._appendEvent('press')}
onPressIn={() => this._appendEvent('pressIn')}
onPressOut={() => this._appendEvent('pressOut')}
@@ -143,7 +145,7 @@ var TouchableFeedbackEvents = React.createClass({
</Text>
</TouchableOpacity>
</View>
<View style={styles.eventLogBox}>
<View testID="touchable_feedback_events_console" style={styles.eventLogBox}>
{this.state.eventLog.map((e, ii) => <Text key={ii}>{e}</Text>)}
</View>
</View>
@@ -165,10 +167,11 @@ var TouchableDelayEvents = React.createClass({
},
render: function() {
return (
<View>
<View testID="touchable_delay_events">
<View style={[styles.row, {justifyContent: 'center'}]}>
<TouchableOpacity
style={styles.wrapper}
testID="touchable_delay_events_button"
onPress={() => this._appendEvent('press')}
delayPressIn={400}
onPressIn={() => this._appendEvent('pressIn - 400ms delay')}
@@ -181,7 +184,7 @@ var TouchableDelayEvents = React.createClass({
</Text>
</TouchableOpacity>
</View>
<View style={styles.eventLogBox}>
<View style={styles.eventLogBox} testID="touchable_delay_events_console">
{this.state.eventLog.map((e, ii) => <Text key={ii}>{e}</Text>)}
</View>
</View>
+175 -46
View File
@@ -1,59 +1,85 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* @providesModule TransformExample
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
'use strict';
var React = require('React');
var StyleSheet = require('StyleSheet');
var TimerMixin = require('react-timer-mixin');
var UIExplorerBlock = require('UIExplorerBlock');
var UIExplorerPage = require('UIExplorerPage');
var View = require('View');
var TransformExample = React.createClass({
mixins: [TimerMixin],
var React = require('react-native');
var {
Animated,
StyleSheet,
Text,
View,
} = React;
var Flip = React.createClass({
getInitialState() {
return {
interval: this.setInterval(this._update, 800),
pulse: false,
theta: new Animated.Value(45),
};
},
componentDidMount() {
this._animate();
},
_animate() {
this.state.theta.setValue(0);
Animated.timing(this.state.theta, {
toValue: 360,
duration: 5000,
}).start(this._animate);
},
render() {
return (
<UIExplorerPage title="Transforms">
<UIExplorerBlock title="foo bar">
<View style={{height: 500}}>
<View style={styles.box1} />
<View style={styles.box2} />
<View style={styles.box3step1} />
<View style={styles.box3step2} />
<View style={styles.box3step3} />
<View style={styles.box4} />
<View style={[
styles.box5,
this.state.pulse ? styles.box5Transform : null
]} />
</View>
</UIExplorerBlock>
</UIExplorerPage>
<View style={styles.flipCardContainer}>
<Animated.View style={[
styles.flipCard,
{transform: [
{perspective: 850},
{rotateX: this.state.theta.interpolate({
inputRange: [0, 180],
outputRange: ['0deg', '180deg']
})},
]}]}>
<Text style={styles.flipText}>
This text is flipping great.
</Text>
</Animated.View>
<Animated.View style={[styles.flipCard, {
position: 'absolute',
top: 0,
backgroundColor: 'red',
transform: [
{perspective: 850},
{rotateX: this.state.theta.interpolate({
inputRange: [0, 180],
outputRange: ['180deg', '360deg']
})},
]}]}>
<Text style={styles.flipText}>
On the flip side...
</Text>
</Animated.View>
</View>
);
},
_update() {
this.setState({
pulse: !this.state.pulse,
});
},
}
});
var styles = StyleSheet.create({
container: {
height: 500,
},
box1: {
left: 0,
backgroundColor: 'green',
@@ -86,7 +112,7 @@ var styles = StyleSheet.create({
},
box3step1: {
left: 0,
backgroundColor: '#ffb6c1', // lightpink
backgroundColor: 'lightpink',
height: 50,
position: 'absolute',
top: 0,
@@ -97,7 +123,7 @@ var styles = StyleSheet.create({
},
box3step2: {
left: 0,
backgroundColor: '#ff69b4', //hotpink
backgroundColor: 'hotpink',
height: 50,
opacity: 0.5,
position: 'absolute',
@@ -111,7 +137,7 @@ var styles = StyleSheet.create({
},
box3step3: {
left: 0,
backgroundColor: '#ff1493', // deeppink
backgroundColor: 'deeppink',
height: 50,
opacity: 0.5,
position: 'absolute',
@@ -127,7 +153,7 @@ var styles = StyleSheet.create({
},
box4: {
left: 0,
backgroundColor: '#ff8c00', // darkorange
backgroundColor: 'darkorange',
height: 50,
position: 'absolute',
top: 0,
@@ -139,7 +165,7 @@ var styles = StyleSheet.create({
width: 100,
},
box5: {
backgroundColor: '#800000', // maroon
backgroundColor: 'maroon',
height: 50,
position: 'absolute',
right: 0,
@@ -153,7 +179,110 @@ var styles = StyleSheet.create({
{scale: 2},
],
},
flipCardContainer: {
marginVertical: 40,
flex: 1,
alignSelf: 'center',
},
flipCard: {
width: 200,
height: 200,
alignItems: 'center',
justifyContent: 'center',
backgroundColor: 'blue',
backfaceVisibility: 'hidden',
},
flipText: {
width: 90,
fontSize: 20,
color: 'white',
fontWeight: 'bold',
}
});
module.exports = TransformExample;
exports.title = 'Transforms';
exports.description = 'View transforms';
exports.examples = [
{
title: 'Perspective',
description: 'perspective: 850, rotateX: Animated.timing(0 -> 360)',
render(): ReactElement { return <Flip />; }
},
{
title: 'Translate, Rotate, Scale',
description: "translateX: 100, translateY: 50, rotate: '30deg', scaleX: 2, scaleY: 2",
render() {
return (
<View style={styles.container}>
<View style={styles.box1} />
</View>
);
}
},
{
title: 'Scale, Translate, Rotate, ',
description: "scaleX: 2, scaleY: 2, translateX: 100, translateY: 50, rotate: '30deg'",
render() {
return (
<View style={styles.container}>
<View style={styles.box2} />
</View>
);
}
},
{
title: 'Rotate',
description: "rotate: '30deg'",
render() {
return (
<View style={styles.container}>
<View style={styles.box3step1} />
</View>
);
}
},
{
title: 'Rotate, Scale',
description: "rotate: '30deg', scaleX: 2, scaleY: 2",
render() {
return (
<View style={styles.container}>
<View style={styles.box3step2} />
</View>
);
}
},
{
title: 'Rotate, Scale, Translate ',
description: "rotate: '30deg', scaleX: 2, scaleY: 2, translateX: 100, translateY: 50",
render() {
return (
<View style={styles.container}>
<View style={styles.box3step3} />
</View>
);
}
},
{
title: 'Translate, Scale, Rotate',
description: "translate: [200, 350], scale: 2.5, rotate: '-0.2rad'",
render() {
return (
<View style={styles.container}>
<View style={styles.box4} />
</View>
);
}
},
{
title: 'Translate, Rotate, Scale',
description: "translate: [-50, 35], rotate: '50deg', scale: 2",
render() {
return (
<View style={styles.container}>
<View style={[styles.box5, styles.box5Transform]} />
</View>
);
}
}
];
@@ -7,19 +7,24 @@
objects = {
/* Begin PBXBuildFile section */
1300627F1B59179B0043FE5A /* RCTGzipTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 1300627E1B59179B0043FE5A /* RCTGzipTests.m */; };
13417FE91AA91432003F314A /* libRCTImage.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 13417FE81AA91428003F314A /* libRCTImage.a */; };
134180011AA9153C003F314A /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 13417FEF1AA914B8003F314A /* libRCTText.a */; };
1341802C1AA9178B003F314A /* libRCTNetwork.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 1341802B1AA91779003F314A /* libRCTNetwork.a */; };
134454601AAFCABD003F0779 /* libRCTAdSupport.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 1344545A1AAFCAAE003F0779 /* libRCTAdSupport.a */; };
134A8A2A1AACED7A00945AAE /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 134A8A251AACED6A00945AAE /* libRCTGeolocation.a */; };
138D6A181B53CD440074A87E /* RCTShadowViewTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 138D6A161B53CD440074A87E /* RCTShadowViewTests.m */; };
138DEE241B9EDFB6007F4EA5 /* libRCTCameraRoll.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 138DEE091B9EDDDB007F4EA5 /* libRCTCameraRoll.a */; };
1393D0381B68CD1300E1B601 /* RCTModuleMethodTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 1393D0371B68CD1300E1B601 /* RCTModuleMethodTests.m */; };
139FDEDB1B0651FB00C62182 /* libRCTWebSocket.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 139FDED91B0651EA00C62182 /* libRCTWebSocket.a */; };
13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; };
13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB11A68108700A75B9A /* LaunchScreen.xib */; };
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
141FC1211B222EBB004D5FFB /* IntegrationTestsTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 141FC1201B222EBB004D5FFB /* IntegrationTestsTests.m */; };
143BC5A11B21E45C00462512 /* UIExplorerIntegrationTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 143BC5A01B21E45C00462512 /* UIExplorerIntegrationTests.m */; };
144D21241B2204C5006DB32B /* RCTClippingTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 144D21231B2204C5006DB32B /* RCTClippingTests.m */; };
13DB03481B5D2ED500C27245 /* RCTJSONTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 13DB03471B5D2ED500C27245 /* RCTJSONTests.m */; };
13DF61B61B67A45000EDB188 /* RCTMethodArgumentTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 13DF61B51B67A45000EDB188 /* RCTMethodArgumentTests.m */; };
143BC5A11B21E45C00462512 /* UIExplorerSnapshotTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 143BC5A01B21E45C00462512 /* UIExplorerSnapshotTests.m */; };
144D21241B2204C5006DB32B /* RCTImageUtilTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 144D21231B2204C5006DB32B /* RCTImageUtilTests.m */; };
147CED4C1AB3532B00DA3E4C /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 147CED4B1AB34F8C00DA3E4C /* libRCTActionSheet.a */; };
1497CFAC1B21F5E400C1F8F2 /* RCTAllocationTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 1497CFA41B21F5E400C1F8F2 /* RCTAllocationTests.m */; };
1497CFAD1B21F5E400C1F8F2 /* RCTBridgeTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 1497CFA51B21F5E400C1F8F2 /* RCTBridgeTests.m */; };
@@ -46,7 +51,11 @@
14D6D7291B2222EF001FB087 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 14AADF041AC3DB95002390C9 /* libReact.a */; };
14DC67F41AB71881001358AB /* libRCTPushNotification.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 14DC67F11AB71876001358AB /* libRCTPushNotification.a */; };
3578590A1B28D2CF00341EDB /* libRCTLinking.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 357859011B28D2C500341EDB /* libRCTLinking.a */; };
3DB99D0C1BA0340600302749 /* UIExplorerIntegrationTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 3DB99D0B1BA0340600302749 /* UIExplorerIntegrationTests.m */; };
834C36EC1AF8DED70019C93C /* libRCTSettings.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 834C36D21AF8DA610019C93C /* libRCTSettings.a */; };
83636F8F1B53F22C009F943E /* RCTUIManagerScenarioTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 83636F8E1B53F22C009F943E /* RCTUIManagerScenarioTests.m */; };
8385CEF51B873B5C00C6273E /* RCTImageLoaderTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 8385CEF41B873B5C00C6273E /* RCTImageLoaderTests.m */; };
8385CF041B87479200C6273E /* RCTImageLoaderHelpers.m in Sources */ = {isa = PBXBuildFile; fileRef = 8385CF031B87479200C6273E /* RCTImageLoaderHelpers.m */; };
D85B829E1AB6D5D7003F4FE2 /* libRCTVibration.a in Frameworks */ = {isa = PBXBuildFile; fileRef = D85B829C1AB6D5CE003F4FE2 /* libRCTVibration.a */; };
/* End PBXBuildFile section */
@@ -86,6 +95,13 @@
remoteGlobalIDString = 134814201AA4EA6300B7C361;
remoteInfo = RCTGeolocation;
};
138DEE081B9EDDDB007F4EA5 /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
containerPortal = 138DEE021B9EDDDB007F4EA5 /* RCTCameraRoll.xcodeproj */;
proxyType = 2;
remoteGlobalIDString = 58B5115D1A9E6B3D00147676;
remoteInfo = RCTImage;
};
139FDED81B0651EA00C62182 /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
containerPortal = 139FDECA1B0651EA00C62182 /* RCTWebSocket.xcodeproj */;
@@ -153,11 +169,15 @@
/* Begin PBXFileReference section */
004D289E1AAF61C70097A701 /* UIExplorerUnitTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = UIExplorerUnitTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
1300627E1B59179B0043FE5A /* RCTGzipTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTGzipTests.m; sourceTree = "<group>"; };
13417FE31AA91428003F314A /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = ../../Libraries/Image/RCTImage.xcodeproj; sourceTree = "<group>"; };
13417FEA1AA914B8003F314A /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../../Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
134180261AA91779003F314A /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = ../../Libraries/Network/RCTNetwork.xcodeproj; sourceTree = "<group>"; };
134454551AAFCAAE003F0779 /* RCTAdSupport.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTAdSupport.xcodeproj; path = ../../Libraries/AdSupport/RCTAdSupport.xcodeproj; sourceTree = "<group>"; };
134A8A201AACED6A00945AAE /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = ../../Libraries/Geolocation/RCTGeolocation.xcodeproj; sourceTree = "<group>"; };
138D6A161B53CD440074A87E /* RCTShadowViewTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTShadowViewTests.m; sourceTree = "<group>"; };
138DEE021B9EDDDB007F4EA5 /* RCTCameraRoll.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTCameraRoll.xcodeproj; path = ../../Libraries/CameraRoll/RCTCameraRoll.xcodeproj; sourceTree = "<group>"; };
1393D0371B68CD1300E1B601 /* RCTModuleMethodTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTModuleMethodTests.m; sourceTree = "<group>"; };
139FDECA1B0651EA00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../../Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
13B07F961A680F5B00A75B9A /* UIExplorer.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = UIExplorer.app; sourceTree = BUILT_PRODUCTS_DIR; };
13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = UIExplorer/AppDelegate.h; sourceTree = "<group>"; };
@@ -167,7 +187,8 @@
13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = UIExplorer/Info.plist; sourceTree = "<group>"; };
13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = UIExplorer/main.m; sourceTree = "<group>"; };
13CC9D481AEED2B90020D1C2 /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = ../../Libraries/Settings/RCTSettings.xcodeproj; sourceTree = "<group>"; };
141FC1201B222EBB004D5FFB /* IntegrationTestsTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = IntegrationTestsTests.m; sourceTree = "<group>"; };
13DB03471B5D2ED500C27245 /* RCTJSONTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTJSONTests.m; sourceTree = "<group>"; };
13DF61B51B67A45000EDB188 /* RCTMethodArgumentTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTMethodArgumentTests.m; sourceTree = "<group>"; };
143BC57E1B21E18100462512 /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
143BC5811B21E18100462512 /* testLayoutExampleSnapshot_1@2x.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "testLayoutExampleSnapshot_1@2x.png"; sourceTree = "<group>"; };
143BC5821B21E18100462512 /* testSliderExampleSnapshot_1@2x.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "testSliderExampleSnapshot_1@2x.png"; sourceTree = "<group>"; };
@@ -177,8 +198,8 @@
143BC5861B21E18100462512 /* testViewExampleSnapshot_1@2x.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "testViewExampleSnapshot_1@2x.png"; sourceTree = "<group>"; };
143BC5951B21E3E100462512 /* UIExplorerIntegrationTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = UIExplorerIntegrationTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
143BC5981B21E3E100462512 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
143BC5A01B21E45C00462512 /* UIExplorerIntegrationTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = UIExplorerIntegrationTests.m; sourceTree = "<group>"; };
144D21231B2204C5006DB32B /* RCTClippingTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTClippingTests.m; sourceTree = "<group>"; };
143BC5A01B21E45C00462512 /* UIExplorerSnapshotTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = UIExplorerSnapshotTests.m; sourceTree = "<group>"; };
144D21231B2204C5006DB32B /* RCTImageUtilTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTImageUtilTests.m; sourceTree = "<group>"; };
1497CFA41B21F5E400C1F8F2 /* RCTAllocationTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTAllocationTests.m; sourceTree = "<group>"; };
1497CFA51B21F5E400C1F8F2 /* RCTBridgeTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTBridgeTests.m; sourceTree = "<group>"; };
1497CFA61B21F5E400C1F8F2 /* RCTContextExecutorTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTContextExecutorTests.m; sourceTree = "<group>"; };
@@ -201,7 +222,12 @@
14DC67E71AB71876001358AB /* RCTPushNotification.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTPushNotification.xcodeproj; path = ../../Libraries/PushNotificationIOS/RCTPushNotification.xcodeproj; sourceTree = "<group>"; };
14E0EEC81AB118F7000DECC3 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = ../../Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj; sourceTree = "<group>"; };
357858F81B28D2C400341EDB /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../../Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; };
3DB99D0B1BA0340600302749 /* UIExplorerIntegrationTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = UIExplorerIntegrationTests.m; sourceTree = "<group>"; };
58005BE41ABA80530062E044 /* RCTTest.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTTest.xcodeproj; path = ../../Libraries/RCTTest/RCTTest.xcodeproj; sourceTree = "<group>"; };
83636F8E1B53F22C009F943E /* RCTUIManagerScenarioTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTUIManagerScenarioTests.m; sourceTree = "<group>"; };
8385CEF41B873B5C00C6273E /* RCTImageLoaderTests.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTImageLoaderTests.m; sourceTree = "<group>"; };
8385CF031B87479200C6273E /* RCTImageLoaderHelpers.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTImageLoaderHelpers.m; sourceTree = "<group>"; };
8385CF051B8747A000C6273E /* RCTImageLoaderHelpers.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RCTImageLoaderHelpers.h; sourceTree = "<group>"; };
D85B82911AB6D5CE003F4FE2 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = ../../Libraries/Vibration/RCTVibration.xcodeproj; sourceTree = "<group>"; };
/* End PBXFileReference section */
@@ -233,6 +259,7 @@
14AADF051AC3DBB1002390C9 /* libReact.a in Frameworks */,
147CED4C1AB3532B00DA3E4C /* libRCTActionSheet.a in Frameworks */,
134454601AAFCABD003F0779 /* libRCTAdSupport.a in Frameworks */,
138DEE241B9EDFB6007F4EA5 /* libRCTCameraRoll.a in Frameworks */,
134A8A2A1AACED7A00945AAE /* libRCTGeolocation.a in Frameworks */,
13417FE91AA91432003F314A /* libRCTImage.a in Frameworks */,
3578590A1B28D2CF00341EDB /* libRCTLinking.a in Frameworks */,
@@ -260,13 +287,14 @@
isa = PBXGroup;
children = (
14AADEFF1AC3DB95002390C9 /* React.xcodeproj */,
14DC67E71AB71876001358AB /* RCTPushNotification.xcodeproj */,
14E0EEC81AB118F7000DECC3 /* RCTActionSheet.xcodeproj */,
134454551AAFCAAE003F0779 /* RCTAdSupport.xcodeproj */,
138DEE021B9EDDDB007F4EA5 /* RCTCameraRoll.xcodeproj */,
134A8A201AACED6A00945AAE /* RCTGeolocation.xcodeproj */,
13417FE31AA91428003F314A /* RCTImage.xcodeproj */,
357858F81B28D2C400341EDB /* RCTLinking.xcodeproj */,
134180261AA91779003F314A /* RCTNetwork.xcodeproj */,
14DC67E71AB71876001358AB /* RCTPushNotification.xcodeproj */,
13CC9D481AEED2B90020D1C2 /* RCTSettings.xcodeproj */,
58005BE41ABA80530062E044 /* RCTTest.xcodeproj */,
13417FEA1AA914B8003F314A /* RCTText.xcodeproj */,
@@ -316,6 +344,14 @@
name = Products;
sourceTree = "<group>";
};
138DEE031B9EDDDB007F4EA5 /* Products */ = {
isa = PBXGroup;
children = (
138DEE091B9EDDDB007F4EA5 /* libRCTCameraRoll.a */,
);
name = Products;
sourceTree = "<group>";
};
139FDECB1B0651EA00C62182 /* Products */ = {
isa = PBXGroup;
children = (
@@ -342,11 +378,19 @@
children = (
1497CFA41B21F5E400C1F8F2 /* RCTAllocationTests.m */,
1497CFA51B21F5E400C1F8F2 /* RCTBridgeTests.m */,
144D21231B2204C5006DB32B /* RCTClippingTests.m */,
1497CFA61B21F5E400C1F8F2 /* RCTContextExecutorTests.m */,
1497CFA71B21F5E400C1F8F2 /* RCTConvert_NSURLTests.m */,
1497CFA81B21F5E400C1F8F2 /* RCTConvert_UIFontTests.m */,
1497CFA91B21F5E400C1F8F2 /* RCTEventDispatcherTests.m */,
1300627E1B59179B0043FE5A /* RCTGzipTests.m */,
8385CF051B8747A000C6273E /* RCTImageLoaderHelpers.h */,
8385CF031B87479200C6273E /* RCTImageLoaderHelpers.m */,
8385CEF41B873B5C00C6273E /* RCTImageLoaderTests.m */,
144D21231B2204C5006DB32B /* RCTImageUtilTests.m */,
13DB03471B5D2ED500C27245 /* RCTJSONTests.m */,
13DF61B51B67A45000EDB188 /* RCTMethodArgumentTests.m */,
1393D0371B68CD1300E1B601 /* RCTModuleMethodTests.m */,
138D6A161B53CD440074A87E /* RCTShadowViewTests.m */,
1497CFAA1B21F5E400C1F8F2 /* RCTSparseArrayTests.m */,
1497CFAB1B21F5E400C1F8F2 /* RCTUIManagerTests.m */,
143BC57E1B21E18100462512 /* Info.plist */,
@@ -381,8 +425,9 @@
143BC5961B21E3E100462512 /* UIExplorerIntegrationTests */ = {
isa = PBXGroup;
children = (
141FC1201B222EBB004D5FFB /* IntegrationTestsTests.m */,
143BC5A01B21E45C00462512 /* UIExplorerIntegrationTests.m */,
3DB99D0B1BA0340600302749 /* UIExplorerIntegrationTests.m */,
143BC5A01B21E45C00462512 /* UIExplorerSnapshotTests.m */,
83636F8E1B53F22C009F943E /* RCTUIManagerScenarioTests.m */,
143BC5971B21E3E100462512 /* Supporting Files */,
);
path = UIExplorerIntegrationTests;
@@ -592,6 +637,10 @@
ProductGroup = 134454561AAFCAAE003F0779 /* Products */;
ProjectRef = 134454551AAFCAAE003F0779 /* RCTAdSupport.xcodeproj */;
},
{
ProductGroup = 138DEE031B9EDDDB007F4EA5 /* Products */;
ProjectRef = 138DEE021B9EDDDB007F4EA5 /* RCTCameraRoll.xcodeproj */;
},
{
ProductGroup = 134A8A211AACED6A00945AAE /* Products */;
ProjectRef = 134A8A201AACED6A00945AAE /* RCTGeolocation.xcodeproj */;
@@ -682,6 +731,13 @@
remoteRef = 134A8A241AACED6A00945AAE /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
138DEE091B9EDDDB007F4EA5 /* libRCTCameraRoll.a */ = {
isa = PBXReferenceProxy;
fileType = archive.ar;
path = libRCTCameraRoll.a;
remoteRef = 138DEE081B9EDDDB007F4EA5 /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
139FDED91B0651EA00C62182 /* libRCTWebSocket.a */ = {
isa = PBXReferenceProxy;
fileType = archive.ar;
@@ -772,14 +828,21 @@
buildActionMask = 2147483647;
files = (
1497CFB01B21F5E400C1F8F2 /* RCTConvert_UIFontTests.m in Sources */,
144D21241B2204C5006DB32B /* RCTClippingTests.m in Sources */,
144D21241B2204C5006DB32B /* RCTImageUtilTests.m in Sources */,
1393D0381B68CD1300E1B601 /* RCTModuleMethodTests.m in Sources */,
1497CFB21B21F5E400C1F8F2 /* RCTSparseArrayTests.m in Sources */,
1300627F1B59179B0043FE5A /* RCTGzipTests.m in Sources */,
1497CFAF1B21F5E400C1F8F2 /* RCTConvert_NSURLTests.m in Sources */,
1497CFAE1B21F5E400C1F8F2 /* RCTContextExecutorTests.m in Sources */,
1497CFAD1B21F5E400C1F8F2 /* RCTBridgeTests.m in Sources */,
1497CFB11B21F5E400C1F8F2 /* RCTEventDispatcherTests.m in Sources */,
1497CFB31B21F5E400C1F8F2 /* RCTUIManagerTests.m in Sources */,
13DB03481B5D2ED500C27245 /* RCTJSONTests.m in Sources */,
1497CFAC1B21F5E400C1F8F2 /* RCTAllocationTests.m in Sources */,
13DF61B61B67A45000EDB188 /* RCTMethodArgumentTests.m in Sources */,
138D6A181B53CD440074A87E /* RCTShadowViewTests.m in Sources */,
8385CF041B87479200C6273E /* RCTImageLoaderHelpers.m in Sources */,
8385CEF51B873B5C00C6273E /* RCTImageLoaderTests.m in Sources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@@ -796,8 +859,9 @@
isa = PBXSourcesBuildPhase;
buildActionMask = 2147483647;
files = (
141FC1211B222EBB004D5FFB /* IntegrationTestsTests.m in Sources */,
143BC5A11B21E45C00462512 /* UIExplorerIntegrationTests.m in Sources */,
3DB99D0C1BA0340600302749 /* UIExplorerIntegrationTests.m in Sources */,
83636F8F1B53F22C009F943E /* RCTUIManagerScenarioTests.m in Sources */,
143BC5A11B21E45C00462512 /* UIExplorerSnapshotTests.m in Sources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@@ -1014,9 +1078,11 @@
GCC_SYMBOLS_PRIVATE_EXTERN = NO;
GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
GCC_WARN_ABOUT_MISSING_NEWLINE = YES;
GCC_WARN_ABOUT_MISSING_PROTOTYPES = YES;
GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
GCC_WARN_INITIALIZER_NOT_FULLY_BRACKETED = YES;
GCC_WARN_MULTIPLE_DEFINITION_TYPES_FOR_SELECTOR = YES;
GCC_WARN_SHADOW = YES;
GCC_WARN_STRICT_SELECTOR_MATCH = YES;
GCC_WARN_UNDECLARED_SELECTOR = YES;
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
@@ -1028,6 +1094,7 @@
"$(inherited)",
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
"$(SRCROOT)/../../React/**",
"$(SRCROOT)/../../Libraries/**",
);
IPHONEOS_DEPLOYMENT_TARGET = 7.0;
MTL_ENABLE_DEBUG_INFO = YES;
@@ -1068,9 +1135,11 @@
GCC_C_LANGUAGE_STANDARD = gnu99;
GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
GCC_WARN_ABOUT_MISSING_NEWLINE = YES;
GCC_WARN_ABOUT_MISSING_PROTOTYPES = YES;
GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
GCC_WARN_INITIALIZER_NOT_FULLY_BRACKETED = YES;
GCC_WARN_MULTIPLE_DEFINITION_TYPES_FOR_SELECTOR = YES;
GCC_WARN_SHADOW = YES;
GCC_WARN_STRICT_SELECTOR_MATCH = YES;
GCC_WARN_UNDECLARED_SELECTOR = YES;
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
@@ -1082,6 +1151,7 @@
"$(inherited)",
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
"$(SRCROOT)/../../React/**",
"$(SRCROOT)/../../Libraries/**",
);
IPHONEOS_DEPLOYMENT_TARGET = 7.0;
MTL_ENABLE_DEBUG_INFO = NO;
+58 -37
View File
@@ -14,56 +14,77 @@
#import "AppDelegate.h"
#import "RCTBridge.h"
#import "RCTJavaScriptLoader.h"
#import "RCTRootView.h"
@interface AppDelegate() <RCTBridgeDelegate>
@end
@implementation AppDelegate
- (BOOL)application:(__unused UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
NSURL *jsCodeLocation;
RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self
launchOptions:launchOptions];
/**
* Loading JavaScript code - uncomment the one you want.
*
* OPTION 1
* Load from development server. Start the server from the repository root:
*
* $ npm start
*
* To run on device, change `localhost` to the IP address of your computer
* (you can get this by typing `ifconfig` into the terminal and selecting the
* `inet` value under `en0:`) and make sure your computer and iOS device are
* on the same Wi-Fi network.
*/
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle?dev=true"];
/**
* OPTION 2
* Load from pre-bundled file on disk. To re-generate the static bundle, `cd`
* to your Xcode project folder and run
*
* $ curl 'http://localhost:8081/Examples/UIExplorer/UIExplorerApp.includeRequire.runModule.bundle' -o main.jsbundle
*
* then add the `main.jsbundle` file to your project and uncomment this line:
*/
// jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#if RUNNING_ON_CI
jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"UIExplorerApp"
launchOptions:launchOptions];
RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
moduleName:@"UIExplorerApp"
initialProperties:nil];
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
UIViewController *rootViewController = [[UIViewController alloc] init];
UIViewController *rootViewController = [UIViewController new];
rootViewController.view = rootView;
self.window.rootViewController = rootViewController;
[self.window makeKeyAndVisible];
return YES;
}
- (NSURL *)sourceURLForBridge:(__unused RCTBridge *)bridge
{
NSURL *sourceURL;
/**
* Loading JavaScript code - uncomment the one you want.
*
* OPTION 1
* Load from development server. Start the server from the repository root:
*
* $ npm start
*
* To run on device, change `localhost` to the IP address of your computer
* (you can get this by typing `ifconfig` into the terminal and selecting the
* `inet` value under `en0:`) and make sure your computer and iOS device are
* on the same Wi-Fi network.
*/
sourceURL = [NSURL URLWithString:@"http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.bundle?platform=ios&dev=true"];
/**
* OPTION 2
* Load from pre-bundled file on disk. To re-generate the static bundle, `cd`
* to your Xcode project folder and run
*
* $ curl 'http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.bundle' -o main.jsbundle
*
* then add the `main.jsbundle` file to your project and uncomment this line:
*/
// sourceURL = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#if RUNNING_ON_CI
sourceURL = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
return sourceURL;
}
- (void)loadSourceForBridge:(RCTBridge *)bridge
withBlock:(RCTSourceLoadBlock)loadCallback
{
[RCTJavaScriptLoader loadBundleAtURL:[self sourceURLForBridge:bridge]
onComplete:loadCallback];
}
@end
@@ -0,0 +1,21 @@
{
"images" : [
{
"idiom" : "universal",
"filename" : "uie_thumb_big.png",
"scale" : "1x"
},
{
"idiom" : "universal",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 KiB

+31 -22
View File
@@ -17,33 +17,43 @@
'use strict';
var React = require('react-native');
var Dimensions = require('Dimensions');
var DrawerLayoutAndroid = require('DrawerLayoutAndroid');
var ToolbarAndroid = require('ToolbarAndroid');
var UIExplorerList = require('./UIExplorerList');
var {
AppRegistry,
BackAndroid,
Dimensions,
DrawerLayoutAndroid,
StyleSheet,
ToolbarAndroid,
View,
} = React;
var UIExplorerList = require('./UIExplorerList.android');
var DRAWER_WIDTH_LEFT = 56;
var UIExplorerApp = React.createClass({
getInitialState: function() {
return {
example: {
title: 'UIExplorer',
component: this._renderHome(),
},
example: this._getUIExplorerHome(),
};
},
_getUIExplorerHome: function() {
return {
title: 'UIExplorer',
component: this._renderHome(),
};
},
componentWillMount: function() {
BackAndroid.addEventListener('hardwareBackPress', this._handleBackButtonPress);
},
render: function() {
return (
<DrawerLayoutAndroid
drawerPosition={DrawerLayoutAndroid.positions.Left}
drawerWidth={Dimensions.get('window').width - DRAWER_WIDTH_LEFT}
keyboardDismissMode="on-drag"
ref={(drawer) => { this.drawer = drawer; }}
renderNavigationView={this._renderNavigationView}>
{this._renderNavigation()}
@@ -62,14 +72,11 @@ var UIExplorerApp = React.createClass({
onSelectExample: function(example) {
this.drawer.closeDrawer();
if (example.title === 'UIExplorer') {
example.component = this._renderHome();
if (example.title === this._getUIExplorerHome().title) {
example = this._getUIExplorerHome();
}
this.setState({
example: {
title: example.title,
component: example.component,
},
example: example,
});
},
@@ -103,16 +110,16 @@ var UIExplorerApp = React.createClass({
);
},
_handleBackButtonPress: function() {
if (this.state.example.title !== this._getUIExplorerHome().title) {
this.onSelectExample(this._getUIExplorerHome());
return true;
}
return false;
},
});
var styles = StyleSheet.create({
messageText: {
fontSize: 17,
fontWeight: '500',
padding: 15,
marginTop: 50,
marginLeft: 15,
},
container: {
flex: 1,
},
@@ -122,4 +129,6 @@ var styles = StyleSheet.create({
},
});
AppRegistry.registerComponent('UIExplorerApp', () => UIExplorerApp);
module.exports = UIExplorerApp;
+18 -17
View File
@@ -17,7 +17,7 @@
'use strict';
var React = require('react-native');
var UIExplorerList = require('./UIExplorerList');
var UIExplorerList = require('./UIExplorerList.ios');
var {
AppRegistry,
NavigatorIOS,
@@ -43,22 +43,23 @@ var UIExplorerApp = React.createClass({
/>
);
}
return (
<NavigatorIOS
style={styles.container}
initialRoute={{
title: 'UIExplorer',
component: UIExplorerList,
passProps: {
onExternalExampleRequested: (example) => {
this.setState({ openExternalExample: example, });
},
}
}}
itemWrapperStyle={styles.itemWrapper}
tintColor="#008888"
/>
);
return (
<NavigatorIOS
style={styles.container}
initialRoute={{
title: 'UIExplorer',
component: UIExplorerList,
passProps: {
onExternalExampleRequested: (example) => {
this.setState({ openExternalExample: example, });
},
}
}}
itemWrapperStyle={styles.itemWrapper}
tintColor="#008888"
/>
);
}
});
+56
View File
@@ -0,0 +1,56 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
* @flow
*/
'use strict';
var React = require('react-native');
var {
StyleSheet,
Text,
TouchableHighlight,
} = React;
var UIExplorerButton = React.createClass({
propTypes: {
onPress: React.PropTypes.func,
},
render: function() {
return (
<TouchableHighlight
onPress={this.props.onPress}
style={styles.button}
underlayColor="grey">
<Text>
{this.props.children}
</Text>
</TouchableHighlight>
);
},
});
var styles = StyleSheet.create({
button: {
borderColor: '#696969',
borderRadius: 8,
borderWidth: 1,
padding: 10,
margin: 5,
alignItems: 'center',
justifyContent: 'center',
backgroundColor: '#d3d3d3',
},
});
module.exports = UIExplorerButton;
@@ -1,94 +0,0 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
#import <UIKit/UIKit.h>
#import <XCTest/XCTest.h>
#import <RCTTest/RCTTestRunner.h>
#import "RCTAssert.h"
@interface IntegrationTestsTests : XCTestCase
@end
@implementation IntegrationTestsTests
{
RCTTestRunner *_runner;
}
- (void)setUp
{
#if __LP64__
RCTAssert(false, @"Tests should be run on 32-bit device simulators (e.g. iPhone 5)");
#endif
NSOperatingSystemVersion version = [[NSProcessInfo processInfo] operatingSystemVersion];
RCTAssert(version.majorVersion == 8 || version.minorVersion == 3, @"Tests should be run on iOS 8.3, found %zd.%zd.%zd", version.majorVersion, version.minorVersion, version.patchVersion);
_runner = RCTInitRunnerForApp(@"Examples/UIExplorer/UIExplorerIntegrationTests/js/IntegrationTestsApp");
}
#pragma mark Logic Tests
- (void)testTheTester
{
[_runner runTest:_cmd module:@"IntegrationTestHarnessTest"];
}
- (void)testTheTester_waitOneFrame
{
[_runner runTest:_cmd
module:@"IntegrationTestHarnessTest"
initialProps:@{@"waitOneFrame": @YES}
expectErrorBlock:nil];
}
- (void)testTheTester_ExpectError
{
[_runner runTest:_cmd
module:@"IntegrationTestHarnessTest"
initialProps:@{@"shouldThrow": @YES}
expectErrorRegex:@"because shouldThrow"];
}
- (void)testTimers
{
[_runner runTest:_cmd module:@"TimersTest"];
}
- (void)testAsyncStorage
{
[_runner runTest:_cmd module:@"AsyncStorageTest"];
}
- (void)DISABLED_testLayoutEvents // #7149037
{
[_runner runTest:_cmd module:@"LayoutEventsTest"];
}
- (void)testAppEvents
{
[_runner runTest:_cmd module:@"AppEventsTest"];
}
- (void)testPromises
{
[_runner runTest:_cmd module:@"PromiseTest"];
}
#pragma mark Snapshot Tests
- (void)testSimpleSnapshot
{
// If tests have changes, set recordMode = YES below and re-run
_runner.recordMode = NO;
[_runner runTest:_cmd module:@"SimpleSnapshotTest"];
}
@end
@@ -0,0 +1,192 @@
/**
* The examples provided by Facebook are for non-commercial testing and
* evaluation purposes only.
*
* Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
#import <UIKit/UIKit.h>
#import <XCTest/XCTest.h>
#import "RCTSparseArray.h"
#import "RCTUIManager.h"
#import "UIView+React.h"
@interface RCTUIManager (Testing)
- (void)_manageChildren:(NSNumber *)containerReactTag
moveFromIndices:(NSArray *)moveFromIndices
moveToIndices:(NSArray *)moveToIndices
addChildReactTags:(NSArray *)addChildReactTags
addAtIndices:(NSArray *)addAtIndices
removeAtIndices:(NSArray *)removeAtIndices
registry:(RCTSparseArray *)registry;
@property (nonatomic, readonly) RCTSparseArray *viewRegistry;
@end
@interface RCTUIManagerScenarioTests : XCTestCase
@property (nonatomic, readwrite, strong) RCTUIManager *uiManager;
@end
@implementation RCTUIManagerScenarioTests
- (void)setUp
{
[super setUp];
_uiManager = [RCTUIManager new];
// Register 20 views to use in the tests
for (NSInteger i = 1; i <= 20; i++) {
UIView *registeredView = [UIView new];
registeredView.reactTag = @(i);
_uiManager.viewRegistry[i] = registeredView;
}
}
- (void)testManagingChildrenToAddViews
{
UIView *containerView = _uiManager.viewRegistry[20];
NSMutableArray *addedViews = [NSMutableArray array];
NSArray *tagsToAdd = @[@1, @2, @3, @4, @5];
NSArray *addAtIndices = @[@0, @1, @2, @3, @4];
for (NSNumber *tag in tagsToAdd) {
[addedViews addObject:_uiManager.viewRegistry[tag]];
}
// Add views 1-5 to view 20
[_uiManager _manageChildren:@20
moveFromIndices:nil
moveToIndices:nil
addChildReactTags:tagsToAdd
addAtIndices:addAtIndices
removeAtIndices:nil
registry:_uiManager.viewRegistry];
XCTAssertTrue([[containerView reactSubviews] count] == 5,
@"Expect to have 5 react subviews after calling manage children \
with 5 tags to add, instead have %lu", (unsigned long)[[containerView reactSubviews] count]);
for (UIView *view in addedViews) {
XCTAssertTrue([view superview] == containerView,
@"Expected to have manage children successfully add children");
[view removeFromSuperview];
}
}
- (void)testManagingChildrenToRemoveViews
{
UIView *containerView = _uiManager.viewRegistry[20];
NSMutableArray *removedViews = [NSMutableArray array];
NSArray *removeAtIndices = @[@0, @4, @8, @12, @16];
for (NSNumber *index in removeAtIndices) {
NSNumber *reactTag = @(index.integerValue + 2);
[removedViews addObject:_uiManager.viewRegistry[reactTag]];
}
for (NSInteger i = 2; i < 20; i++) {
UIView *view = _uiManager.viewRegistry[i];
[containerView addSubview:view];
}
// Remove views 1-5 from view 20
[_uiManager _manageChildren:@20
moveFromIndices:nil
moveToIndices:nil
addChildReactTags:nil
addAtIndices:nil
removeAtIndices:removeAtIndices
registry:_uiManager.viewRegistry];
XCTAssertEqual(containerView.reactSubviews.count, (NSUInteger)13,
@"Expect to have 13 react subviews after calling manage children\
with 5 tags to remove and 18 prior children, instead have %zd",
containerView.reactSubviews.count);
for (UIView *view in removedViews) {
XCTAssertTrue([view superview] == nil,
@"Expected to have manage children successfully remove children");
// After removing views are unregistered - we need to reregister
_uiManager.viewRegistry[view.reactTag] = view;
}
for (NSInteger i = 2; i < 20; i++) {
UIView *view = _uiManager.viewRegistry[i];
if (![removedViews containsObject:view]) {
XCTAssertTrue([view superview] == containerView,
@"Should not have removed view with react tag %ld during delete but did", (long)i);
[view removeFromSuperview];
}
}
}
// We want to start with views 1-10 added at indices 0-9
// Then we'll remove indices 2, 3, 5 and 8
// Add views 11 and 12 to indices 0 and 6
// And move indices 4 and 9 to 1 and 7
// So in total it goes from:
// [1,2,3,4,5,6,7,8,9,10]
// to
// [11,5,1,2,7,8,12,10]
- (void)testManagingChildrenToAddRemoveAndMove
{
UIView *containerView = _uiManager.viewRegistry[20];
NSArray *removeAtIndices = @[@2, @3, @5, @8];
NSArray *addAtIndices = @[@0, @6];
NSArray *tagsToAdd = @[@11, @12];
NSArray *moveFromIndices = @[@4, @9];
NSArray *moveToIndices = @[@1, @7];
// We need to keep these in array to keep them around
NSMutableArray *viewsToRemove = [NSMutableArray array];
for (NSUInteger i = 0; i < removeAtIndices.count; i++) {
NSNumber *reactTagToRemove = @([removeAtIndices[i] integerValue] + 1);
UIView *viewToRemove = _uiManager.viewRegistry[reactTagToRemove];
[viewsToRemove addObject:viewToRemove];
}
for (NSInteger i = 1; i < 11; i++) {
UIView *view = _uiManager.viewRegistry[i];
[containerView addSubview:view];
}
[_uiManager _manageChildren:@20
moveFromIndices:moveFromIndices
moveToIndices:moveToIndices
addChildReactTags:tagsToAdd
addAtIndices:addAtIndices
removeAtIndices:removeAtIndices
registry:_uiManager.viewRegistry];
XCTAssertTrue([[containerView reactSubviews] count] == 8,
@"Expect to have 8 react subviews after calling manage children,\
instead have the following subviews %@", [containerView reactSubviews]);
NSArray *expectedReactTags = @[@11, @5, @1, @2, @7, @8, @12, @10];
for (NSUInteger i = 0; i < containerView.subviews.count; i++) {
XCTAssertEqualObjects([[containerView reactSubviews][i] reactTag], expectedReactTags[i],
@"Expected subview at index %ld to have react tag #%@ but has tag #%@",
(long)i, expectedReactTags[i], [[containerView reactSubviews][i] reactTag]);
}
// Clean up after ourselves
for (NSInteger i = 1; i < 13; i++) {
UIView *view = _uiManager.viewRegistry[i];
[view removeFromSuperview];
}
for (UIView *view in viewsToRemove) {
_uiManager.viewRegistry[view.reactTag] = view;
}
}
@end

Some files were not shown because too many files have changed in this diff Show More