diff --git a/public/index.html b/public/index.html
index aa069f2..f2c9ee8 100644
--- a/public/index.html
+++ b/public/index.html
@@ -7,7 +7,7 @@
- React App
+ GeoAnnotator
diff --git a/public/manifest.json b/public/manifest.json
index 080d6c7..f5d2679 100644
--- a/public/manifest.json
+++ b/public/manifest.json
@@ -1,6 +1,6 @@
{
- "short_name": "React App",
- "name": "Create React App Sample",
+ "short_name": "GeoAnnotator",
+ "name": "Annotate data with GeoAnnotator",
"icons": [
{
"src": "favicon.ico",
diff --git a/src/components/Geolocation/Dialogs/EditDialog.js b/src/components/Geolocation/Dialogs/LocationDialog.js
similarity index 83%
rename from src/components/Geolocation/Dialogs/EditDialog.js
rename to src/components/Geolocation/Dialogs/LocationDialog.js
index 2ca0a76..d4ba288 100644
--- a/src/components/Geolocation/Dialogs/EditDialog.js
+++ b/src/components/Geolocation/Dialogs/LocationDialog.js
@@ -13,7 +13,7 @@ import { TextField, MenuItem, Select, FormControl, InputLabel, Box, Typography,
* @param {{ open: Boolean, onClose: Function }} param.dialogProps
* @returns {React.JSX.Element}
*/
-export default function EditDialog({ geolocations, geolocation, dialogProps }) {
+export default function LocationDialog({ geolocations, geolocation, dialogProps }) {
const
{ sessionData, setSessionData } = useSession(),
[location, setLocation] = useState(0),
@@ -41,7 +41,7 @@ export default function EditDialog({ geolocations, geolocation, dialogProps }) {
return (
@@ -67,10 +67,10 @@ export default function EditDialog({ geolocations, geolocation, dialogProps }) {
{/* Position */}
- Position
+ Position
)
diff --git a/src/components/Geolocation/GeolocationFunctions.js b/src/components/Geolocation/GeolocationFunctions.js
index 37d20e2..e382c8d 100644
--- a/src/components/Geolocation/GeolocationFunctions.js
+++ b/src/components/Geolocation/GeolocationFunctions.js
@@ -13,7 +13,7 @@ import {
Place,
MenuRounded
} from '@mui/icons-material';
-import EditDialog from './Dialogs/EditDialog';
+import LocationDialog from './Dialogs/LocationDialog'
/**
* Location list: Geolocation entries
@@ -99,10 +99,11 @@ export function GeolocationItems({ data, disableSaveChangesButton }) {
))
}
- disableSaveChangesButton(false)
diff --git a/src/components/Mapping/DialogMapping.js b/src/components/Mapping/DialogMapping.js
index 4a3c42a..79e40cd 100644
--- a/src/components/Mapping/DialogMapping.js
+++ b/src/components/Mapping/DialogMapping.js
@@ -17,7 +17,7 @@ import {
* @param {{ name: string, position: float[] }[]} param.geolocations
* @param {Function} param.markerClickHandler
*/
-export default function DialogMapping({ geolocations, markerClickHandler }) {
+export default function DialogMapping({ geolocations, markerDblClickHandler }) {
return (
{
- geolocations ? geolocations?.map((marker, index) => (
- undefined
- }}
- >
-
- {marker.name}
-
- {`(${marker.position})`}
-
-
- )) : null
+ geolocations ? geolocations?.map((marker, index) => {
+ if(
+ marker.name === undefined ||
+ marker.position === undefined ||
+ marker.position.length === 0
+ ) return null;
+ return (
+ undefined
+ }}
+ >
+
+ {marker.name}
+
+ {`(${marker.position})`}
+
+
+ )
+ }) : null
}
diff --git a/src/components/Mapping/MappingFunctions.js b/src/components/Mapping/MappingFunctions.js
index 0b6ca50..1d008c6 100644
--- a/src/components/Mapping/MappingFunctions.js
+++ b/src/components/Mapping/MappingFunctions.js
@@ -15,7 +15,7 @@ export const FocusOnLatest = ({ markers }) => {
useEffect(() => {
if (markers && markers.length > 0) {
const lastMarker = markers[markers.length - 1]; // Get the last marker
- map.setView(lastMarker.position, 8); // Set view to the last marker
+ if(lastMarker.position.length) map.setView(lastMarker.position, 8); // Set view to the last marker
}
}, [markers, map]); // Effect depends on markers changing
diff --git a/src/components/TextContent/TextContent.css b/src/components/TextContent/TextContent.css
index 47587cc..3cc735f 100644
--- a/src/components/TextContent/TextContent.css
+++ b/src/components/TextContent/TextContent.css
@@ -8,4 +8,19 @@
.TextItem::selection {
background-color: transparent;
+}
+
+.TextItem[ishighlighted='true'].Selected {
+ background-color: defaultColor;
+}
+
+.TextItem[ishighlighted='true'].Selecting {
+ background-color: defaultColor;
+}
+
+.grid-container-textcontent-buttons {
+ display: flex;
+ flex-wrap: nowrap;
+ flex-direction: row;
+ justify-content: space-between;
}
\ No newline at end of file
diff --git a/src/components/TextContent/TextContent.js b/src/components/TextContent/TextContent.js
index 1bff796..e369613 100644
--- a/src/components/TextContent/TextContent.js
+++ b/src/components/TextContent/TextContent.js
@@ -1,25 +1,27 @@
import './TextContent.css'
-import { Box } from "@mui/material"
+import { Box, Button, Grid } from "@mui/material"
+import { pipe } from '../../utils/utilFunctions'
+import { SaveButton } from '../customComponents'
import { useEffect, useRef, useState } from "react"
import { SelectableGroup } from "react-selectable-fast"
import { highlightDetectedLocations } from "./TextContentFunctions"
-import { SaveButton } from '../customComponents'
-import { pipe } from '../../utils/utilFunctions'
+import LocationDialog from '../Geolocation/Dialogs/LocationDialog'
export function TextContent({ textContent, geolocations }) {
const
// eslint-disable-next-line no-unused-vars
+ refSelectableGroup = useRef(null),
+ [open, setOpen] = useState(false),
[selectedItems, setSelectedItems] = useState([]),
[disableButton, setDisableButton] = useState(true),
- refSelectableGroup = useRef(null),
- /* HandleFunctions */
+ [geolocation, setGeolocation] = useState({ name: undefined, position: [] }),
handleSelectionFinish = (selectedItems) => {
let processOutput = pipe(
items => items.filter(item => !item.props.props.isHighlighted),
items => items.map(item => item.props.props.text)
), output = processOutput(selectedItems);
setSelectedItems(output);
- setDisableButton(false);
+ setDisableButton(output.length === 0);
};
// When another file is loaded, clear the selected items
@@ -50,23 +52,54 @@ export function TextContent({ textContent, geolocations }) {
>
{highlightDetectedLocations(textContent, geolocations)}
- {/* Add location button */}
- console.log(selectedItems)}
- >
- Add new Location
-
+
+
+ {/* Clear selection button */}
+
+
+
+
+ {/* Add location button */}
+
+ {
+ setGeolocation({...geolocation, name: selectedItems.join(' ')});
+ setOpen(true);
+ }}
+ >
+ Add new location
+
+
+
+
+
+
)
}
\ No newline at end of file
diff --git a/src/components/customComponents.js b/src/components/customComponents.js
index 27a09aa..5bf7636 100644
--- a/src/components/customComponents.js
+++ b/src/components/customComponents.js
@@ -48,6 +48,7 @@ export const SelectableTextItem = createSelectable(({ selectableRef, isSelected,
marginX={0.25}
component={'p'}
children={props.text}
+ ishighlighted={`${props.isHighlighted}`}
sx={props.isHighlighted ? {backgroundColor: '#2587be', color: 'white', padding: 0.1, borderRadius: 1} : null}
className={`TextItem ${isSelected ? 'Selected' : isSelecting ? 'Selecting' : ''}`}
/>