merged dev into global-alerts

src/components/Map/MainMapComponent/OutdoorMap.tsx

@@ -10,6 +10,7 @@ import { RouteProp, useNavigationState } from "@react-navigation/native";
 import { booleanPointInPolygon, circle } from '@turf/turf';
 import * as Notifications from 'expo-notifications';
 import { observer } from "mobx-react";
+<<<<<<< HEAD
 import React, { useEffect, useState } from "react";
 import { ActivityIndicator, Image, Keyboard, Modal, Text, TouchableOpacity, TouchableWithoutFeedback, View } from "react-native";
 import MapView, { LatLng, Marker, Polygon } from "react-native-maps";
@@ -17,6 +18,13 @@ import { ToggleButton } from "react-native-paper";
 import { openSettings } from "react-native-permissions";
 import Spokestack, { activate } from 'react-native-spokestack';
 import { useAuth } from "../../../data/Auth/AuthContext";
+=======
+import React, { useEffect, useRef, useState } from "react";
+import { AppState, Image, Keyboard, Modal, Platform, TouchableOpacity, TouchableWithoutFeedback, Text, View, ActivityIndicator, Alert } from "react-native";
+import MapView, { LatLng, Marker, Polygon, Region, Polyline } from "react-native-maps";
+import { PERMISSIONS } from "react-native-permissions";
+import Spokestack from 'react-native-spokestack';
+>>>>>>> global-alerts
 import { Landmark } from '../../../data/landmarks';
 import { NotifType } from "../../../data/notifications";
 import { usePermissions } from "../../../data/PermissionsContext";
@@ -78,6 +86,7 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
         { latitude: 53.527086340019856, longitude: -113.52358410971608, }, // Cameron library
         { latitude: 53.52516024715472, longitude: -113.52154139033108, }, // University station
     ]);
