diff --git a/app/components/app.js b/app/components/app.js new file mode 100644 index 0000000..6e1b43b --- /dev/null +++ b/app/components/app.js @@ -0,0 +1,33 @@ +import React from 'react-native'; + +import RouteMaster from './routes/RouteMaster'; + +const { + Navigator, +} = React; + +export default class extends React.Component { + renderScene(route, nav) { + const props = route.props || {}; + return ; + } + + componentDidMount() { + this.initialRoute = RouteMaster.get('LOGIN'); + } + + render() { + return ( + { + if (route.sceneConfig) { + return route.sceneConfig; + } + return Navigator.SceneConfigs.PushFromRight; + }} + /> + ); + } +}; diff --git a/app/components/routes/RouteMaster.js b/app/components/routes/RouteMaster.js new file mode 100644 index 0000000..b372264 --- /dev/null +++ b/app/components/routes/RouteMaster.js @@ -0,0 +1,10 @@ +import { Map } from 'immutable'; + +import Login from './login'; + +export default Map({ + 'LOGIN': { + id: 'login', + component: Login + } +}); diff --git a/app/components/routes/login.js b/app/components/routes/login.js new file mode 100644 index 0000000..f39cf98 --- /dev/null +++ b/app/components/routes/login.js @@ -0,0 +1,86 @@ +import React from 'react-native'; +import Immutable from 'immutable'; + +import GlobalStyles from '../../settings/styles'; + +const { + StyleSheet, + Text, + View, + TextInput, + TouchableHighlight, + ScrollView, + BackAndroid +} = React; + +const styles = StyleSheet.create({ + container: { + flex: .5, + flexWrap: 'nowrap', + justifyContent: 'center', + alignItems: 'center', + backgroundColor: '#F5FCFF', + }, + input: { + height: 50, + width: 300, + borderColor: 'gray', + borderWidth: 1 + }, + loginButton: { + backgroundColor: GlobalStyles.get('CIRCLE_BLUE'), + margin: 10, + justifyContent: 'center', + alignItems: 'center', + padding: 10 + }, + loginButtonText: { + fontSize: 16, + color: 'white', + }, + title: { + fontSize: 25, + margin: 13 + } +}); + +export default class Login extends React.Component { + constructor() { + super(); + this.state = Immutable.Map({ + password: '', + }); + } + + validate() { + + } + + componentWillMount() { + BackAndroid.addEventListener('hardwareBackPress', () => { return true; }); // Disable back button + } + + render() { + return ( + + + + Login to continue + + this.state.set('password', password)} + value={this.state.get('password')} + onSubmitEditing={this.validate} + placeholder="Password" + /> + + + Authenticate + + + + + ); + } +}; diff --git a/app/settings/constants.js b/app/settings/constants.js new file mode 100644 index 0000000..73ed28d --- /dev/null +++ b/app/settings/constants.js @@ -0,0 +1,8 @@ +import { Map } from 'immutable'; + +export default Map({ + PROJECT_DATA: { + repository: 'https://github.com/RealOrangeOne/Sphere', + CI_Badge: 'https://circleci.com/gh/RealOrangeOne/Sphere.svg?style=svg' + } +}); diff --git a/app/settings/styles.js b/app/settings/styles.js new file mode 100644 index 0000000..194bfe7 --- /dev/null +++ b/app/settings/styles.js @@ -0,0 +1,5 @@ +import { Map } from 'immutable'; + +export default Map({ + CIRCLE_BLUE: 'blue' +}); diff --git a/index.android.js b/index.android.js index 729bb5b..b5dce88 100644 --- a/index.android.js +++ b/index.android.js @@ -1,51 +1,18 @@ -/** - * Sample React Native App - * https://github.com/facebook/react-native - */ -'use strict'; -import React, { - AppRegistry, - Component, - StyleSheet, - Text, - View -} from 'react-native'; +import React from 'react-native'; +import App from './app/components/app.js'; -class Sphere extends Component { +const { + AppRegistry, +} = React; + + +class Sphere extends React.Component { render() { return ( - - - Welcome to React Native! - - - To get started, edit index.android.js - - - Shake or press menu button for dev menu - - + ); } } -const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'center', - backgroundColor: '#F5FCFF', - }, - welcome: { - fontSize: 20, - textAlign: 'center', - margin: 10, - }, - instructions: { - textAlign: 'center', - color: '#333333', - marginBottom: 5, - }, -}); AppRegistry.registerComponent('Sphere', () => Sphere); diff --git a/index.ios.js b/index.ios.js index 57d2bfc..b5dce88 100644 --- a/index.ios.js +++ b/index.ios.js @@ -1,52 +1,18 @@ -/** - * Sample React Native App - * https://github.com/facebook/react-native - */ -'use strict'; -import React, { - AppRegistry, - Component, - StyleSheet, - Text, - View -} from 'react-native'; +import React from 'react-native'; +import App from './app/components/app.js'; -class Sphere extends Component { +const { + AppRegistry, +} = React; + + +class Sphere extends React.Component { render() { return ( - - - Welcome to React Native! - - - To get started, edit index.ios.js - - - Press Cmd+R to reload,{'\n'} - Cmd+D or shake for dev menu - - + ); } } -const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'center', - backgroundColor: '#F5FCFF', - }, - welcome: { - fontSize: 20, - textAlign: 'center', - margin: 10, - }, - instructions: { - textAlign: 'center', - color: '#333333', - marginBottom: 5, - }, -}); AppRegistry.registerComponent('Sphere', () => Sphere); diff --git a/scripts/bundle b/scripts/bundle old mode 100644 new mode 100755 diff --git a/scripts/emulator b/scripts/emulator old mode 100644 new mode 100755