added ui package, edited text on greeting page, using new ui package in form page

3 files changed, 34 insertions, 27 deletions

diff --git a/mobile/components/GreetingPage.js b/mobile/components/GreetingPage.js
index 9d1d410..ad1f1c1 100644
--- a/mobile/components/GreetingPage.js
+++ b/mobile/components/GreetingPage.js
@@ -55,19 +55,19 @@ export default class GreetingPage extends Component {
 
       	<View style={styles.titleContainer}>
       		<Text style={styles.title}>
-      			[Place text here!]
+      			Ensure that location services are enabled!
       		</Text>
       	</View>
 
-      	<TouchableHighlight 
-      		style={styles.first_button_container} 
+      	<TouchableHighlight
+      		style={styles.first_button_container}
       		onPress={() => { this.moveToFormPage()
           }}>
 
       		<View style={styles.press_button}>
 
       			<View>
-      			<Text style={styles.current_location_title}> 
+      			<Text style={styles.current_location_title}>
       				Use Current Location
       			</Text>
       			</View>
@@ -86,7 +86,7 @@ export default class GreetingPage extends Component {
       		<View style={styles.press_button}>
 
       			<View>
-      			<Text style={styles.current_location_title}> 
+      			<Text style={styles.current_location_title}>
       				Drop Pin
       			</Text>
       			</View>
@@ -122,7 +122,8 @@ const styles = StyleSheet.create( {
   	marginTop: 10,
   	textAlign: 'center',
   	opacity: 0.9,
-  	fontSize: 30
+  	fontSize: 18,
+    fontStyle: 'italic'
   },
   current_location_title: {
   	color: '#FFF',
diff --git a/mobile/package.json b/mobile/package.json
index 0c3b6c2..488e885 100644
--- a/mobile/package.json
+++ b/mobile/package.json
@@ -15,6 +15,7 @@
     "expo": "^32.0.0",
     "react": "16.5.0",
     "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
+    "react-native-elements": "^1.1.0",
     "react-navigation": "^3.0.9"
   },
   "devDependencies": {
diff --git a/mobile/screens/Form1.js b/mobile/screens/Form1.js
index 963bde2..16ced64 100644
--- a/mobile/screens/Form1.js
+++ b/mobile/screens/Form1.js
@@ -1,12 +1,12 @@
 import React, { Component } from 'react';
-import {Text, Alert, AppRegistry, Button, StyleSheet, View, TextInput } from 'react-native';
+import {Text, Alert, AppRegistry, StyleSheet, View } from 'react-native';
+import { Button, Input, CheckBox } from 'react-native-elements';
 
 export default class Form1 extends Component {
   _onPressButton1() {
     const { navigation } = this.props;
     const coordinates = navigation.getParam('coordinates');
     //var coordinates = this.coordinates ? coordinates : [];
-    Alert.alert("Thank you for your response.");
     fetch('https://helpthehome-qa.herokuapp.com/mobilerequest', {
       method: 'POST',
       headers: {
@@ -15,13 +15,18 @@ export default class Form1 extends Component {
       },
       body: JSON.stringify({
         'coordinates': coordinates,
-		    'type': "Point",
-		    'isInjured': this.state.injured,
-		    'reasonForHelp': this.state.why,
-		    'ageRange': this.state.age,
+        'type': "Point",
+        'isInjured': this.state.injured,
+        'reasonForHelp': this.state.why,
+        'ageRange': this.state.age,
         'clothingDescription': this.state.appearance
     }),
   });
+  // TODO: handle the response from the serve and decide what to display
+  // based on that
+  // for now just to back to the home page
+  Alert.alert("You will now be redirected to the main page");
+  this.props.navigation.navigate('GreetingPage');
 }
   _onPressButton2() {
     Alert.alert('Continue:')
@@ -31,7 +36,7 @@ export default class Form1 extends Component {
       this.state = {
         age: '',
         appearance: '',
-		    injured: false,
+        injured: false,
         why: ''
       };
   }
@@ -40,37 +45,37 @@ export default class Form1 extends Component {
     return (
       <View style={{padding: 40}}>
         <Text>Age:</Text>
-          <TextInput
+          <Input
             style={{height: 40}}
-            placeholder="(Estimate if unknown)"
-            onChangeText={(text) => this.setState({age:text})}
+            placeholder="Estimate is fine"
+            onChangeText={(age) => this.setState({age})}
           />
         <Text>Appearance:</Text>
-          <TextInput
+          <Input
             style={{height: 40}}
-            placeholder="What are they wearing"
+            placeholder="What are they wearing?"
             onChangeText={(appearance) => this.setState({appearance})}
           />
-        <Text>Are they injured?</Text>
-          <TextInput
-            style={{height: 40}}
-            placeholder="If so, please explain the injury"
-            onChangeText={(injured) => this.setState({injured})}
+        <CheckBox
+            center
+            title="Are they injured?"
+            checked={this.state.injured}
+            onPress={() => this.setState({ injured: !this.state.injured })}
           />
         <Text>Reason for help?</Text>
-            <TextInput
+            <Input
               style={{height: 40}}
-              placeholder="Why does the individual require assistance"
+              placeholder="Please keep it short"
               onChangeText={(why) => this.setState({why})}
             />
         <View style={{padding: 40}}>
           <Button
+              buttonStyle={{backgroundColor:"green"}}
               onPress={() => this._onPressButton1()}
               title="Submit!"
           />
-        </View>
-        <View style={{padding: 40}}>
           <Button
+              containerStyle={{paddingTop: 10}}
               onPress={() =>  this.props.navigation.navigate('GreetingPage')}
               title="Go Back"
           />