Fix models and add more mobile screens

design/models/clipboard/clipboard.mtl

@@ -0,0 +1,22 @@
+# Blender MTL File: 'clipboard.blend'
+# Material Count: 2
+
+newmtl board
+Ns 498.039216
+Ka 0.000000 0.000000 0.000000
+Kd 0.142866 0.055360 0.026186
+Ks 0.500000 0.500000 0.500000
+Ke 0.000000 0.000000 0.000000
+Ni 1.000000
+d 1.000000
+illum 3
+
+newmtl metal_shiny
+Ns 400.000000
+Ka 0.000000 0.000000 0.000000
+Kd 0.302552 0.302552 0.302552
+Ks 1.000000 1.000000 1.000000
+Ke 0.000000 0.000000 0.000000
+Ni 1.000000
+d 1.000000
+illum 3

design/models/hardhat/hardhat.mtl

@@ -0,0 +1,13 @@
+# Blender MTL File: 'hardhat.blend'
+# Material Count: 1
+
+newmtl mask
+Ns 94.117647
+Ka 1.000000 1.000000 1.000000
+Kd 0.800000 0.538025 0.000000
+Ks 0.588235 0.588235 0.588235
+Ke 0.000000 0.000000 0.000000
+Ni 1.000000
+d 1.000000
+illum 2
+map_Kd /Users/john/Map #3

design/models/question/question.mtl

@@ -0,0 +1,13 @@
+# Blender MTL File: 'question.blend'
+# Material Count: 1
+
+newmtl Blue
+Ns 237.254902
+Ka 1.000000 1.000000 1.000000
+Kd 0.649412 0.611712 0.000000
+Ks 0.196078 0.184390 0.009218
+Ke 0.000000 0.000000 0.000000
+Ni 1.000000
+d 1.000000
+illum 2
+map_Kd /Users/john/Map #147

mobile/src/screens/Activity.js

@@ -0,0 +1,55 @@
+import React from 'react'
+import { StyleSheet, View, TouchableOpacity, Image, ScrollView } from 'react-native'
+import backImage from './images/back.png'
+
+export class Activity extends React.Component {
+  static navigatorButtons = {
+    leftButtons: [
+      {
+        id: 'cancel',
+        title: 'Cancel',
+      }
+    ],
+    rightButtons: [
+      {
+        id: 'done',
+        title: 'Done',
+      }
+    ]
+  }
+
+  static styles = StyleSheet.create({
+    container: {
+      height: '100%',
+      width: '100%',
+      backgroundColor: '#AAAAAA',
+    },
+  })
+
+  constructor(props) {
+    super(props)
+    this.props.navigator.setOnNavigatorEvent(this._handleNavigatorEvent.bind(this))
+  }
+
+  _handleNavigatorEvent(event) {
+    switch (event.id) {
+      case 'cancel':
+      case 'done':
+        this.props.navigator.pop()
+        break
+    }
+  }
+
+  _handlePressButton() {
+    this.props.navigator.pop()
+  }
+
+  render() {
+    return (
+      <ScrollView style={Activity.styles.container}>
+        <View style={{ width: '94%', height: 300, backgroundColor: 'white', alignSelf: 'center', marginTop: '3%', shadowColor: 'gray', shadowOffset: { width: 2, height: 2 }, shadowRadius: 2, shadowOpacity: .5 }} />
+        <View style={{ width: '94%', height: 300, backgroundColor: 'white', alignSelf: 'center', marginTop: '3%', shadowColor: 'gray', shadowOffset: { width: 2, height: 2 }, shadowRadius: 2, shadowOpacity: .5 }} />
+      </ScrollView>
+    );
+  }
+}

mobile/src/screens/Admin.js

