Merge pull request #2507 from openvinotoolkit/bs/fixed_grouping

Fixed grouping when press escape with drawn region or change a frame

CHANGELOG.md

@@ -41,6 +41,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Empty frames navigation (<https://github.com/openvinotoolkit/cvat/pull/2505>)
 - Disabled position editing in AAM (<https://github.com/openvinotoolkit/cvat/pull/2506>)
 - TypeError: Cannot read property 'toString' of undefined (<https://github.com/openvinotoolkit/cvat/pull/2517>)
+- Extra shapes are drawn after Esc, or G pressed while drawing a region in grouping (<https://github.com/openvinotoolkit/cvat/pull/2507>)
 
 ### Security
 

cvat-canvas/src/typescript/groupHandler.ts

@@ -35,11 +35,11 @@ export class GroupHandlerImpl implements GroupHandler {
     private getSelectionBox(
         event: MouseEvent,
     ): {
-        xtl: number;
-        ytl: number;
-        xbr: number;
-        ybr: number;
-    } {
+            xtl: number;
+            ytl: number;
+            xbr: number;
+            ybr: number;
+        } {
         const point = translateToSVG((this.canvas.node as any) as SVGSVGElement, [event.clientX, event.clientY]);
         const stopSelectionPoint = {
             x: point[0],
@@ -96,11 +96,11 @@ export class GroupHandlerImpl implements GroupHandler {
                 const bbox = shape.bbox();
                 const clientID = shape.attr('clientID');
                 if (
-                    bbox.x > box.xtl &&
-                    bbox.y > box.ytl &&
-                    bbox.x + bbox.width < box.xbr &&
-                    bbox.y + bbox.height < box.ybr &&
-                    !(clientID in this.highlightedShapes)
+                    bbox.x > box.xtl
+                    && bbox.y > box.ytl
+                    && bbox.x + bbox.width < box.xbr
+                    && bbox.y + bbox.height < box.ybr
+                    && !(clientID in this.highlightedShapes)
                 ) {
                     const objectState = this.getStates().filter(
                         (state: any): boolean => state.clientID === clientID,
@@ -124,7 +124,6 @@ export class GroupHandlerImpl implements GroupHandler {
 
         this.resetSelectedObjects();
         this.initialized = false;
-        this.selectionRect = null;
         this.startSelectionPoint = {
             x: null,
             y: null,
@@ -213,6 +212,10 @@ export class GroupHandlerImpl implements GroupHandler {
         }
         this.statesToBeGroupped = [];
         this.highlightedShapes = {};
+        if (this.selectionRect) {
+            this.selectionRect.remove();
+            this.selectionRect = null;
+        }
     }
 
     public cancel(): void {

cvat-ui/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "cvat-ui",
-  "version": "1.11.1",
+  "version": "1.11.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

cvat-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cvat-ui",
-  "version": "1.11.1",
+  "version": "1.11.2",
   "description": "CVAT single-page application",
   "main": "src/index.tsx",
   "scripts": {