Merge pull request #538 from aksonov/revert-536-feature/react-native-24

Revert "[WIP] Get Example app working with React 0.24+ "

Author: aksonov

Example/.buckconfig

@@ -42,12 +42,6 @@
 # Ignore Website
 .*/website/.*
 
-# Ignore generators
-.*/local-cli/generator.*
-
-# Ignore BUCK generated folders
-.*\.buckd/
-
 .*/node_modules/is-my-json-valid/test/.*\.json
 .*/node_modules/iconv-lite/encodings/tables/.*\.json
 .*/node_modules/y18n/test/.*\.json
@@ -65,7 +59,6 @@
 .*/node_modules/isemail/.*\.json
 .*/node_modules/tr46/.*\.json
 
-
 [include]
 
 [libs]
@@ -93,4 +86,4 @@ suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-2]\\|1[0-9]\\|[0-9
 suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
 
 [version]
-^0.22.0
+0.22.0

Example/.flowconfig

@@ -32,9 +32,3 @@ local.properties
 #
 node_modules/
 npm-debug.log
-
-# BUCK
-buck-out/
-\.buckd/
-android/app/libs
-android/keystores/debug.keystore

Example/.gitignore

@@ -59,7 +59,7 @@ export default class Example extends React.Component {
                         <Scene key="loginModal" component={Login} title="Login"/>
                         <Scene key="loginModal2" hideNavBar={true} component={Login2} title="Login2" panHandlers={null} duration={1}/>
                     </Scene>
-                    <Scene key="tabbar" component={NavigationDrawer} panHandlers={null}>
+                    <Scene key="tabbar" component={NavigationDrawer}>
                         <Scene key="main" tabs={true} >
                             <Scene key="tab1"  title="Tab #1" icon={TabIcon} navigationBarStyle={{backgroundColor:"red"}} titleStyle={{color:"white"}}>
                                 <Scene key="tab1_1" component={TabView} title="Tab #1_1" onRight={()=>alert("Right button")} rightTitle="Right" />

Example/Example.js

@@ -9,7 +9,7 @@ import com.android.build.OutputFile
  * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
  * bundle directly from the development server. Below you can see all the possible configurations
  * and their defaults. If you decide to add a configuration block, make sure to add it before the
- * `apply from: "../../node_modules/react-native/react.gradle"` line.
+ * `apply from: "react.gradle"` line.
  *
  * project.ext.react = [
  *   // the name of the generated asset file containing your JS bundle
@@ -59,7 +59,7 @@ import com.android.build.OutputFile
  * ]
  */
 
-apply from: "../../node_modules/react-native/react.gradle"
+apply from: "react.gradle"
 
 /**
  * Set this to true to create two separate APKs instead of one:
@@ -124,10 +124,3 @@ dependencies {
     compile "com.android.support:appcompat-v7:23.0.1"
     compile "com.facebook.react:react-native:+"  // From node_modules
 }
-
-// Run this once to be able to run the application with BUCK
-// puts all compile dependencies into folder libs for BUCK to use
-task copyDownloadableDepsToLibs(type: Copy) {
-  from configurations.compile
-  into 'libs'
-}

Example/android/app/BUCK

@@ -7,7 +7,7 @@
   },
   "dependencies": {
     "react": "^0.14.7",
-    "react-native": "^0.24.0-rc5",
+    "react-native": "^0.22.2",
     "react-native-button": "^1.2.1",
     "react-native-drawer": "^1.16.7",
     "react-native-modalbox": "^1.3.0",

Example/android/app/build.gradle

@@ -9,14 +9,10 @@
 import React, {Component, Animated, PropTypes, StyleSheet, View, NavigationExperimental} from "react-native";
 const {
     AnimatedView: NavigationAnimatedView,
-    Card: NavigationCard
-} = NavigationExperimental;
-
-const {
-    CardStackPanResponder: NavigationCardStackPanResponder,
-    CardStackStyleInterpolator: NavigationCardStackStyleInterpolator
-} = NavigationCard;
-
+    Card: NavigationCard,
+    RootContainer: NavigationRootContainer,
+    Header: NavigationHeader,
+    } = NavigationExperimental;
 import TabBar from "./TabBar";
 import NavBar from "./NavBar";
 import Actions from './Actions';
@@ -63,13 +59,13 @@ export default class DefaultRenderer extends Component {
             return null;
         }
         let Component = navigationState.component;
-        if (navigationState.tabs && !Component) {
+        if (navigationState.tabs && !Component){
             Component = TabBar;
         }
         if (Component) {
             return (
                 <View style={[{flex: 1}, navigationState.sceneStyle]}>
-                    <Component {...navigationState} navigationState={navigationState}/>
+                    <Component {...navigationState} navigationState={navigationState} />
                 </View>
             )
         }
@@ -79,6 +75,7 @@ export default class DefaultRenderer extends Component {
 
         let applyAnimation = selected.applyAnimation || navigationState.applyAnimation;
         let style = selected.style || navigationState.style;
+        let direction = selected.direction || navigationState.direction || "horizontal";
 
         let optionals = {};
         if (applyAnimation) {
@@ -88,11 +85,7 @@ export default class DefaultRenderer extends Component {
             if (duration === null || duration === undefined) duration = navigationState.duration;
             if (duration !== null && duration !== undefined) {
                 optionals.applyAnimation = function (pos, navState) {
-                    if (duration === 0) {
-                        pos.setValue(navState.index);
-                    } else {
-                        Animated.timing(pos, {toValue: navState.index, duration}).start();
-                    }
+                    Animated.timing(pos, {toValue: navState.index, duration}).start();
                 };
             }
         }
@@ -102,6 +95,7 @@ export default class DefaultRenderer extends Component {
                 navigationState={navigationState}
                 style={[styles.animatedView, style]}
                 renderOverlay={this._renderHeader}
+                direction={direction}
                 renderScene={this._renderCard}
                 {...optionals}
             />
@@ -110,40 +104,25 @@ export default class DefaultRenderer extends Component {
 
     _renderHeader(/*NavigationSceneRendererProps*/ props) {
         return <NavBar
-            {...props}
-            getTitle={state => state.title}
-        />;
+                {...props}
+                getTitle={state => state.title}
+            />;
     }
 
     _renderCard(/*NavigationSceneRendererProps*/ props) {
-        const {key, direction, getSceneStyle} = props.scene.navigationState;
-        let {panHandlers, animationStyle} = props.scene.navigationState;
-
-        // Since we always need to pass a style for the direction, we can avoid #526
-        let style = {};
-        if (getSceneStyle) style = getSceneStyle(props);
+        const { key, direction, panHandlers, getSceneStyle } = props.scene.navigationState;
 
-        const isVertical = direction === "vertical";
-
-        if (typeof(animationStyle) === 'undefined') {
-            animationStyle = (isVertical ?
-                NavigationCardStackStyleInterpolator.forVertical(props) :
-                NavigationCardStackStyleInterpolator.forHorizontal(props));
-        }
-
-        if (typeof(panHandlers) === 'undefined') {
-            panHandlers = panHandlers || (isVertical ?
-                    NavigationCardStackPanResponder.forVertical(props) :
-                    NavigationCardStackPanResponder.forHorizontal(props));
-        }
+        const optionals = {};
+        if (getSceneStyle) optionals.style = getSceneStyle(props);
 
         return (
             <NavigationCard
                 {...props}
                 key={'card_' + key}
-                style={[animationStyle, style]}
+                direction={direction || 'horizontal'}
                 panHandlers={panHandlers}
                 renderScene={this._renderScene}
+                {...optionals}
             />
         );
     }
@@ -157,6 +136,6 @@ export default class DefaultRenderer extends Component {
 const styles = StyleSheet.create({
     animatedView: {
         flex: 1,
-        backgroundColor: "transparent"
+        backgroundColor:"transparent"
     },
 });