+    const [size, setSize] = useState(0.052344);
 
     /**
      * If the ReactNavigation route prop changes, check if it contains incoming selected landmarks, display them if there are. This will be triggered by incoming notifcations 
@@ -114,7 +123,6 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
             mapState.mapRef.current.animateToRegion({ latitude: landmark.latitude, longitude: landmark.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 })
             props.toggleLmDetails(true)
         }
-
     }, [props.selectedLandmarkId])
 
     /**
@@ -125,6 +133,97 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
             mapState.mapRef.current.animateToRegion({ latitude: props.newLandmark?.latitude, longitude: props.newLandmark?.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 })
         }
     }, [props.newLandmark])
+<<<<<<< HEAD
+=======
+
+
+    /**
+     * Gets speech permissions from user, runs every time app is brought to foreground
+     */
+    useEffect(() => {
+        const getSpeechPermissions = async () => {
+            if (AppState.currentState == 'active') {
+                await getMapPermissions()
+                console.log('[Permissions]: Checking voice permissions...')
+                if (Platform.OS == 'android') {
+                    const permitted = await checkVoicePermissions([PERMISSIONS.ANDROID.RECORD_AUDIO])
+                    mapState.toggleVoicePermission(permitted)
+                    if (permitted) console.log('[Permissions]: Voice permission granted')
+                    else console.log('[Permissions]: Voice permission denied')
+                }
+                else if (Platform.OS == 'ios') {
+                    const permitted = await checkVoicePermissions([PERMISSIONS.IOS.SPEECH_RECOGNITION, PERMISSIONS.IOS.MICROPHONE])
+                    mapState.toggleVoicePermission(permitted)
+                    if (permitted) console.log('[Permissions]: Voice permission granted')
+                    else console.log('[Permissions]: Voice permission denied')
+                }
+            }
+        }
+        getSpeechPermissions()
+    }, [AppState.currentState])
+
+    /**
+     * Gets foreground location permissions from user, runs every time app is brought to foreground
+     */
+    useEffect(() => {
+        const checkForegroundLocationPermissions = async () => {
+            if (AppState.currentState == 'active') {
+                console.log('[Permissions]: Checking location permissions...')
+                if (Platform.OS == 'android') {
+                    const permitted = await checkVoicePermissions([PERMISSIONS.ANDROID.ACCESS_COARSE_LOCATION, PERMISSIONS.ANDROID.ACCESS_FINE_LOCATION])
+                    mapState.toggleFgroundLocationPermission(permitted)
+                    if (permitted) console.log('[Permissions]: Location permission granted')
+                    else console.log('[Permissions]: Location permission denied')
+                }
+                else if (Platform.OS == 'ios') {
+                    const permitted = await checkVoicePermissions([PERMISSIONS.IOS.LOCATION_WHEN_IN_USE])
+                    mapState.toggleFgroundLocationPermission(permitted)
+                    if (permitted) console.log('[Permissions]: Location permission granted')
+                    else console.log('[Permissions]: Location permission denied')
+                }
+            }
+        }
+        checkForegroundLocationPermissions();
+    }, [AppState.currentState])
+
+    /**
+     * Gets background location permissions from user, runs every time app is brought to foreground
+     */
+    useEffect(() => {
+        const checkBackgroundLocationPermissions = async () => {
+            if (AppState.currentState == 'active') {
+                if (Platform.OS == 'android') {
+                    const permitted = await checkVoicePermissions([PERMISSIONS.ANDROID.ACCESS_BACKGROUND_LOCATION])
+                    mapState.toggleBgroundLocationPermission(permitted)
+                    if (permitted) console.log('[Permissions]: Background location permission granted')
+                    else console.log('[Permissions]: Background location permission denied')
+                }
+                else if (Platform.OS == 'ios') {
+                    const permitted = await checkVoicePermissions([PERMISSIONS.IOS.LOCATION_ALWAYS])
+                    mapState.toggleBgroundLocationPermission(permitted)
+                    if (permitted) console.log('[Permissions]: Background location permission granted')
+                    else console.log('[Permissions]: Background location permission denied')
+                }
+            }
+        }
+        checkBackgroundLocationPermissions();
+    }, [AppState.currentState])
+
+    /**
+     * Gets net location permission the existing location permission states. It will check foreground and background permissions and AppState, 
+     * then from that it will decide if location-enabled features should be activated (through the mapState state values).
+     */
+    useEffect(() => {
+        const updateLocationPermissionOnAppStateChange = async () => {
+            const netLocationPermissions = mapState.bgroundLocationPermission || (mapState.fgroundLocationPermission && AppState.currentState == 'active')
+            console.log('[Permissions]: Appstate, or location permissions changed, net location permissions found to be: ' + netLocationPermissions)
+            mapState.toggleLocationPermitted(netLocationPermissions)
+        }
+        updateLocationPermissionOnAppStateChange()
+    }, [AppState.currentState, mapState.bgroundLocationPermission, mapState.fgroundLocationPermission])
+
+
+>>>>>>> global-alerts
     /**
      * Animates the map to fly over to and focus on the user's location.
      */
@@ -242,14 +341,20 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
                     showsUserLocation={locationPermissionsGranted}
                     onUserLocationChange={e => updateLocation(e.nativeEvent.coordinate)}
                     followsUserLocation={mapState.followUser}
-                    showsMyLocationButton={false}>
+                    showsMyLocationButton={false}
+                    
+                    onRegionChangeComplete={(Region) => {
+                        console.log("size is " + size)
+                        console.log(Region.latitudeDelta)
+                        setSize(Region.latitudeDelta) 
+                      }}
+                    >
                     <Polygon // polygon for cameron library
                         coordinates={[
                             { latitude: 53.527190, longitude: -113.524205 },
                             { latitude: 53.526510, longitude: -113.524205 },
                             { latitude: 53.526510, longitude: -113.523452 },
                             { latitude: 53.527190, longitude: -113.523452 },
-                            // { name: "5", latitude: 60, longitude: -105 },
                         ]}
                         fillColor={`rgba(100,100,200,0.3)`}
                         strokeWidth={2.5}
