From f831142b5e27923a3b224ab5d8544b390263b9d4 Mon Sep 17 00:00:00 2001
From: Boris Sekachev <boris.sekachev@intel.com>
Date: Mon, 24 Jan 2022 11:13:56 +0300
Subject: [PATCH] Displaying shape size for ellipses (#4229)

* Displaying shape size for ellipses

* Updated version
---
 cvat-canvas/package-lock.json             | 4 ++--
 cvat-canvas/package.json                  | 2 +-
 cvat-canvas/src/typescript/canvasView.ts  | 2 +-
 cvat-canvas/src/typescript/drawHandler.ts | 6 ++++--
 cvat-canvas/src/typescript/shared.ts      | 4 ++--
 5 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/cvat-canvas/package-lock.json b/cvat-canvas/package-lock.json
index 4ae904c9..0ab12955 100644
--- a/cvat-canvas/package-lock.json
+++ b/cvat-canvas/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "cvat-canvas",
-  "version": "2.13.0",
+  "version": "2.13.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "cvat-canvas",
-      "version": "2.13.0",
+      "version": "2.13.1",
       "license": "MIT",
       "dependencies": {
         "@types/polylabel": "^1.0.5",
diff --git a/cvat-canvas/package.json b/cvat-canvas/package.json
index 45df7251..776dd7ca 100644
--- a/cvat-canvas/package.json
+++ b/cvat-canvas/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cvat-canvas",
-  "version": "2.13.0",
+  "version": "2.13.1",
   "description": "Part of Computer Vision Annotation Tool which presents its canvas library",
   "main": "src/canvas.ts",
   "scripts": {
diff --git a/cvat-canvas/src/typescript/canvasView.ts b/cvat-canvas/src/typescript/canvasView.ts
index 7aad5789..6a4348a3 100644
--- a/cvat-canvas/src/typescript/canvasView.ts
+++ b/cvat-canvas/src/typescript/canvasView.ts
@@ -2038,7 +2038,7 @@ export class CanvasViewImpl implements CanvasView, Listener {
                 resized = false;
                 hideDirection();
                 hideText();
-                if (state.shapeType === 'rectangle') {
+                if (state.shapeType === 'rectangle' || state.shapeType === 'ellipse') {
                     shapeSizeElement = displayShapeSize(this.adoptedContent, this.adoptedText);
                 }
                 (shape as any).on('remove.resize', () => {
diff --git a/cvat-canvas/src/typescript/drawHandler.ts b/cvat-canvas/src/typescript/drawHandler.ts
index 29b2ad5b..b57976f9 100644
--- a/cvat-canvas/src/typescript/drawHandler.ts
+++ b/cvat-canvas/src/typescript/drawHandler.ts
@@ -1,4 +1,4 @@
-// Copyright (C) 2019-2021 Intel Corporation
+// Copyright (C) 2019-2022 Intel Corporation
 //
 // SPDX-License-Identifier: MIT
 
@@ -469,6 +469,7 @@ export class DrawHandlerImpl implements DrawHandler {
                 const cy = initialPoint.y + ry * Math.sign(translated[1] - initialPoint.y);
                 this.drawInstance.center(cx, cy);
                 this.drawInstance.radius(rx, ry);
+                this.shapeSizeElement.update(this.drawInstance);
             }
         });
     }
@@ -966,6 +967,7 @@ export class DrawHandlerImpl implements DrawHandler {
                 this.drawPoints();
             } else if (this.drawData.shapeType === 'ellipse') {
                 this.drawEllipse();
+                this.shapeSizeElement = displayShapeSize(this.canvas, this.text);
             } else if (this.drawData.shapeType === 'cuboid') {
                 if (this.drawData.cuboidDrawingMethod === CuboidDrawingMethod.CORNER_POINTS) {
                     this.drawCuboidBy4Points();
@@ -1050,7 +1052,7 @@ export class DrawHandlerImpl implements DrawHandler {
     public transform(geometry: Geometry): void {
         this.geometry = geometry;
 
-        if (this.shapeSizeElement && this.drawInstance && this.drawData.shapeType === 'rectangle') {
+        if (this.shapeSizeElement && this.drawInstance && ['rectangle', 'ellipse'].includes(this.drawData.shapeType)) {
             this.shapeSizeElement.update(this.drawInstance);
         }
 
diff --git a/cvat-canvas/src/typescript/shared.ts b/cvat-canvas/src/typescript/shared.ts
index cd19634c..3d1ea0d2 100644
--- a/cvat-canvas/src/typescript/shared.ts
+++ b/cvat-canvas/src/typescript/shared.ts
@@ -1,4 +1,4 @@
-// Copyright (C) 2019-2021 Intel Corporation
+// Copyright (C) 2019-2022 Intel Corporation
 //
 // SPDX-License-Identifier: MIT
 
@@ -97,7 +97,7 @@ export function displayShapeSize(shapesContainer: SVG.Container, textContainer:
             .addClass('cvat_canvas_text'),
         update(shape: SVG.Shape): void {
             let text = `${Math.round(shape.width())}x${Math.round(shape.height())}px`;
-            if (shape.type === 'rect') {
+            if (shape.type === 'rect' || shape.type === 'ellipse') {
                 let rotation = shape.transform().rotation || 0;
                 // be sure, that rotation in range [0; 360]
                 while (rotation < 0) rotation += 360;