Commit Graph

85 Commits

Author SHA1 Message Date
chaceliang 7159a4e947 Revert "[React Native] Remove layout-only nodes" 2015-06-25 13:30:06 -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
Tadeu Zagallo 336e18d20b [ReactNative] Move module info from bridge to RCTModuleData
Summary:
@public

The info about bridge modules (such as id, name, queue, methods...) was spread
across arrays & dictionaries on the bridge, move it into a specific class.

It also removes a lot of information that was statically cached, and now have
the same lifecycle of the bridge.

Also moved RCTModuleMethod, RCTFrameUpdate and RCTBatchedBridge into it's own
files, for organization sake.

NOTE: This diff seems huge, but most of it was just moving code :)

Test Plan:
Tested UIExplorer & UIExplorer tests, Catalyst, MAdMan and Groups. Everything
looks fine.
2015-06-24 17:42:12 -08:00
Pieter De Baets effa43926b Provide root reactTag to RootComponent and use it to resolve view controllers 2015-06-24 10:20:55 -08:00
Nick Lockwood 0624a0fe52 Fixed async local storage 2015-06-23 14:24:42 -08:00
Nick Lockwood 86639450ee Fixed AsyncLocalStorage bug 2015-06-22 14:40:33 -08:00
Andrei Coman 5c1ac2a753 [ReactNative] Block native from becoming js responder 2015-06-19 16:30:15 -08:00
Nick Lockwood 4ddfc14d29 Fixed stickers 2015-06-18 20:31:25 -08:00
Spencer Ahrens dc393162c3 [RN Events] clear disk cache on logout 2015-06-18 09:32:05 -08:00
Andy Street 3029511ce4 [react_native] JS files from D2163804: [react_native] Add native root tag to createView calls 2015-06-18 05:26:41 -08:00
Tadeu Zagallo a885efe02d [ReactNative] Add more markers and fix FPS graph
Summary:
@public

Add marker to show JavaScript download duration + flow arrows to show the origin
of the UI blocks being flushed.
Also fixed the condition on `RCTPerfStats`, UI and JS graphs were being created
at startup time, now they're just created on the first time they're shown.

Test Plan:
The markers:

{F22577660}

To check the FPS graph, enable it on the DevMenu, and it should appear initially
empty, instead of previously filled as before.
2015-06-17 14:10:52 -08:00
Tadeu Zagallo d3065fc2e7 [ReactNative] Remove RCT_IMPORT_METHOD macro and generate lookup table dynamically
Summary:
@public

This removes the last piece of data that was still stored on the DATA section,
`RCT_IMPORT_METHOD`. JS calls now dynamically populate a lookup table simultaneously
on JS and Native, instead of creating  a mapping at load time.

Test Plan: Everything still runs, tests are green.
2015-06-15 13:05:52 -08:00
Tadeu Zagallo c30365acba [ReactNative] Remove RCTJSTimers
Summary:
@public

Remove `RCTJSTimers.js`, the file was just an alias to `JSTimersExecution`.

Test Plan: Still builds.
2015-06-15 10:50:28 -08:00
Nick Lockwood 650fc9de4c Increased warning levels to -Wall -Wextra, and fixed Xcode 7 beta issues
Summary:
@public

I've increased the warning levels in the OSS frameworks, which caught a bunch of minor issues. I also fixed some new errors in Xcode 7 relating to designated initializers and TLS security.

Test Plan:
* Test the sample apps and make sure they still work.
* Run tests.
2015-06-15 07:52:50 -08:00
Tadeu Zagallo efd386eba2 [ReactNative] Fix timers for debugger executors
Summary:
@public

`-[RCTJavaScriptExecutor executeBlockOnJavaScriptQueue:]` would always `dispatch_async`
for the WebView and WebSocket executors, what caused for any frame aligned dispatch.

Test Plan:
Test the `Timers, TimerMixin` example on UIExplorer, `requestAnimationFrame` was
taking ~33.3ms when debugging, now takes ~16.6ms as expected.
2015-06-12 16:59:19 -08:00
Nick Lockwood 5efc1b48a5 Fixed text layout on screen rotation
Summary:
@public

setFrame:forRootView: wasn't triggering a batch update, which is required to trigger text update. This meant text wasn't re-displayed after a rotate, only after a touch.

I also found a bug that meant we weren't caching textStorage as much as we could be. Fixed that too.

Test Plan:
* Test <Text> example in UIExplorer and ensure it lays out on rotate.
* Test <Timers> example and verify text is still updating
* Products shouldn't be affected as they have separate text implementation
2015-06-12 11:54:21 -08:00
Tadeu Zagallo 2a7adfb815 [ReactNative] Use RCTNullIfNill and (id)kCFNull
Summary:
@public

Use consistent `null` handling:

`value || null`                ->  `RCTNullIfNil(value)`
`value == null ? nil : value`  ->  `RCTNilIfNull(value)`
`[NSNull null]`                ->  `(id)kCFNull`

Test Plan: The tests should be enough.
2015-06-12 11:03:10 -08:00
Spencer Ahrens 492e29a091 [ReactNative] backout orange box
Summary:
@public

This probably needs more thought - might want to differentiate between console.error and reportError.

Test Plan: console.error and reportError no longer redbox.  invariant and RCTLogError still do.
2015-06-11 10:39:59 -08:00
Spencer Ahrens 68bb3a7e71 [ReactNative] orange box
Summary:
@public

There have been multiple instances of confusion about whether a redbox means the
developer did something they shouldn't but things will keep working, or if
something went horribly wrong and the app will crash in prod.  This diff
introduces an orange background color to the redbox for `console.error` and
`RCTLogError` to indicate that something bad happened, but that the app will
continue working.

Test Plan:
see orange error for geo permissions:

{F22541375}
2015-06-09 14:53:29 -08:00
Tadeu Zagallo c2fb21b322 [ReactNative] Properly pause frame update observers when idle
Summary:
@public

`RCTDispatchEvent` and `RCTTiming` weren't being paused when there wasn't any
work left to be done.

Test Plan:
Run the timers example - check everything still works as expected
Test the ListView paging example - check scroll events are still fired as expected
Launch UIExplorer, let it idle, and put a break point on `-[RCTBridge dispatchBlock:moduleID:]`,
it should never fire.
2015-06-07 08:45:18 -08:00
Tadeu Zagallo 1c9e957d22 [ReactNative] Invalidate modules on their own queues
Summary:
@public

Bridge modules were being invalidate on the main thread, what could lead to
racing conditions, move the calls to invalidate on happen to the module's
methodQueue

Test Plan: Run the tests
2015-06-06 14:13:32 -08:00
Tadeu Zagallo 35b770201d [ReactNative] Merge IntegrationTest into UIExplorer tests 2015-06-06 13:38:35 -08:00
Nick Lockwood 45d8fb0ef6 Removed deprecated RCT_EXPORT + code paths 2015-06-05 09:58:25 -08:00
Spencer Ahrens 7ffa7bd1f1 [ReactNative] Implement merge functionality for AsyncStorage 2015-06-03 16:53:29 -08:00
Spencer Ahrens d796584b6c [ReactNative] ErrorUtils.reportError shouldn't redbox
Summary:
@public

ErrorUtils.reportError is intended for reporting handled errors to the
server, like timeouts, which means that we shouldn't shove them in the
developer's face.

Test Plan: add `require('ErrorUtils').reportError(new Error('error'))` and see a useful error message with stack but no redbox.  Debugger confirms `reportSoftException` is called but it doesn't do anything yet.  `reportFatalError` and throwing exceptions still show redboxes.
2015-06-02 17:47:49 -08:00
Tadeu Zagallo 0f16d15d64 [ReactNative] Optimize console.profile and add markers on JS entry points
Summary:
@public

