Hide navbar

app/components/navigation/NavigationBar.js

@@ -0,0 +1,14 @@
+import { Navigator } from 'react-native';
+import _ from 'underscore';
+
+export default class NavigationBar extends Navigator.NavigationBar {
+  render () {
+    const routes = this.props.navState.routeStack;
+
+    if (routes.length && _.last(routes).hideNavbar) {
+      return null;
+    }
+
+    return super.render();
+  }
+}

app/components/routes/RouteMaster.js

@@ -8,7 +8,8 @@ import ProjectDetails from './project-details';
 export default Map({
   'LOGIN': {
     id: 'login',
-    component: Login
+    component: Login,
+    hideNavbar: true
   },
   'INFO': {
     id: 'info',

app/index.js

@@ -6,13 +6,13 @@ import GlobalStyles from './settings/styles';
 import BusyIndicator from 'react-native-busy-indicator';
 import token from './api/token';
 import { checkToken } from './api/CircleCI';
+import NavigationBar from './components/navigation/NavigationBar';
 
 import 'moment-duration-format';
 
 const {
   Navigator,
   StyleSheet,
-  Platform,
   View,
   Alert
 } = React;
@@ -25,7 +25,7 @@ const styles = StyleSheet.create({
   },
   container: {
     flex: 1,
-    marginTop: (Platform.OS === 'ios' ? 64 : 56)
+    marginTop: GlobalStyles.get('NAVBAR_HEIGHT')
   }
 });
 
@@ -44,8 +44,11 @@ export default class App extends React.Component {
   renderScene(route, nav) {
     const Component = route.component;
     const props = route.props || {};
+    const navbarStyles = {
+      marginTop: (route.hideNavbar ? GlobalStyles.get('BANNER_HEIGHT') : GlobalStyles.get('NAVBAR_HEIGHT'))
+    };
     return (
-      <View style={styles.container}>
+      <View style={[styles.container, navbarStyles]}>
         <Component
           nav={nav}
           currentRoute={route}
@@ -93,7 +96,7 @@ export default class App extends React.Component {
           renderScene={this.renderScene}
           initialRoute={this.state.initialRoute}
           navigationBar={
-            <Navigator.NavigationBar
+            <NavigationBar
               style={styles.navbar}
               routeMapper={RouteMapper} />
           }

app/settings/styles.js

@@ -1,3 +1,4 @@
+import { Platform } from 'react-native';
 import { Map } from 'immutable';
 
 export default Map({
@@ -17,5 +18,7 @@ export default Map({
     RETRIED: '#898989'
   }),
 
-  TITLE_FONT_SIZE: 24
+  TITLE_FONT_SIZE: 24,
+  NAVBAR_HEIGHT: (Platform.OS === 'ios' ? 64 : 56),
+  BANNER_HEIGHT: (Platform.OS === 'ios' ? 20 : 0),
 });