FloatFromLeft animation

Summary: float from left animation for Navigator.SceneConfigs facebook#1100 @ericvicenti @ide Closes facebook#1249 Github Author: Logan Bernard <[email protected]> @public Test Plan: Video: https://drive.google.com/file/d/0B9HtmABaCcR0Zi1yNkl5UDhWbzg/view
paulomcnally · May 13, 2015 · 2ed2d20 · 2ed2d20
1 parent 89e26e9
commit 2ed2d20
Showing 1 changed file with 40 additions and 0 deletions.
diff --git a/Libraries/CustomComponents/Navigator/NavigatorSceneConfigs.js b/Libraries/CustomComponents/Navigator/NavigatorSceneConfigs.js
@@ -101,6 +101,18 @@ var FadeToTheLeft = {
   },
 };
 
+var FadeToTheRight = {
+  ...FadeToTheLeft,
+  transformTranslate: {
+    from: {x: 0, y: 0, z: 0},
+    to: {x: Math.round(SCREEN_WIDTH * 0.3), y: 0, z: 0},
+  },
+  translateX: {
+    from: 0,
+    to: Math.round(SCREEN_WIDTH * 0.3),
+  }
+};
+
 var FadeIn = {
   opacity: {
     from: 0,
@@ -187,6 +199,27 @@ var FromTheRight = {
   },
 };
 
+var FromTheLeft = {
+  ...FromTheRight,
+  transformTranslate: {
+    from: {x: -SCREEN_WIDTH, y: 0, z: 0},
+    to: {x: 0, y: 0, z: 0},
+    min: 0,
+    max: 1,
+    type: 'linear',
+    extrapolate: true,
+    round: PixelRatio.get(),
+  },
+  translateX: {
+    from: -SCREEN_WIDTH,
+    to: 0,
+    min: 0, 
+    max: 1,
+    type: 'linear',
+    extrapolate: true,
+    round: PixelRatio.get(),
+  },
+};
 
 var ToTheBack = {
   // Rotate *requires* you to break out each individual component of
@@ -374,6 +407,13 @@ var NavigatorSceneConfigs = {
     ...BaseConfig,
     // We will want to customize this soon
   },
+  FloatFromLeft: {
+    ...BaseConfig,
+    animationInterpolators: {
+      into: buildStyleInterpolator(FromTheLeft),
+      out: buildStyleInterpolator(FadeToTheRight),
+    },
+  },
   FloatFromBottom: {
     ...BaseConfig,
     gestures: {