@@ -0,0 +1,93 @@
+import React from 'react'
+import { StyleSheet, View, TouchableOpacity, Image, FlatList, Text} from 'react-native'
+import backImage from './images/back.png'
+import rightArrowImage from './images/right-arrow.png'
+
+export class Admin extends React.Component {
+  static navigatorButtons = {
+    leftButtons: [
+      {
+        id: 'back',
+        icon: require('./images/back.png'),
+      }
+    ]
+  }
+
+  static data = [
+    {key: '1', type: 'work', location: 'Ossington Ave. | 0.2 mi.', state: 'open', latlng: { latitude: 43.653226, longitude: -79.383184 } },
+    {key: '2', type: 'inspection', location: 'Alexandre St. | 0.7 mi.', state: 'open', latlng: { latitude: 43.648118, longitude: 79.392636 }},
+    {key: '3', type: 'complaint', location: 'Bay St. | 0.8 mi.', state: 'open', latlng: { latitude: 43.640168, longitude: -79.409373 }},
+    {key: '4', type: 'work', location: 'Bloor St. | 1.2 mi.', state: 'open', latlng: { latitude: 43.633110, longitude: -79.415880 }},
+    {key: '5', type: 'inspection', location: 'Blue Jays Way | 2.2 mi.', state: 'open', latlng: { latitude: 43.653526, longitude: -79.361385 }},
+    {key: '6', type: 'complaint', location: 'Christie St. | 3.0 mi.', state: 'open', latlng: { latitude: 43.663870, longitude: -79.383705 }},
+    {key: '7', type: 'work', location: 'Cummer Ave. | 4.2 mi.', state: 'open', latlng: { latitude: 43.659166, longitude: -79.391350 }},
+    {key: '8', type: 'complaint', location: 'Danforth Ave. | 4.7 mi.', state: 'open', latlng: { latitude: 43.663538, longitude: -79.423212 }},
+  ]
+
+  static inspectionTypes = {
+    work: {
+      title: 'Work Order'
+    },
+    inspection: {
+      title: 'Inspection',
+    },
+    complaint: {
+      title: 'Complaint',
+    }
+  }
+
+  static styles = StyleSheet.create({
+    container: {
+      height: '100%',
+      width: '100%',
+      justifyContent: 'flex-start',
+      backgroundColor: '#FFFFFF',
+    },
+  })
+
+  constructor(props) {
+    super(props)
+    this.props.navigator.setOnNavigatorEvent(this._handleNavigatorEvent.bind(this))
+    this._handleItemSelect = this._handleItemSelect.bind(this)
+  }
+
+  _handleNavigatorEvent(event) {
+    switch (event.id) {
+      case 'back':
+        this.props.navigator.pop()
+        break
+    }
+  }
+
+  _handleItemSelect(item, index) {
+    this.props.navigator.push({
+      screen: 'app.WorkItem',
+      title: 'Work Item',
+      passProps: { item, index },
+    })
+  }
+
+  render() {
+    return (
+      <View style={Admin.styles.container}>
+      <FlatList
+        style={{ width: '100%', flexGrow: 1, paddingTop: 20, paddingBottom: 20 }}
+        data={Admin.data}
+        renderItem={({item, index}) => {
+          return (
+            <View style={{ flexDirection: 'row', height: 50 }}>
+              <Text style={{ fontSize: 8, width: 45, marginLeft: 15, alignSelf: 'center' }}>{item.state.toUpperCase()}</Text>
+              <View style={{ flexDirection: 'column', width: '75%' }}>
+                <Text style={{ fontSize: 20 }}>{Admin.inspectionTypes[item.type].title}</Text>
+                <Text style={{ fontSize: 14, color: 'gray' }}>{item.location}</Text>
+              </View>
+              <TouchableOpacity style={{ alignSelf: 'center' }} onPress={() => (this._handleItemSelect(item, index))} >
+                <Image source={rightArrowImage} style={{ width: 16, height: 16 }} />
+              </TouchableOpacity>
+            </View>
+          )
+        }} />
+      </View>
+    );
+  }
+}

mobile/src/screens/Home.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { StyleSheet, Text, TextInput, FlatList, Image, View } from 'react-native'
+import { StyleSheet, Text, TextInput, FlatList, Image, View, TouchableOpacity } from 'react-native'
 import MapView, { Marker } from 'react-native-maps'
 import { api } from '../API'
 import centerImage from './images/center.png'
@@ -7,6 +7,7 @@ import settingsImage from './images/settings.png'
 import searchImage from './images/search.png'
 import cancelImage from './images/cancel.png'
 import pinImage from './images/pin.png'
