Skip to content
This repository was archived by the owner on May 30, 2023. It is now read-only.

Commit 5f591fe

Browse files
pcaversacciopcaversaccio
authored
Merge branch 'develop' into renovate/npm-moment-vulnerability
2 parents 2b88503 + ff4c1fb commit 5f591fe

19 files changed

Lines changed: 345 additions & 162 deletions

File tree

‎src/components/Annotation/Editor/Shape/EllipseShape.tsx‎

Lines changed: 52 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import {
1313
selectorSelectedEllipse,
1414
} from "reduxes/annotation/selector";
1515
import { DrawObject, DrawState, DrawType } from "reduxes/annotation/type";
16+
import { selectorCurrentImageInEditorProps } from "reduxes/annotationmanager/selecetor";
1617
import { CIRCLE_STYLE, CORNER_RADIUS, LINE_STYLE } from "../const";
1718
import { EllipseCompProps, EllipseProps, EllipseSpec } from "../type";
1819
import useCommonShapeEvent from "../useCommonShapeEvent";
@@ -47,7 +48,9 @@ function EllipseComp({
4748
const commonShapeEvent = useCommonShapeEvent({ drawObject: spec });
4849
const currentDrawState = useSelector(selectorCurrentDrawState);
4950
const drawObjectState = useSelector(selectorDrawObjectState(spec.id));
50-
51+
const currentImageInEditorProps = useSelector(
52+
selectorCurrentImageInEditorProps
53+
);
5154
const [strokeWidth, setStrokeWidth] = useState<number>(
5255
spec.cssStyle.strokeWidth
5356
);
@@ -75,28 +78,62 @@ function EllipseComp({
7578
trRef.current.getLayer().batchDraw();
7679
}
7780
}, [isSelected]);
78-
const [stage, setStage] = useState<Konva.Stage | null>(null);
7981

8082
const groupDragBound = (pos: Vector2d) => {
8183
let { x, y } = pos;
82-
const sw = stage ? stage.width() : 0;
83-
const sh = stage ? stage.height() : 0;
84-
if (shapeRef && shapeRef.current) {
84+
if (shapeRef && shapeRef.current && currentImageInEditorProps) {
85+
const { clientRectOfBaseImage } = currentImageInEditorProps;
8586
const box = shapeRef.current.getClientRect();
8687

87-
if (y - box.height / 2 < 0) y = box.height / 2;
88-
if (x - box.width / 2 < 0) x = box.width / 2;
89-
if (y + box.height / 2 > sh) y = sh - box.height / 2;
90-
if (x + box.width / 2 > sw) x = sw - box.width / 2;
91-
return { x, y };
88+
if (clientRectOfBaseImage) {
89+
if (x - box.width / 2 < clientRectOfBaseImage.x) {
90+
x = clientRectOfBaseImage.x + box.width / 2;
91+
}
92+
if (y - box.height / 2 < clientRectOfBaseImage.y) {
93+
y = clientRectOfBaseImage.y + box.height / 2;
94+
}
95+
if (
96+
x + box.width >
97+
clientRectOfBaseImage.x + clientRectOfBaseImage.width
98+
) {
99+
x =
100+
clientRectOfBaseImage.x +
101+
clientRectOfBaseImage.width -
102+
box.width / 2;
103+
}
104+
if (
105+
y + box.height >
106+
clientRectOfBaseImage.y + clientRectOfBaseImage.height
107+
) {
108+
y =
109+
clientRectOfBaseImage.y +
110+
clientRectOfBaseImage.height -
111+
box.height / 2;
112+
}
113+
}
92114
}
93-
return { x: 0, y: 0 };
94-
};
95115

96-
const handleDragStart = (e: KonvaEventObject<DragEvent>) => {
97-
setStage(e.target.getStage());
98-
commonShapeEvent.handleDragStart(e);
116+
return {
117+
x,
118+
y,
119+
};
99120
};
121+
// const groupDragBound = (pos: Vector2d) => {
122+
// let { x, y } = pos;
123+
// const sw = stage ? stage.width() : 0;
124+
// const sh = stage ? stage.height() : 0;
125+
// if (shapeRef && shapeRef.current) {
126+
// const box = shapeRef.current.getClientRect();
127+
128+
// if (y - box.height / 2 < 0) y = box.height / 2;
129+
// if (x - box.width / 2 < 0) x = box.width / 2;
130+
// if (y + box.height / 2 > sh) y = sh - box.height / 2;
131+
// if (x + box.width / 2 > sw) x = sw - box.width / 2;
132+
// return { x, y };
133+
// }
134+
// return { x: 0, y: 0 };
135+
// };
136+
100137
const handleTransformEnd = (e: KonvaEventObject<Event>) => {
101138
const node = shapeRef.current;
102139
if (!node) return;
@@ -150,7 +187,6 @@ function EllipseComp({
150187
onMouseOut={onMouseOut}
151188
draggable={commonShapeEvent.isLock !== true}
152189
onDragEnd={handleDragEnd}
153-
onDragStart={handleDragStart}
154190
onTransformEnd={handleTransformEnd}
155191
strokeScaleEnabled={false}
156192
{...spec}

‎src/components/Annotation/Editor/Shape/Rectangle.tsx‎

Lines changed: 32 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import {
1313
selectorSelectedRectangle,
1414
} from "reduxes/annotation/selector";
1515
import { DrawObject, DrawState, DrawType } from "reduxes/annotation/type";
16+
import { selectorCurrentImageInEditorProps } from "reduxes/annotationmanager/selecetor";
1617
import { CIRCLE_STYLE, CORNER_RADIUS, LINE_STYLE } from "../const";
1718
import { RectangleCompProps, RectangleProps, RectangleSpec } from "../type";
1819
import useCommonShapeEvent from "../useCommonShapeEvent";
@@ -46,6 +47,9 @@ function RectangleComp({
4647
const commonShapeEvent = useCommonShapeEvent({ drawObject: spec });
4748
const currentDrawState = useSelector(selectorCurrentDrawState);
4849
const drawObjectState = useSelector(selectorDrawObjectState(spec.id));
50+
const currentImageInEditorProps = useSelector(
51+
selectorCurrentImageInEditorProps
52+
);
4953

5054
const [strokeWidth, setStrokeWidth] = useState<number>(
5155
spec.cssStyle.strokeWidth
@@ -74,29 +78,38 @@ function RectangleComp({
7478
trRef.current.getLayer().batchDraw();
7579
}
7680
}, [isSelected]);
77-
const [stage, setStage] = useState<Konva.Stage | null>(null);
78-
7981
const groupDragBound = (pos: Vector2d) => {
8082
let { x, y } = pos;
81-
const sw = stage ? stage.width() : 0;
82-
const sh = stage ? stage.height() : 0;
83-
if (shapeRef && shapeRef.current) {
84-
const box = shapeRef.current.getClientRect();
85-
const minMaxX = [0, box.width];
86-
const minMaxY = [0, box.height];
87-
88-
if (minMaxY[0] + y < 0) y = -1 * minMaxY[0];
89-
if (minMaxX[0] + x < 0) x = -1 * minMaxX[0];
90-
if (minMaxY[1] + y > sh) y = sh - minMaxY[1];
91-
if (minMaxX[1] + x > sw) x = sw - minMaxX[1];
92-
return { x, y };
83+
if (shapeRef && shapeRef.current && currentImageInEditorProps) {
84+
const { clientRectOfBaseImage } = currentImageInEditorProps;
85+
if (clientRectOfBaseImage) {
86+
if (x < clientRectOfBaseImage.x) {
87+
x = clientRectOfBaseImage.x;
88+
}
89+
if (y < clientRectOfBaseImage.y) {
90+
y = clientRectOfBaseImage.y;
91+
}
92+
const box = shapeRef.current.getClientRect();
93+
if (
94+
x + box.width >
95+
clientRectOfBaseImage.x + clientRectOfBaseImage.width
96+
) {
97+
x = clientRectOfBaseImage.x + clientRectOfBaseImage.width - box.width;
98+
}
99+
if (
100+
y + box.height >
101+
clientRectOfBaseImage.y + clientRectOfBaseImage.height
102+
) {
103+
y =
104+
clientRectOfBaseImage.y + clientRectOfBaseImage.height - box.height;
105+
}
106+
}
93107
}
94-
return { x: 0, y: 0 };
95-
};
96108

97-
const handleDragStart = (e: KonvaEventObject<DragEvent>) => {
98-
setStage(e.target.getStage());
99-
commonShapeEvent.handleDragStart(e);
109+
return {
110+
x,
111+
y,
112+
};
100113
};
101114
const handleDragEnd = (e: KonvaEventObject<DragEvent>) => {
102115
onChange({
@@ -139,7 +152,6 @@ function RectangleComp({
139152
setStrokeWidth(spec.cssStyle.strokeWidth);
140153
onMouseOutHandler(e);
141154
};
142-
143155
return (
144156
<>
145157
<Rect
@@ -152,7 +164,6 @@ function RectangleComp({
152164
onMouseOut={onMouseOut}
153165
draggable={commonShapeEvent.isLock !== true}
154166
onDragEnd={handleDragEnd}
155-
onDragStart={handleDragStart}
156167
onTransformEnd={handleTransformEnd}
157168
strokeScaleEnabled={false}
158169
{...spec}

‎src/components/CreateProjectModal/index.tsx‎

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import {
2525
EMPTY_DATASET_CREATE_PROJECT_DATASET_TYPE_VALUE,
2626
EXISTING_DATASET_CREATE_PROJECT_DATASET_TYPE_VALUE,
2727
ID_TOKEN_NAME,
28+
MAX_DATASET_IMAGES,
2829
MAX_DATASET_IMAGES_CREATE_PROJECT,
2930
MAX_PROJECT_DESCRIPTION_CHARACTER_LENGTH,
3031
MIN_DATASET_IMAGES_CREATE_PROJECT,
@@ -123,7 +124,11 @@ const CreateProjectDatasetTypeControl = function (
123124
if (selectedPrebuildDataset) {
124125
setPrebuildDataset(selectedPrebuildDataset);
125126
setNumberOfDatasetImages(
126-
selectedPrebuildDataset.totalImage
127+
selectedPrebuildDataset?.totalImage &&
128+
selectedPrebuildDataset.totalImage > MAX_DATASET_IMAGES
129+
? MAX_DATASET_IMAGES
130+
: selectedPrebuildDataset?.totalImage ||
131+
MIN_DATASET_IMAGES_CREATE_PROJECT
127132
);
128133
}
129134
}}
@@ -139,7 +144,7 @@ const CreateProjectDatasetTypeControl = function (
139144
/>
140145
</Box>
141146
<Typography variant="body2" mt={2}>
142-
Number of dataset images:
147+
Number of images:
143148
</Typography>
144149
<Box display="flex" alignItems="center" columnGap={1} pl={1}>
145150
<Slider
@@ -150,8 +155,11 @@ const CreateProjectDatasetTypeControl = function (
150155
onChange={onChangeNumberOfDatasetImagesSlider}
151156
min={MIN_DATASET_IMAGES_CREATE_PROJECT}
152157
max={
153-
prebuildDataset?.totalImage ||
154-
MIN_DATASET_IMAGES_CREATE_PROJECT
158+
prebuildDataset?.totalImage &&
159+
prebuildDataset.totalImage > MAX_DATASET_IMAGES
160+
? MAX_DATASET_IMAGES
161+
: prebuildDataset?.totalImage ||
162+
MIN_DATASET_IMAGES_CREATE_PROJECT
155163
}
156164
disabled={isCreatingProject}
157165
/>
@@ -163,8 +171,11 @@ const CreateProjectDatasetTypeControl = function (
163171
inputProps={{
164172
min: MIN_DATASET_IMAGES_CREATE_PROJECT,
165173
max:
166-
prebuildDataset?.totalImage ||
167-
MIN_DATASET_IMAGES_CREATE_PROJECT,
174+
prebuildDataset?.totalImage &&
175+
prebuildDataset.totalImage > MAX_DATASET_IMAGES
176+
? MAX_DATASET_IMAGES
177+
: prebuildDataset?.totalImage ||
178+
MIN_DATASET_IMAGES_CREATE_PROJECT,
168179
type: "number",
169180
"aria-labelledby": "input-number-of-dataset-images-slider",
170181
}}

‎src/components/FeedbackComponent/FeedbackForm.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -329,6 +329,8 @@ export const FeedbackFormSlack = function ({
329329
if (onSendFail) onSendFail();
330330
resolve({ action: FeedbackFormAction.NO_ACTION });
331331
});
332+
} else {
333+
resolve({ action: FeedbackFormAction.NO_ACTION });
332334
}
333335
});
334336

‎src/components/TooltipToggleButton/index.tsx‎

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,11 @@ type TooltipToggleButtonProps = ToggleButtonProps & {
77
};
88

99
const TooltipToggleButton: VFC<TooltipToggleButtonProps> = forwardRef(
10-
({ TooltipProps, ...props }, ref) => {
11-
return (
12-
<Tooltip {...TooltipProps}>
13-
<ToggleButton ref={ref} {...props} />
14-
</Tooltip>
15-
);
16-
}
10+
({ TooltipProps, ...props }, ref) => (
11+
<Tooltip {...TooltipProps}>
12+
<ToggleButton ref={ref} {...props} />
13+
</Tooltip>
14+
)
1715
);
1816

1917
export default TooltipToggleButton;

‎src/constants/defaultValues.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -236,3 +236,5 @@ export const MAX_SIZE_FEEDBACK_ATTACHED_FILE = 2000000;
236236

237237
export const QUIT_FEEDBACK_ALERT_MESSAGE =
238238
"Your feedback content will be lost. Are you sure you want to quit?";
239+
240+
export const MAX_DATASET_IMAGES = 800;

‎src/reduxes/annotationmanager/action.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import {
99
SAVE_ANNOTATION_STATE_MANAGER,
1010
SAVE_REMOTE_NEW_CLASS_LABEL,
1111
SET_ANNOTATION_STATE_MANAGER,
12+
SET_CLIENT_RECT_OF_BASE_IMAGE,
1213
SET_CLASS_MANAGE_MODAL,
1314
SET_PREVIEW_IMAGE,
1415
} from "./constants";
@@ -21,6 +22,7 @@ import {
2122
EditClassManageModalProps,
2223
FetchingFileAndAnnotaitonProps,
2324
SaveAnnotationStateManagerProps,
25+
SetClientRectOfBaseImageProps,
2426
} from "./type";
2527

2628
export const addImagesToAnnotation = (payload: AddImageToAnnotationProps) => ({
@@ -86,3 +88,9 @@ export const fetchingFileAndAnnotaiton = (
8688
export const resetAnnotationManager = () => ({
8789
type: RESET_ANNOTATION_MANAGER,
8890
});
91+
export const setClientRectOfBaseImage = (
92+
payload: SetClientRectOfBaseImageProps
93+
) => ({
94+
type: SET_CLIENT_RECT_OF_BASE_IMAGE,
95+
payload,
96+
});

‎src/reduxes/annotationmanager/constants.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,3 +16,4 @@ export const FETCH_FILE_AND_ANNOTATION = asyncAction(
1616
);
1717
export const SAVE_REMOTE_NEW_CLASS_LABEL = asyncAction("SAVE_NEW_CLASS_LABEL");
1818
export const RESET_ANNOTATION_MANAGER = "RESET_ANNOTATION_MANAGER";
19+
export const SET_CLIENT_RECT_OF_BASE_IMAGE = "SET_CLIENT_RECT_OF_BASE_IMAGE";

0 commit comments

Comments
 (0)