From ecef890a61b142aac5c58296bd221acd654601b9 Mon Sep 17 00:00:00 2001 From: Owen Ip Date: Mon, 10 Jul 2023 11:42:42 -0700 Subject: [PATCH 1/6] Add key shortbut to hide/show all labels --- src/logic/actions/ImageActions.ts | 6 ++++++ src/logic/actions/LabelActions.ts | 20 ++++++++++++++++++++ src/logic/context/EditorContext.ts | 9 ++++++++- 3 files changed, 34 insertions(+), 1 deletion(-) diff --git a/src/logic/actions/ImageActions.ts b/src/logic/actions/ImageActions.ts index bce4b7cd..cc695d3a 100644 --- a/src/logic/actions/ImageActions.ts +++ b/src/logic/actions/ImageActions.ts @@ -17,6 +17,7 @@ import { LabelRect, } from "../../store/labels/types"; import { LabelStatus } from "../../data/enums/LabelStatus"; +import { LabelActions } from "./LabelActions"; import { remove } from "lodash"; export class ImageActions { @@ -149,4 +150,9 @@ export class ImageActions { return newImageData; } + + public static toggleAllLabelsVisibility(): void { + const imageData: ImageData = LabelsSelector.getActiveImageData(); + LabelActions.toggleAllLabelsVisibility(imageData.id); + } } diff --git a/src/logic/actions/LabelActions.ts b/src/logic/actions/LabelActions.ts index d47f2e7d..bfdbee01 100644 --- a/src/logic/actions/LabelActions.ts +++ b/src/logic/actions/LabelActions.ts @@ -71,6 +71,26 @@ export class LabelActions { store.dispatch(updateImageDataById(imageData.id, newImageData)); } + public static toggleAllLabelsVisibility(imageId: string) { + const imageData: ImageData = LabelsSelector.getImageDataById(imageId); + const newImageData = { + ...imageData, + labelPoints: imageData.labelPoints.map((labelPoint: LabelPoint) => { + return LabelUtil.toggleAnnotationVisibility(labelPoint) + }), + labelRects: imageData.labelRects.map((labelRect: LabelRect) => { + return LabelUtil.toggleAnnotationVisibility(labelRect) + }), + labelPolygons: imageData.labelPolygons.map((labelPolygon: LabelPolygon) => { + return LabelUtil.toggleAnnotationVisibility(labelPolygon) + }), + labelLines: imageData.labelLines.map((labelLine: LabelLine) => { + return LabelUtil.toggleAnnotationVisibility(labelLine) + }), + }; + store.dispatch(updateImageDataById(imageData.id, newImageData)); + } + public static toggleLabelVisibilityById(imageId: string, labelId: string) { const imageData: ImageData = LabelsSelector.getImageDataById(imageId); const newImageData = { diff --git a/src/logic/context/EditorContext.ts b/src/logic/context/EditorContext.ts index 14ee56ae..f5e227da 100644 --- a/src/logic/context/EditorContext.ts +++ b/src/logic/context/EditorContext.ts @@ -167,6 +167,13 @@ export class EditorContext extends BaseContext { ImageActions.setActiveLabelOnActiveImage(9); EditorActions.fullRender(); } - } + }, + { + keyCombo: ["h"], + action: (event: KeyboardEvent) => { + ImageActions.toggleAllLabelsVisibility(); + EditorActions.fullRender(); + } + }, ]; } \ No newline at end of file From a94d2f25e56e8ff105ee0414e72f10893a2f626c Mon Sep 17 00:00:00 2001 From: Owen Ip Date: Mon, 10 Jul 2023 11:53:06 -0700 Subject: [PATCH 2/6] Update README --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index d3cb5d21..83eda5fb 100644 --- a/README.md +++ b/README.md @@ -75,6 +75,7 @@ docker logs make-sense | Zoom out | Editor | ⌥ + - | Ctrl + - | | Move image | Editor | Up / Down / Left / Right | Up / Down / Left / Right | | Select Label | Editor | ⌥ + 0-9 | Ctrl + 0-9 | +| Show/Hide All Labels | Editor | h | h | Exit popup | Popup | Escape | Escape | **Table 1.** Supported keyboard shortcuts From 8b5c4a5d92b54bc36113073b0166cd02e64f25bb Mon Sep 17 00:00:00 2001 From: Owen Ip Date: Mon, 10 Jul 2023 19:07:17 -0700 Subject: [PATCH 3/6] Fix inconsistant visibility with new labels when added during hide all --- src/logic/actions/LabelActions.ts | 11 +++++++---- src/store/labels/types.ts | 2 ++ src/utils/LabelUtil.ts | 7 +++++++ 3 files changed, 16 insertions(+), 4 deletions(-) diff --git a/src/logic/actions/LabelActions.ts b/src/logic/actions/LabelActions.ts index bfdbee01..c57f8c30 100644 --- a/src/logic/actions/LabelActions.ts +++ b/src/logic/actions/LabelActions.ts @@ -73,21 +73,24 @@ export class LabelActions { public static toggleAllLabelsVisibility(imageId: string) { const imageData: ImageData = LabelsSelector.getImageDataById(imageId); + const newToggleValue = imageData.allLabelsVisibilityToggle ? !imageData.allLabelsVisibilityToggle : true; const newImageData = { ...imageData, + allLabelsVisibilityToggle: newToggleValue, labelPoints: imageData.labelPoints.map((labelPoint: LabelPoint) => { - return LabelUtil.toggleAnnotationVisibility(labelPoint) + return LabelUtil.setAnnotationVisibility(labelPoint, newToggleValue) }), labelRects: imageData.labelRects.map((labelRect: LabelRect) => { - return LabelUtil.toggleAnnotationVisibility(labelRect) + return LabelUtil.setAnnotationVisibility(labelRect, newToggleValue) }), labelPolygons: imageData.labelPolygons.map((labelPolygon: LabelPolygon) => { - return LabelUtil.toggleAnnotationVisibility(labelPolygon) + return LabelUtil.setAnnotationVisibility(labelPolygon, newToggleValue) }), labelLines: imageData.labelLines.map((labelLine: LabelLine) => { - return LabelUtil.toggleAnnotationVisibility(labelLine) + return LabelUtil.setAnnotationVisibility(labelLine, newToggleValue) }), }; + store.dispatch(updateImageDataById(imageData.id, newImageData)); } diff --git a/src/store/labels/types.ts b/src/store/labels/types.ts index 38397f7e..2c597c4c 100644 --- a/src/store/labels/types.ts +++ b/src/store/labels/types.ts @@ -49,6 +49,8 @@ export type ImageData = { labelPolygons: LabelPolygon[]; labelNameIds: string[]; + allLabelsVisibilityToggle: boolean; + // YOLO isVisitedByYOLOObjectDetector: boolean; diff --git a/src/utils/LabelUtil.ts b/src/utils/LabelUtil.ts index feec03d6..125f65ee 100644 --- a/src/utils/LabelUtil.ts +++ b/src/utils/LabelUtil.ts @@ -56,6 +56,13 @@ export class LabelUtil { } } + public static setAnnotationVisibility(annotation: AnnotationType, isVisible: boolean): AnnotationType { + return { + ...annotation, + isVisible + } + } + public static labelNamesIdsDiff(oldLabelNames: LabelName[], newLabelNames: LabelName[]): string[] { return oldLabelNames.reduce((missingIds: string[], labelName: LabelName) => { if (!find(newLabelNames, { 'id': labelName.id })) { From c75951db6117e5257d7ab400ec507105655d457b Mon Sep 17 00:00:00 2001 From: Owen Ip Date: Mon, 10 Jul 2023 19:44:12 -0700 Subject: [PATCH 4/6] Refactor --- src/logic/actions/ImageActions.ts | 4 +++- src/logic/actions/LabelActions.ts | 13 ++++++------- 2 files changed, 9 insertions(+), 8 deletions(-) diff --git a/src/logic/actions/ImageActions.ts b/src/logic/actions/ImageActions.ts index cc695d3a..72f83683 100644 --- a/src/logic/actions/ImageActions.ts +++ b/src/logic/actions/ImageActions.ts @@ -153,6 +153,8 @@ export class ImageActions { public static toggleAllLabelsVisibility(): void { const imageData: ImageData = LabelsSelector.getActiveImageData(); - LabelActions.toggleAllLabelsVisibility(imageData.id); + const newToggleValue = imageData.allLabelsVisibilityToggle ? !imageData.allLabelsVisibilityToggle : true; + + LabelActions.setAllLabelsVisibility(imageData.id, newToggleValue); } } diff --git a/src/logic/actions/LabelActions.ts b/src/logic/actions/LabelActions.ts index c57f8c30..ead33a86 100644 --- a/src/logic/actions/LabelActions.ts +++ b/src/logic/actions/LabelActions.ts @@ -71,23 +71,22 @@ export class LabelActions { store.dispatch(updateImageDataById(imageData.id, newImageData)); } - public static toggleAllLabelsVisibility(imageId: string) { + public static setAllLabelsVisibility(imageId: string, isVisible: boolean) { const imageData: ImageData = LabelsSelector.getImageDataById(imageId); - const newToggleValue = imageData.allLabelsVisibilityToggle ? !imageData.allLabelsVisibilityToggle : true; const newImageData = { ...imageData, - allLabelsVisibilityToggle: newToggleValue, + allLabelsVisibilityToggle: isVisible, labelPoints: imageData.labelPoints.map((labelPoint: LabelPoint) => { - return LabelUtil.setAnnotationVisibility(labelPoint, newToggleValue) + return LabelUtil.setAnnotationVisibility(labelPoint, isVisible) }), labelRects: imageData.labelRects.map((labelRect: LabelRect) => { - return LabelUtil.setAnnotationVisibility(labelRect, newToggleValue) + return LabelUtil.setAnnotationVisibility(labelRect, isVisible) }), labelPolygons: imageData.labelPolygons.map((labelPolygon: LabelPolygon) => { - return LabelUtil.setAnnotationVisibility(labelPolygon, newToggleValue) + return LabelUtil.setAnnotationVisibility(labelPolygon, isVisible) }), labelLines: imageData.labelLines.map((labelLine: LabelLine) => { - return LabelUtil.setAnnotationVisibility(labelLine, newToggleValue) + return LabelUtil.setAnnotationVisibility(labelLine, isVisible) }), }; From 909591164f06165ab9c02de57c03cd6fe4ba3ce8 Mon Sep 17 00:00:00 2001 From: Owen Ip Date: Mon, 10 Jul 2023 20:04:53 -0700 Subject: [PATCH 5/6] Fix formatting --- src/logic/actions/ImageActions.ts | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/logic/actions/ImageActions.ts b/src/logic/actions/ImageActions.ts index 72f83683..6c01f6f3 100644 --- a/src/logic/actions/ImageActions.ts +++ b/src/logic/actions/ImageActions.ts @@ -61,6 +61,13 @@ export class ImageActions { store.dispatch(updateActiveLabelNameId(labelNames[1].id)); } + public static toggleAllLabelsVisibility(): void { + const imageData: ImageData = LabelsSelector.getActiveImageData(); + const newToggleValue = imageData.allLabelsVisibilityToggle ? !imageData.allLabelsVisibilityToggle : false; + + LabelActions.setAllLabelsVisibility(imageData.id, newToggleValue); + } + private static mapNewImageData( imageData: ImageData, labelIndex: number @@ -150,11 +157,4 @@ export class ImageActions { return newImageData; } - - public static toggleAllLabelsVisibility(): void { - const imageData: ImageData = LabelsSelector.getActiveImageData(); - const newToggleValue = imageData.allLabelsVisibilityToggle ? !imageData.allLabelsVisibilityToggle : true; - - LabelActions.setAllLabelsVisibility(imageData.id, newToggleValue); - } } From b102a59d68d66bbd6a749d4385dbf645d058b18d Mon Sep 17 00:00:00 2001 From: Owen Ip Date: Wed, 12 Jul 2023 00:09:07 -0700 Subject: [PATCH 6/6] fix toggle value --- src/logic/actions/ImageActions.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/logic/actions/ImageActions.ts b/src/logic/actions/ImageActions.ts index 6c01f6f3..84bc2393 100644 --- a/src/logic/actions/ImageActions.ts +++ b/src/logic/actions/ImageActions.ts @@ -63,7 +63,7 @@ export class ImageActions { public static toggleAllLabelsVisibility(): void { const imageData: ImageData = LabelsSelector.getActiveImageData(); - const newToggleValue = imageData.allLabelsVisibilityToggle ? !imageData.allLabelsVisibilityToggle : false; + const newToggleValue = imageData.allLabelsVisibilityToggle !== null ? !imageData.allLabelsVisibilityToggle : false; LabelActions.setAllLabelsVisibility(imageData.id, newToggleValue); }