+import rightArrowImage from './images/right-arrow.png'
 
 export class Home extends React.Component {
   static navigatorButtons = {
@@ -46,10 +47,12 @@ export class Home extends React.Component {
 
   constructor(props) {
     super(props);
-    this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this))
+    this.props.navigator.setOnNavigatorEvent(this._handleNavigatorEvent.bind(this))
+    this._handleAdminButton = this._handleAdminButton.bind(this)
+    this._handleItemSelect = this._handleItemSelect.bind(this)
   }
 
-  onNavigatorEvent(event) {
+  _handleNavigatorEvent(event) {
     switch (event.id) {
       case 'logout':
         api.logout().then(() => {
@@ -78,6 +81,21 @@ export class Home extends React.Component {
     }
   }
 
+  _handleAdminButton() {
+    this.props.navigator.push({
+      screen: 'app.Admin',
+      title: 'Work Items',
+    })
+  }
+
+  _handleItemSelect(item, index) {
+    this.props.navigator.push({
+      screen: 'app.Activity',
+      title: 'Activity',
+      passProps: { item, index },
+    })
+  }
+
   render() {
     return (
       <View style={Home.styles.container}>
@@ -110,14 +128,17 @@ export class Home extends React.Component {
         <FlatList
           style={{ width: '100%', flexGrow: 1 }}
           data={Home.data}
-          renderItem={({item}) => {
+          renderItem={({item, index}) => {
             return (
               <View style={{ flexDirection: 'row', height: 50 }}>
                 <Text style={{ fontSize: 8, width: 45, marginLeft: 5, alignSelf: 'center' }}>{item.state.toUpperCase()}</Text>
-                <View style={{ flexDirection: 'column' }}>
+                <View style={{ width: '75%', flexDirection: 'column' }}>
                   <Text style={{ fontSize: 20 }}>{item.title}</Text>
                   <Text style={{ fontSize: 14, color: 'gray' }}>{item.location}</Text>
                 </View>
+                <TouchableOpacity style={{ alignSelf: 'center' }} onPress={() => (this._handleItemSelect(item, index))} >
+                  <Image source={rightArrowImage} style={{ width: 16, height: 16 }} />
+                </TouchableOpacity>
               </View>
             )
           }} />
@@ -129,9 +150,13 @@ export class Home extends React.Component {
           height: 45,
           backgroundColor: '#F4F4F4',
         }}>
-          <Image source={centerImage} style={{ height: 24, width: 24, marginLeft: 15, tintColor: 'gray' }} />
+          <TouchableOpacity onPress={this._handleMyLocation}>
+            <Image source={centerImage} style={{ height: 24, width: 24, marginLeft: 15, tintColor: 'gray' }} />
+          </TouchableOpacity>
           <Text style={{ color: 'gray', fontSize: 20, }}>Hide List</Text>
-          <Image source={settingsImage} style={{ height: 24, width: 24, marginRight: 15, tintColor: 'gray' }} />
+          <TouchableOpacity onPress={this._handleAdminButton}>
+            <Image source={settingsImage} style={{ height: 24, width: 24, marginRight: 15, tintColor: 'gray' }} />
+          </TouchableOpacity>
         </View>
       </View>
     );

mobile/src/screens/WorkItem.js

@@ -0,0 +1,61 @@
+import React from 'react'
+import { StyleSheet, View, TouchableOpacity, Image, ScrollView, Picker, Text } from 'react-native'
+
+export class WorkItem extends React.Component {
+  static navigatorButtons = {
+    leftButtons: [
+      {
+        id: 'cancel',
+        title: 'Cancel',
+      }
+    ],
+    rightButtons: [
+      {
+        id: 'done',
+        title: 'Done',
+      }
+    ]
+  }
+
+  static styles = StyleSheet.create({
+    container: {
+      height: '100%',
+      width: '100%',
+      backgroundColor: '#DDDDDD',
+    },
+  })
+
+  constructor(props) {
+    super(props)
+    this.props.navigator.setOnNavigatorEvent(this._handleNavigatorEvent.bind(this))
+  }
+
+  _handleNavigatorEvent(event) {
+    switch (event.id) {
+      case 'cancel':
+      case 'done':
+        this.props.navigator.pop()
+        break
+    }
+  }
+
+  _handlePressButton() {
+    this.props.navigator.pop()
+  }
+
+  render() {
+    return (
+      <ScrollView style={WorkItem.styles.container}>
+        <View style={{ width: '94%', backgroundColor: 'white', alignSelf: 'center', marginTop: '3%', shadowColor: 'gray', shadowOffset: { width: 2, height: 2 }, shadowRadius: 2, shadowOpacity: .5 }}>
+          <Text>Work Item</Text>
+          <Picker selectedValue={this.props.item.type}>
+            <Picker.Item label='Work Item' value='work' />
+            <Picker.Item label='Inspection' value='inspection' />
+            <Picker.Item label='Complaint' value='complaint' />
+          </Picker>
+        </View>
+        <View style={{ width: '94%', height: 300, backgroundColor: 'white', alignSelf: 'center', marginTop: '3%', shadowColor: 'gray', shadowOffset: { width: 2, height: 2 }, shadowRadius: 2, shadowOpacity: .5 }} />
+      </ScrollView>
+    );
+  }
+}

mobile/src/screens/index.js

@@ -2,11 +2,17 @@ import { Home } from './Home'
 import { Login } from './Login'
 import { Error } from './Error'
 import { Viewer } from './Viewer'
+import { Activity } from './Activity'
+import { WorkItem } from './WorkItem'
+import { Admin } from './Admin'
 import { Navigation } from 'react-native-navigation'
 
 export function registerScreens() {
   Navigation.registerComponent('app.Home', () => Home)
   Navigation.registerComponent('app.Login', () => Login)
   Navigation.registerComponent('app.Viewer', () => Viewer)
+  Navigation.registerComponent('app.Activity', () => Activity)
+  Navigation.registerComponent('app.Admin', () => Admin)
+  Navigation.registerComponent('app.WorkItem', () => WorkItem)
   Navigation.registerComponent('app.Error', () => Error)
 }