|
@@ -13,16 +13,20 @@ import { ScrollView } from "react-native-gesture-handler";
|
|
import Modal from 'react-native-modal';
|
|
import Modal from 'react-native-modal';
|
|
import Picker from 'react-native-picker-select';
|
|
import Picker from 'react-native-picker-select';
|
|
import { Landmark, LMPhoto, useAddLandmark } from "../../../data/landmarks";
|
|
import { Landmark, LMPhoto, useAddLandmark } from "../../../data/landmarks";
|
|
-import { colors, lmTypes } from "../../../utils/GlobalUtils";
|
|
|
|
|
|
+import { colors, lmTypes, lmTypes as lmTypess, lmTypesIndoor } from "../../../utils/GlobalUtils";
|
|
import { IconButton, SecondaryButton } from "../../Buttons";
|
|
import { IconButton, SecondaryButton } from "../../Buttons";
|
|
import { PhotoPicker } from "../../PhotoPicker";
|
|
import { PhotoPicker } from "../../PhotoPicker";
|
|
import TouchOpaq from "./LandmarkDetailsPanel/TouchOpaq";
|
|
import TouchOpaq from "./LandmarkDetailsPanel/TouchOpaq";
|
|
import { Svg, Rect, Image as ImageSVG, Circle } from 'react-native-svg'
|
|
import { Svg, Rect, Image as ImageSVG, Circle } from 'react-native-svg'
|
|
import ReactDOMServer from 'react-dom/server'; //npm i --save-dev @types/react-dom
|
|
import ReactDOMServer from 'react-dom/server'; //npm i --save-dev @types/react-dom
|
|
|
|
|
|
|
|
+
|
|
import IndoorFloor from "../IndoorFloor";
|
|
import IndoorFloor from "../IndoorFloor";
|
|
import ViewShot, { captureRef, captureScreen } from "react-native-view-shot";
|
|
import ViewShot, { captureRef, captureScreen } from "react-native-view-shot";
|
|
|
|
|
|
|
|
+import { useNavigationState } from "@react-navigation/native"
|
|
|
|
+
|
|
|
|
+
|
|
/**
|
|
/**
|
|
* Props for the {@link AddLandmarkPanel} component.
|
|
* Props for the {@link AddLandmarkPanel} component.
|
|
*/
|
|
*/
|
|
@@ -58,6 +62,15 @@ const AddLandmarkPanel: React.FC<AddLandmarkProps> = ({ newLandmark, setNewLandm
|
|
|
|
|
|
const addLandmarkMutation = useAddLandmark()
|
|
const addLandmarkMutation = useAddLandmark()
|
|
|
|
|
|
|
|
+ const navigationState = useNavigationState(state => state)
|
|
|
|
+ const [currentRoute, setCurrentRoute] = useState<string>()
|
|
|
|
+ useEffect(() => {
|
|
|
|
+ const currentRouteIndex = navigationState?.routes[0]?.state?.index
|
|
|
|
+ const currentRouteName = navigationState?.routes[0]?.state?.routeNames[currentRouteIndex]
|
|
|
|
+ setCurrentRoute(currentRouteName)
|
|
|
|
+ }, [navigationState])
|
|
|
|
+
|
|
|
|
+
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
let eventString = Platform.OS == "android" ? 'keyboardDidShow' : Platform.OS == "ios" ? 'keyboardWillShow' : null;
|
|
let eventString = Platform.OS == "android" ? 'keyboardDidShow' : Platform.OS == "ios" ? 'keyboardWillShow' : null;
|
|
if (eventString) {
|
|
if (eventString) {
|
|
@@ -100,6 +113,11 @@ const AddLandmarkPanel: React.FC<AddLandmarkProps> = ({ newLandmark, setNewLandm
|
|
const imgWidth = 346
|
|
const imgWidth = 346
|
|
const imgHeight = 448
|
|
const imgHeight = 448
|
|
const imageDim = 25
|
|
const imageDim = 25
|
|
|
|
+
|
|
|
|
+ let lmTypes = lmTypess
|
|
|
|
+ if(currentRoute=="Indoor") {
|
|
|
|
+ lmTypes = lmTypesIndoor
|
|
|
|
+ }
|
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
/**
|
|
/**
|
|
@@ -144,7 +162,6 @@ const AddLandmarkPanel: React.FC<AddLandmarkProps> = ({ newLandmark, setNewLandm
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
-
|
|
|
|
// create svg content here, then pass it to addLandmarkAsync as the value of indoorLmLocImg
|
|
// create svg content here, then pass it to addLandmarkAsync as the value of indoorLmLocImg
|
|
// if (typeof newLandmark.floor === 'number') {
|
|
// if (typeof newLandmark.floor === 'number') {
|
|
// let rectangle = serialize()
|
|
// let rectangle = serialize()
|
|
@@ -192,6 +209,9 @@ const AddLandmarkPanel: React.FC<AddLandmarkProps> = ({ newLandmark, setNewLandm
|
|
enabled={photos?.length > 0}
|
|
enabled={photos?.length > 0}
|
|
>
|
|
>
|
|
{console.log("state of keyboard is " + keyboardOpened)}
|
|
{console.log("state of keyboard is " + keyboardOpened)}
|
|
|
|
+ {/* {console.log("*THIS IS IN PANEL* navigationState is " + navigationState.index)}
|
|
|
|
+ {console.log("*THIS IS IN PANEL* currentRoute is " + currentRoute)} */}
|
|
|
|
+
|
|
<SafeAreaView style={{ backgroundColor: colors.red, height: determineModalHeight(), }}>
|
|
<SafeAreaView style={{ backgroundColor: colors.red, height: determineModalHeight(), }}>
|
|
{addLandmarkMutation.isIdle ?
|
|
{addLandmarkMutation.isIdle ?
|
|
<>
|
|
<>
|
|
@@ -253,8 +273,10 @@ const AddLandmarkPanel: React.FC<AddLandmarkProps> = ({ newLandmark, setNewLandm
|
|
)
|
|
)
|
|
})}
|
|
})}
|
|
/>
|
|
/>
|
|
|
|
+
|
|
{newLandmark?.landmark_type ? <Image style={{ marginLeft: 20 }} source={lmTypes[newLandmark.landmark_type].image} />
|
|
{newLandmark?.landmark_type ? <Image style={{ marginLeft: 20 }} source={lmTypes[newLandmark.landmark_type].image} />
|
|
: null}
|
|
: null}
|
|
|
|
+ <Text>{currentRoute=="Indoor" ? "INDOOR" : "OUTDOOR"}</Text>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
{newLandmark?.landmark_type ?
|
|
{newLandmark?.landmark_type ?
|
|
@@ -302,8 +324,8 @@ const AddLandmarkPanel: React.FC<AddLandmarkProps> = ({ newLandmark, setNewLandm
|
|
<View style={styles.container}>
|
|
<View style={styles.container}>
|
|
<Svg>
|
|
<Svg>
|
|
{console.log("x coord is " + newLandmark.longitude + " and y coord is " + newLandmark.latitude)}
|
|
{console.log("x coord is " + newLandmark.longitude + " and y coord is " + newLandmark.latitude)}
|
|
- <ImageSVG x={newLandmark.longitude * imgWidth - 3} y={newLandmark.latitude * imgHeight - 3} width={imageDim} height={imageDim} href={lmTypes[newLandmark.landmark_type]['image'] as ImageSourcePropType} />
|
|
|
|
<IndoorFloor floorNum={newLandmark.floor} />
|
|
<IndoorFloor floorNum={newLandmark.floor} />
|
|
|
|
+ <ImageSVG x={newLandmark.longitude * imgWidth - 3} y={newLandmark.latitude * imgHeight - 3} width={imageDim} height={imageDim} href={lmTypes[newLandmark.landmark_type]['image'] as ImageSourcePropType} />
|
|
</Svg>
|
|
</Svg>
|
|
</View>
|
|
</View>
|
|
}
|
|
}
|