Skip to content

Commit

Permalink
Merge pull request #168 from ai-cfia/167-Annotation
Browse files Browse the repository at this point in the history
167 Annotation Activity - allow labeling of undetected object
  • Loading branch information
ChromaticPanic authored Jul 8, 2024

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
2 parents 637ff43 + 92aa6aa commit 527d940
Showing 7 changed files with 162 additions and 41 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "nachet-frontend",
"private": true,
"version": "0.9.0",
"version": "0.9.1",
"type": "module",
"scripts": {
"dev": "vite",
6 changes: 3 additions & 3 deletions src/_versions.ts
Original file line number Diff line number Diff line change
@@ -11,8 +11,8 @@ export interface TsAppVersion {
export const versions: TsAppVersion = {
version: '0.9.0',
name: 'nachet-frontend',
versionDate: '2024-06-22T20:47:06.767Z',
gitCommitHash: '',
versionLong: '0.9.0-',
versionDate: '2024-07-05T03:26:49.628Z',
gitCommitHash: '637ff43',
versionLong: '0.9.0-637ff43',
};
export default versions;
4 changes: 2 additions & 2 deletions src/common/imageutils.ts
Original file line number Diff line number Diff line change
@@ -37,8 +37,8 @@ export const getUnscaledCoordinates = (
const scaleFactorHeight = itemHeight / containerHeight;
const topX = box.left * scaleFactorWidth;
const topY = box.top * scaleFactorHeight;
const bottomX = box.left + box.minWidth * scaleFactorWidth;
const bottomY = box.top + box.minHeight * scaleFactorHeight;
const bottomX = (box.left + box.minWidth) * scaleFactorWidth;
const bottomY = (box.top + box.minHeight) * scaleFactorHeight;
return {
topX,
topY,
104 changes: 94 additions & 10 deletions src/components/body/feedback_form/FeedbackForm.tsx
Original file line number Diff line number Diff line change
@@ -3,7 +3,6 @@ import {
Box,
IconButton,
FormControl,
// FormLabel,
Button,
Autocomplete,
TextField,
@@ -12,6 +11,14 @@ import {
MenuItem,
SelectChangeEvent,
FilterOptionsState,
Paper,
TableContainer,
Table,
TableBody,
TableRow,
TableCell,
TableHead,
Typography,
} from "@mui/material";
import CheckCircleOutlinedIcon from "@mui/icons-material/CheckCircleOutlined";
import CancelOutlinedIcon from "@mui/icons-material/CancelOutlined";
@@ -71,7 +78,10 @@ export const SimpleFeedbackForm = (
flexWrap: "wrap",
}}
>
<IconButton size="small" onClick={handlePositiveFeedback}>
<IconButton
sx={{ marginRight: "15px" }}
onClick={handlePositiveFeedback}
>
<CheckCircleOutlinedIcon
sx={{
color: "green",
@@ -97,6 +107,7 @@ interface NegativeFeedbackFormProps {
classList: ClassData[];
onCancel: () => void;
onSubmit: (feedbackDataNegative: FeedbackDataNegative) => void;
isNewAnnotation: boolean;
}

export const NegativeFeedbackForm = (
@@ -105,7 +116,13 @@ export const NegativeFeedbackForm = (
/* TODO: update when backend is defined Section stub convert to prop or use state when backend defined */

const reasons = useMemo(() => {
return ["No Seed", "Multi Seed", "Wrong Seed", "Wrong Seed not in List"];
return [
"Seed not Detected",
"Wrong Seed",
"No Seed",
"Multi Seed",
"Wrong Seed not in List",
];
}, []);
/* Section stub convert to prop or use state when backend defined */

@@ -117,9 +134,18 @@ export const NegativeFeedbackForm = (
};
}, []);

const { inference, position, classList, onCancel, onSubmit } = props;
const formWidth = "300px";

const {
inference,
position,
classList,
onCancel,
onSubmit,
isNewAnnotation,
} = props;
const [selectedClass, setSelectedClass] = useState<ClassData>(defaultClass);
const [comment, setComment] = useState<string>(reasons[2]);
const [comment, setComment] = useState<string>(reasons[1]);

const filter = createFilterOptions<ClassData>();

@@ -208,13 +234,19 @@ export const NegativeFeedbackForm = (
}
}, [comment]);

useEffect(() => {
if (isNewAnnotation) {
setComment(reasons[0]);
}
}, [isNewAnnotation, reasons]);

return (
<Draggable
defaultPosition={{
x: position.left,
x: position.left - parseInt(formWidth.slice(0, -2)) - 10,
y: position.top,
}}
// bounds="parent"
bounds="parent"
disabled={false}
>
<Box
@@ -225,12 +257,60 @@ export const NegativeFeedbackForm = (
backgroundColor: "white",
border: "2px solid black",
padding: "10px",
minWidth: "300px",
minWidth: formWidth,
minHeight: "5px",
borderRadius: "5px",
borderRadius: "10px",
justifyContent: "center",
}}
>
<FormControl size="small" sx={{ width: "100%" }}>
<FormControl size="small" sx={{ width: "100%", alignItems: "center" }}>
<Typography
variant="h5"
sx={{ textAlign: "center", marginBottom: "10px" }}
>
Feedback
</Typography>

<TableContainer component={Paper} sx={{ maxWidth: "fit-content" }}>
<Table
sx={{ maxWidth: "fit-content" }}
size="small"
aria-label="Bounding Box"
>
<TableHead>
<TableRow>
<TableCell>Bounding Box</TableCell>
<TableCell>_</TableCell>
</TableRow>
</TableHead>
<TableBody>
<TableRow>
<TableCell>TopX</TableCell>
<TableCell sx={{ textAlign: "right" }}>
{inference.boxes[0].box.topX.toFixed(2)}
</TableCell>
</TableRow>
<TableRow>
<TableCell>TopY</TableCell>
<TableCell sx={{ textAlign: "right" }}>
{inference.boxes[0].box.topY.toFixed(2)}
</TableCell>
</TableRow>
<TableRow>
<TableCell>BottomX</TableCell>
<TableCell sx={{ textAlign: "right" }}>
{inference.boxes[0].box.bottomX.toFixed(2)}
</TableCell>
</TableRow>
<TableRow>
<TableCell>BottomY</TableCell>
<TableCell sx={{ textAlign: "right" }}>
{inference.boxes[0].box.bottomY.toFixed(2)}
</TableCell>
</TableRow>
</TableBody>
</Table>
</TableContainer>
<Autocomplete
id="feedback-class"
renderInput={(params) => <TextField {...params} label="Class" />}
@@ -253,14 +333,17 @@ export const NegativeFeedbackForm = (
}}
disabled={comment === "No Seed"}
/>

<Select
disabled={isNewAnnotation}
labelId="comment-select-label"
id="feedback-comment"
value={comment}
label="Feedback Comment"
onChange={handleCommentChange}
sx={{
marginTop: "20px",
minWidth: "100%",
}}
>
{reasons.map((reason, index) => {
@@ -279,6 +362,7 @@ export const NegativeFeedbackForm = (
justifyContent: "space-evenly",
alignItems: "center",
marginTop: "20px",
minWidth: "100%",
}}
>
<Button
15 changes: 10 additions & 5 deletions src/components/body/feedback_form/FreeformBox.tsx
Original file line number Diff line number Diff line change
@@ -2,7 +2,7 @@ import Draggable, { DraggableData, DraggableEvent } from "react-draggable";
import { NumberSize, Resizable } from "re-resizable";
import { Box, IconButton } from "@mui/material";
import OpenWithOutlinedIcon from "@mui/icons-material/OpenWithOutlined";
import CheckCircleOutlinedIcon from "@mui/icons-material/CheckCircleOutlined";
import SaveIcon from "@mui/icons-material/Save";
import CancelOutlinedIcon from "@mui/icons-material/CancelOutlined";
import OpenInFullOutlinedIcon from "@mui/icons-material/OpenInFullOutlined";
import { useState } from "react";
@@ -21,6 +21,7 @@ const FreeformBox = (props: FreeformBoxProps) => {
const [topY, setTopY] = useState(position.top);
const [width, setWidth] = useState(position.minWidth);
const [height, setHeight] = useState(position.minHeight);
const [changesSaved, setChangesSaved] = useState(true);

const buttonStyle = {
borderRadius: "0",
@@ -34,6 +35,7 @@ const FreeformBox = (props: FreeformBoxProps) => {
) => {
setTopX(dragElement.x);
setTopY(dragElement.y);
setChangesSaved(false);
};

const handleResizeStop = (
@@ -44,6 +46,7 @@ const FreeformBox = (props: FreeformBoxProps) => {
) => {
setWidth(width + delta.width);
setHeight(height + delta.height);
setChangesSaved(false);
};

const handleSubmit = () => {
@@ -55,6 +58,7 @@ const FreeformBox = (props: FreeformBoxProps) => {
maxWidth: width,
maxHeight: height,
};
setChangesSaved(true);
onSubmit(currPosition);
};

@@ -123,19 +127,20 @@ const FreeformBox = (props: FreeformBoxProps) => {
<OpenInFullOutlinedIcon />
)}
</IconButton>

<IconButton
size="small"
sx={{
...buttonStyle,
color: "green",
color: changesSaved ? "green" : "grey",
marginRight: "10px",
marginLeft: "10px",
}}
onClick={handleSubmit}
>
<CheckCircleOutlinedIcon />
<SaveIcon />
</IconButton>

<IconButton
size="small"
sx={{
...buttonStyle,
color: "red",
Loading

0 comments on commit 527d940

Please sign in to comment.