@@ -275,15 +380,74 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
                     }
                     )}
 
-
+                    <Polyline
+                        coordinates={[
+                            {
+                                latitude: 53.527192,
+                                longitude: -113.523583, //Cameron
+                            },
+                            {
+                                latitude: 53.527189,
+                                longitude: -113.5233285,
+                            },
+                            {
+                                latitude: 53.526942,
+                                longitude: -113.523338,
+                            },
+                            {
+                                latitude: 53.526934,
+                                longitude: -113.523263,
+                            },
+                            {
+                                latitude: 53.5264874,
+                                longitude: -113.5232654,
+                            },
+                            {
+                                latitude: 53.526492,
+                                longitude: -113.522827,
+                            },
+                            {
+                                latitude: 53.52620959999999,
+                                longitude: -113.5228282,
+                            },
+                            {
+                                latitude: 53.5259882,
+                                longitude: -113.5222835,
+                            },
+                            {
+                                latitude: 53.5254566,
+                                longitude: -113.5222824,
+                            },
+                            {
+                                latitude: 53.525456,
+                                longitude: -113.522155,
+                            },
+                            {
+                                latitude: 53.5251288,
+                                longitude: -113.5216083, // University station
+                            },
+                        ]}
+                        strokeColor="black"
+                        strokeWidth={3}
+                        onPress={() => Alert.alert("This is a route from University Station to Cameron Library")}
+                        tappable={true}
+                    >
+                    </Polyline>
                     {/* <MapViewDirections
                         origin={coordinates[0]}
                         destination={coordinates[1]}
-                        apikey={"AIzaSyBpckHhiuieLglacinLqewC_HfWkLehwWI"} // insert your API Key here
+                        apikey={"xxxxxxxxxxxxxxx"} // insert your API Key here
                         strokeWidth={4}
                         strokeColor="#111111"
-                    />
-                    <Marker coordinate={coordinates[1]} pinColor={colors.red} /> */}
+                        mode="WALKING"
+                    /> */}
+                    <Marker coordinate={coordinates[1]} pinColor={colors.red}/>
+
+                    <Marker coordinate={{  latitude: 53.527189,longitude: -113.5233285, }} pinColor={colors.red}>
+                        {/* <Image source={require('../../../../assets/accessibleEntrance.png')} /> */}
+                        <Text style={{ fontSize: size>0.00327 ? 0 : 0.05/size , maxWidth:200, }}>Route from University Station to Cameron Library</Text>
+                    </Marker>
+
 
 
 

src/navigation/MapNavigator.tsx

@@ -215,6 +215,7 @@ const MapNavigator: React.FC = ({ }) => {
                 <View style={{ top: 60, right: 20, position: 'absolute', }}>
                     <Menu
                         visible={visible}
+                                                                                                        // either "bars" or "list"  
                         anchor={<IconButton size={20} color={colors.red} style={[mapStyles.filterButtonOutdoor]} icon="bars" onPress={() => setVisible(true)} />}
                         onRequestClose={() => setVisible(false)}
                     >
@@ -233,7 +234,6 @@ const MapNavigator: React.FC = ({ }) => {
 
                     </Menu>
 
-                    {/* either "bars" or "list"  */}
                 </View>
             }
 

src/utils/RequestUtils.ts

@@ -11,8 +11,14 @@
 //export const API_URL = 'http://192.168.3.81:8000'
 // export const API_URL = 'https://staging.clicknpush.ca'
 
+<<<<<<< HEAD
 //export const API_URL = 'http://192.168.1.68:8000'   // Chase
 //export const API_URL = 'http://192.168.0.22:8000'       // Eric
 export const API_URL = 'https://app.clicknpush.ca'
+=======
+// export const API_URL = 'http://192.168.3.102:8000'   // Chase
+export const API_URL = 'http://192.168.0.22:8000'       // Eric
+//export const API_URL = 'https://app.clicknpush.ca'
+>>>>>>> global-alerts
 
 // export const API_URL = Config.API_URL