Skip to content

Commit

Permalink
Remove single point edit feature
Browse files Browse the repository at this point in the history 
Signed-off-by: ZhuoweiWen <[email protected]>
  • Loading branch information
@ZhuoweiWen
ZhuoweiWen committed Jul 9, 2024
1 parent 4351789 commit 159f2a5
Show file tree
Hide file tree
Showing 6 changed files with 5 additions and 185 deletions.
91 changes: 1 addition & 90 deletions front-end/components/Editmap.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,6 @@ import SmallLoadingEffect from "./SmallLoadingEffect";
import { useRouter } from "next/router";
import Swal from 'sweetalert2';
import { backend_url } from "../utils/settings";
import SelectedPointsContext from "../contexts/SelectedPointsContext";
import SelectedPolygonContext from "../contexts/SelectedPolygonContext";
import SelectedPolygonAreaContext from "../contexts/SelectedPolygonAreaContext.js";
import { useFolder } from "../contexts/FolderContext.js";
Expand Down Expand Up @@ -51,7 +50,6 @@ function Editmap() {
const selectedPolygonsRef = useRef([]);
const selectedSingleMarkersRef = useRef([]);

const { selectedPoints, setSelectedPoints } = useContext(SelectedPointsContext);
const { selectedPolygons, setSelectedPolygons } = useContext(SelectedPolygonContext);
const { selectedPolygonsArea, setSelectedPolygonsArea } = useContext(SelectedPolygonAreaContext);

Expand Down Expand Up @@ -221,7 +219,6 @@ function Editmap() {

map.current.on("draw.create", (event) => {
const polygon = event.features[0];
console.log(polygon);
// Convert drawn polygon to turf polygon
const turfPolygon = turf.polygon(polygon.geometry.coordinates);

Expand Down Expand Up @@ -272,71 +269,8 @@ function Editmap() {
content += `<p><strong>${property}:</strong> ${featureProperties[property]}</p>`;
}

const currentFeatureState = map.current.getFeatureState({
source: "custom",
sourceLayer: "data",
id: featureId,
});

if (currentFeatureState.served) {
content += '<button id="toggleServe">Change to Unserve</button>';
} else {
content += '<button id="toggleServe">Undo Change</button>';
}

popup.setHTML(content);

document.getElementById('toggleServe')?.addEventListener('click', function () {
// Toggle the 'served' property
const toggleRes = !currentFeatureState.served;
console.log(toggleRes);

// Update feature state
map.current.setFeatureState(
{
source: "custom",
sourceLayer: "data",
id: featureId,
},
{ served: toggleRes }
);

if (toggleRes) {
// Check if the point exists in selectedSingleMarkersRef
const pointExistsInMarkers = selectedSingleMarkersRef.current.some(location => location.id === featureId);

if (pointExistsInMarkers) {
// Remove the point from selectedSingleMarkersRef
selectedSingleMarkersRef.current = selectedSingleMarkersRef.current.filter(
location => location.id !== featureId
);
setSelectedPoints(selectedSingleMarkersRef.current);
} else {
// Remove the point from selectedPolygonRef
selectedPolygonsRef.current = selectedPolygonsRef.current.map(polygon => {
// Remove the point if it exists in this polygon
return polygon.filter(location => location.id !== featureId);
});
setSelectedPolygons(selectedPolygonsRef.current);
}
} else {
// Add the point to selectedSingleMarkersRef when serving
const locationInfo = {
id: featureId,
latitude: featureCoordinates[1],
longitude: featureCoordinates[0],
address: featureProperties.address,
served: toggleRes
};
selectedSingleMarkersRef.current.push(locationInfo);
setSelectedPoints(selectedSingleMarkersRef.current);
}



// Update the popup content to reflect changes
updatePopup();
});
}

// Initial popup content setup
Expand All @@ -349,30 +283,6 @@ function Editmap() {

};

useEffect(() => {
// Loop through the current ref list
selectedSingleMarkersRef.current.forEach((marker) => {
// Check if the marker is not in the selectedPoints
if (!selectedPoints.some(point => point.id === marker.id)) {
marker.served = true;
// If it's not in selectedPoints, set served back to true
map.current.setFeatureState(
{
source: "custom",
sourceLayer: "data",
id: marker.id,
},
{
served: true,
}
);
}
});

// Sync ref with the current state
selectedSingleMarkersRef.current = [...selectedPoints];

}, [selectedPoints]); // Dependency on selectedPoints

useEffect(() => {
// Loop through each polygon in selectedPolygonsRef
Expand Down Expand Up @@ -542,6 +452,7 @@ function Editmap() {
latitude: item.latitude,
longitude: item.longitude,
served: item.served,
coveredBy: item.coveredLocations
}));

setFeatureStateForMarkers(newMarkers);
Expand Down
67 changes: 1 addition & 66 deletions front-end/components/MyEdit.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@ import SelectedLocationContext from "../contexts/SelectedLocationContext";
import LocationOnIcon from '@mui/icons-material/LocationOn';
import { backend_url } from "../utils/settings";
import UndoIcon from '@mui/icons-material/Undo';
import SelectedPointsContext from "../contexts/SelectedPointsContext";
import SelectedPolygonContext from "../contexts/SelectedPolygonContext";
import SelectedPolygonAreaContext from "../contexts/SelectedPolygonAreaContext.js";
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
Expand Down Expand Up @@ -66,7 +65,6 @@ const MyEdit = () => {
const loadingTimeInMs = 3.5 * 60 * 1000;

const { setLocation } = useContext(SelectedLocationContext);
const { selectedPoints, setSelectedPoints } = useContext(SelectedPointsContext);
const { selectedPolygons, setSelectedPolygons } = useContext(SelectedPolygonContext);
const { selectedPolygonsArea, setSelectedPolygonsArea } = useContext(SelectedPolygonAreaContext);

Expand All @@ -86,12 +84,6 @@ const MyEdit = () => {
}
}

const handleUndoSingleEdit = (index) => {
// Create a new array without the item at the given index
const updatedPoints = [...selectedPoints];
updatedPoints.splice(index, 1);
setSelectedPoints(updatedPoints);
};

const handleUndoPolygonEdit = (index) => {
const updatedPolygons = [...selectedPolygons];
Expand Down Expand Up @@ -144,14 +136,9 @@ const MyEdit = () => {
polygon.slice(1) // Skip the first element (timestamp) and take the rest (points)
);

// Merge points from selectedPoints and polygonPoints
const combinedPoints = [...selectedPoints, ...polygonPoints].map((point) => ({
id: point.id,
served: point.served,
}));

const requestBody = {
marker: combinedPoints,
marker: polygonPoints,
polygonfeatures: selectedPolygonsArea,
folderid: folderID
};
Expand Down Expand Up @@ -224,11 +211,6 @@ const MyEdit = () => {
handleLocateOnMap={handleLocateOnMap}
handleUndoSinglePointWithinPolygon={handleUndoSinglePointWithinPolygon}
/>
<FileTable
files={selectedPoints}
handleUndoSingleEdit={handleUndoSingleEdit}
handleLocateOnMap={handleLocateOnMap}
/>
</StyledContainer>
<div style={{ marginTop: '20px', marginLeft: '20px' }}>
<Button
Expand All @@ -245,53 +227,6 @@ const MyEdit = () => {
};


const FileTable = ({ files, handleUndoSingleEdit, handleLocateOnMap }) => {

return (
<div>
<Typography variant="h6" sx={{ margin: "20px 0" }}>
Single Point Edits
</Typography>
<TableContainer component={Paper} sx={{ marginBottom: "20px", maxHeight: "80vh", overflow: "auto" }}>
<StyledTable aria-label="single point table">
<TableHead>
<TableRow>
<TableCell>Location ID</TableCell>
<TableCell>Address</TableCell>
<TableCell></TableCell>
<TableCell align='right'></TableCell>
</TableRow>
</TableHead>
<TableBody>
{files.map((file, index) => (
<TableRow key={index}>
<TableCell>{file.id}</TableCell>
<TableCell>{file.address}</TableCell>
<TableCell>
<IconButton
onClick={() => handleLocateOnMap(file)}
>
<LocationOnIcon />

</IconButton>
</TableCell>
<TableCell align="right">
<StyledIconButton
onClick={() => handleUndoSingleEdit(index)}
>
<UndoIcon />
</StyledIconButton>
</TableCell>
</TableRow>
))}
</TableBody>
</StyledTable>
</TableContainer>
</div>
);
};


const PolygonEditTable = ({ polygons, handleUndoPolygonEdit, handleLocateOnMap, handleUndoSinglePointWithinPolygon }) => {
const [expandedPolygon, setExpandedPolygon] = useState(null);

Expand Down
3 changes: 3 additions & 0 deletions front-end/components/Searchbar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,9 @@ function Searchbar() {
);

const handleSearchChange = async (nextValue) => {
if (folderID === -1) {
return;
}
setSearchInput(nextValue);

if (nextValue !== "") {
Expand Down
9 changes: 0 additions & 9 deletions front-end/contexts/SelectedPointsContext.js
View file

This file was deleted.

17 changes: 0 additions & 17 deletions front-end/contexts/SelectedPointsProvider.js
View file

This file was deleted.

3 changes: 0 additions & 3 deletions front-end/pages/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import LayerVisibilityProvider from "../contexts/LayerVisibilityProvider";
import SelectedLocationProvider from "../contexts/SelectedLocationProvider";
import EditMapContext from "../contexts/EditMapContext";
import MyEdit from "../components/MyEdit";
import SelectedPointsProvider from "../contexts/SelectedPointsProvider";
import SelectedPolygonProvider from "../contexts/SelectedPolygonProvider";
import SelectedPolygonAreaProvider from "../contexts/SelectedPolygonAreaProvider";
import EditLayerVisibilityProvider from "../contexts/EditLayerVisibilityProvider";
Expand Down Expand Up @@ -54,7 +53,6 @@ const HomePage = () => {
<LayerVisibilityProvider>
<EditLayerVisibilityProvider>
<SelectedLocationProvider>
<SelectedPointsProvider>
<SelectedPolygonProvider>
<SelectedPolygonAreaProvider>
<Navbar
Expand All @@ -81,7 +79,6 @@ const HomePage = () => {
</Drawer>
</SelectedPolygonAreaProvider>
</SelectedPolygonProvider>
</SelectedPointsProvider>
</SelectedLocationProvider>
</EditLayerVisibilityProvider>
</LayerVisibilityProvider>
Expand Down

0 comments on commit 159f2a5

Please sign in to comment.