Right now the profiler shows how long the executor took on JS but doesn't show
how long each of the batched calls took, this adds a *very* high level view of JS
execution (still doesn't show properly calls dispatched with setImmediate)

Also added a global property on JS to avoid trips to Native when profiling is
disabled.

Test Plan:
Run the Profiler on any app

{F22491690}
2015-06-02 06:22:49 -08:00
Nick Lockwood 49e87af934 Fixed text update on OSS 2015-06-01 08:44:11 -08:00
Tadeu Zagallo b03446e27e [ReactNative] Stop traversing the whole view hierarchy every frame
Summary:
@public

`RCTUIManager` would traverse the whole view hierarchy every time there was any
call from JS to Native to call `reactBridgeDidFinishTransaction` on the views
that would respond to it. This is a deprecated method that is only implemented
by 3 classes, so for now we keep track of these views as they're created and
just iterate through them on updates.

Test Plan:
> NOTE: I tested this on UIExplorer, since the internally none of the classes are used

I tried to keep it simple, so I added the following to the old code:
```
__block NSUInteger count = 0;
UIView *rootView = _viewRegistry[rootViewTag];
RCTTraverseViewNodes(rootView, ^(id<RCTViewNodeProtocol> view) {
  count ++;
  if ([view respondsToSelector:@selector(reactBridgeDidFinishTransaction)]) {
    [view reactBridgeDidFinishTransaction];
  }
});
NSLog(@"Views iterated: %zd", count);
```
The output after scrolling 20 sections of the `<ListView> - Paging` example was

```
2015-06-01 00:47:07.351 UIExplorer[67675:1709506] Views iterated: 1549
```

*every frame*

After the change

```
for (id<RCTViewNodeProtocol> node in _bridgeTransactionListeners) {
  [node reactBridgeDidFinishTransaction];
}
NSLog(@"Views iterated: %zd", _bridgeTransactionListeners.count);
```

```
2015-06-01 00:51:23.715 UIExplorer[70355:1716465] Views iterated: 3
```

No matter how many pages are loaded, the output is always 3.
2015-06-01 03:14:14 -08:00
Jiajie Zhu df58789f22 [RN] fix duplicate observe 2015-05-31 14:46:38 -08:00
Nick Lockwood 36c33b4a60 Fixed delayed text layout bug 2015-05-29 10:43:13 -08:00
Spencer Ahrens a4442e4576 [ReactNative] rename nativeProps const to NativeProps 2015-05-26 19:28:07 -08:00
Nick Lockwood 0689c0790e Fixed crash in RCTText due to NSTextContainer/NSLayoutManager being accessed concurrently from main and shadow queues 2015-05-26 18:52:46 -08:00
Alex Kotliarskyi cfa4b13472 [ReactNative] Element Inspector
Summary:
This adds new development feature to React Native that provides information
about selected element (see the demo in Test Plan).

This is how it works:

App's root component is rendered to a container that also has a hidden layer called
`<InspectorOverlay/>`. When activated, it shows full screen view and captures all
touches. On every touch we ask UIManager to find a view for given {x,y} coordinates.

Then, we use React's internals to find corresponding React component. `setRootInstance`
is used to remember the top level component to start search from, lmk if you have a
better idea how to do this. Given a component, we can climb up its owners tree
to provice more context on how/where the component is used.

In future we could use the `hierarchy` array to inspect and print their props/state.

Known bugs and limitations:
* InspectorOverlay sometimes receives touches with incorrect coordinates (wtf)
* Not integrated with React Chrome Devtools (maybe in followup diffs)
* Doesn't work with popovers (maybe put the element inspector into an `<Overlay/>`?)

@public

Test Plan:
https://www.facebook.com/pxlcld/mn5k
Works nicely with scrollviews
2015-05-26 11:19:49 -08:00
Nick Lockwood b7c669aa73 Fixed root view background color propagation 2015-05-26 04:18:55 -08:00
Tadeu Zagallo 9062bda79b [ReactNative] Add RCTAssertThread and restrict -[UIManager addUIBlock:] to _shadowQueue
Summary:
@public

Add `RCTAssertThread` to `RCTAssert.h` for convenience when checking the current/queue,
it accepts either a `NSString *`, `NSThread *` or `dispatch_queue_t` as the object to be checked

Also add a check to `-[RCTUIManager addUIBlock:]` - There was a discussion on github (https://github.com/facebook/react-native/issues/1365)
due to the weird behavior caused by calling it from a different thread/queue (it might be added after `batchDidComplete` has been called
and will just be dispatched on the next call from JS to objc)

Test Plan:
Change `-[RCTAnimationExperimentalManager methodQueue]` to return `dispatch_get_main_queue()` and run the 2048 example,
it should dispatch with a helpful message (screenshot on the comments)
2015-05-25 05:23:27 -08:00
Jared Forsyth aad54006e3 Observing "MemoryWarningNotification" and proxying it up to the DeviceEventEmitter 2015-05-22 13:09:56 -08:00
Georgiy Kassabli d211359aeb Added ability to set custom accessibility tap handler to React Native 2015-05-20 08:32:15 -08:00
Alex Akers a4f92ba3db [React Native] Add magic tap accessibility gesture 2015-05-19 06:28:01 -08:00
Spencer Ahrens 81ad810186 [ReactNative] differentiate fatal and soft exceptions 2015-05-13 13:24:37 -07:00
Tadeu Zagallo 92d7324f15 [ReactNative] Fix RootContentView release when the top-level bridge is held
Summary:
The RCTRootView creates a underlying RCTRootContentView that was deallocated when
the bridge modules were deallocated. That doesn't work when the bridge is held.

@public

Test Plan:
Launch Groups, put a breakpoint on `-[RCTRootContentView dealloc]`, enter and
leave a group page. It should be called now.
2015-05-13 13:24:36 -07:00
Tadeu Zagallo ef339250b5 [ReactNative] Add prompt to AlertIOS
Summary:
Add `AlertIOS.prompt`

It's compatible with the js spec, with the exception that I had to add
a callback param since it's async. Also supports the same button configuration
as `AlertIOS.alert`.

@public

Test Plan:
I've updated the `AlertIOS` example on UIExplorer with every
valid combination of
parameters, so just going through it should be fine.
2015-05-13 13:24:36 -07:00
Spencer Ahrens 1ef4e00fba [ReactNative] Introduce onLayout events
Summary:
Simply add an `onLayout` callback to a native view component, and the callback
will be invoked with the current layout information when the view is mounted and
whenever the layout changes.

The only limitation is that scroll position and other stuff the layout system
isn't aware of is not taken into account.  This is because onLayout events
wouldn't be triggered for these changes and if they are desired they should be
tracked separately (e.g. with `onScroll`) and combined.

Also fixes some bugs with LayoutAnimation callbacks.

@public

Test Plan:
- Run new LayoutEventsExample in UIExplorer and see it work correctly.
- New integration test passes internally (IntegrationTest project seems busted).
- New jest test case passes.

{F22318433}

```
2015-05-06 15:45:05.848 [info][tid:com.facebook.React.JavaScript] "Running application "UIExplorerApp" with appParams: {"rootTag":1,"initialProps":{}}. __DEV__ === true, development-level warning are ON, performance optimizations are OFF"
2015-05-06 15:45:05.881 [info][tid:com.facebook.React.JavaScript] "received text layout event
", {"target":27,"layout":{"y":123,"x":12.5,"width":140.5,"height":18}}
2015-05-06 15:45:05.882 [info][tid:com.facebook.React.JavaScript] "received image layout event
", {"target":23,"layout":{"y":12.5,"x":122,"width":50,"height":50}}
2015-05-06 15:45:05.883 [info][tid:com.facebook.React.JavaScript] "received view layout event
", {"target":22,"layout":{"y":70.5,"x":20,"width":294,"height":204}}
2015-05-06 15:45:05.897 [info][tid:com.facebook.React.JavaScript] "received text layout event
", {"target":27,"layout":{"y":206.5,"x":12.5,"width":140.5,"height":18}}
2015-05-06 15:45:05.897 [info][tid:com.facebook.React.JavaScript] "received view layout event
", {"target":22,"layout":{"y":70.5,"x":20,"width":294,"height":287.5}}
2015-05-06 15:45:09.847 [info][tid:com.facebook.React.JavaScript] "layout animation done."
2015-05-06 15:45:09.847 [info][tid:com.facebook.React.JavaScript] "received image layout event
", {"target":23,"layout":{"y":12.5,"x":82,"width":50,"height":50}}
2015-05-06 15:45:09.848 [info][tid:com.facebook.React.JavaScript] "received view layout event
", {"target":22,"layout":{"y":110.5,"x":60,"width":214,"height":287.5}}
2015-05-06 15:45:09.862 [info][tid:com.facebook.React.JavaScript] "received text layout event
", {"target":27,"layout":{"y":206.5,"x":12.5,"width":120,"height":68}}
2015-05-06 15:45:09.863 [info][tid:com.facebook.React.JavaScript] "received image layout event
", {"target":23,"layout":{"y":12.5,"x":55,"width":50,"height":50}}
2015-05-06 15:45:09.863 [info][tid:com.facebook.React.JavaScript] "received view layout event
", {"target":22,"layout":{"y":128,"x":60,"width":160,"height":337.5}}
```
2015-05-07 12:27:44 -08:00
James Ide b97ce93cea [Nav] Add support for bar button icons and left buttons
Summary:
NavigatorIOS supports four new properties:

  - **rightButtonImageSource:** The source of an image to display in the top right. This must be a static image since UINavigationController only supports UIImages. Adding support for UIImageViews (or arbitrary views) is more complicated because custom views do not fade on touch and do not have hit slop the same way that UIImage buttons do. Usage: `rightButtonImageSource: ix('ImageName')`
  - **backButtonImageSource:** Use a custom image for the back button. This does not replace the back caret (`<`) but instead replaces the text next to it.
  - **leftButtonTitle**: Text for the left nav button, which supersedes the previous nav item's back button when specified. The main use case for this is your initial screen/UIVC which has nothing to go back to (since it is the first VC on the stack) but need to display a left button. This does hide the back button if there would have been one otherwise.
  - **leftButtonImageSource:** Image source for the left button, super
Closes https://github.com/facebook/react-native/pull/263
Github Author: James Ide <ide@jameside.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-07 08:03:21 -08:00
Nick Lockwood 47164baaec Fixed redbox error loop when camera access is disabled 2015-05-06 17:21:10 -08:00
Tadeu Zagallo 132a9170f1 [ReactNative] Create private underlying bridge to prevent retain cycles 2015-05-04 10:36:20 -08:00
Nick Lockwood eb0476074f Improved debug and fixed macros 2015-04-30 09:59:16 -08:00
Ben Alpert dd56ccb9c7 [react-native] Fix capitalization of "REact" 2015-04-27 13:52:57 -08:00
Tadeu Zagallo 136431cc2f [ReactNative] Fix struct args on exported methods 2015-04-27 04:01:37 -08:00