Interpolation of polyshapes in CVAT (cvat-ai#1571)

* cvat-core interpolation * Unlocked polyshapes * Updated versions * Second implementation * Splitted line * Inverse, set start point, fixed editing a bit, point menu refactoring * Removed extra code, fixed bug: Cannot open shape context menu when point context menu is opened * Do not close shape context menu on change shap[e * Improved editing * Updated mouseevents to edit/delete, added ability to redraw (shift + N) * Ignore tags when redraw * Ingoring tags on canvas, added method isAbleToChangeFrame, hide shapes during redraw, do not allow changing frame during redraw * Canceled advanced editing for polygons * A couple of fixes in interpolation, editing, reducing number of points * Moved change orientation functionality * Fixed interpolation algorithm * Zero division issue * Zero division issue * Segment minimization * Server implementation * Keyframe set to False * Simplified code, fixed server side code * Updated changelog.md * Added pdf describing interpolation * Resolved some issues * Updated UI version * Updated canvas version * Fixed host
signatrix · Aug 3, 2020 · 7348f67 · 7348f67
1 parent a3182cd
commit 7348f67
Show file tree

Hide file tree

Showing 37 changed files with 1,251 additions and 770 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -15,11 +15,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Built-in search for labels when create an object or change a label (<https://github.com/opencv/cvat/pull/1683>)
 - Better validation of labels and attributes in raw viewer (<https://github.com/opencv/cvat/pull/1727>)
 - ClamAV antivirus integration (<https://github.com/opencv/cvat/pull/1712>)
+- Polygon and polylines interpolation (<https://github.com/opencv/cvat/pull/1571>)
+- Ability to redraw shape from scratch (Shift + N) for an activated shape (<https://github.com/opencv/cvat/pull/1571>)
+- Highlights for the first point of a polygon/polyline and direction (<https://github.com/opencv/cvat/pull/1571>)
+- Ability to change orientation for poylgons/polylines in context menu (<https://github.com/opencv/cvat/pull/1571>)
+- Ability to set the first point for polygons in points context menu (<https://github.com/opencv/cvat/pull/1571>)
 
 ### Changed
 - Removed information about e-mail from the basic user information (<https://github.com/opencv/cvat/pull/1627>)
 - Update https install manual. Makes it easier and more robust. Includes automatic renewing of lets encrypt certificates.
 - Implemented import and export of annotations with relative image paths (<https://github.com/opencv/cvat/pull/1463>)
+- Using only single click to start editing or remove a point (<https://github.com/opencv/cvat/pull/1571>)
 
 ### Deprecated
 -

diff --git a/cvat-canvas/README.md b/cvat-canvas/README.md
@@ -117,6 +117,7 @@ Canvas itself handles:
         mode(): Mode;
         cancel(): void;
         configure(configuration: Configuration): void;
+        isAbleToChangeFrame(): boolean;
     }
 ```
 
@@ -188,8 +189,7 @@ Standard JS events are used.
 
 |              | IDLE | GROUP | SPLIT | DRAW | MERGE | EDIT | DRAG | RESIZE | ZOOM_CANVAS | DRAG_CANVAS |
 |--------------|------|-------|-------|------|-------|------|------|--------|-------------|-------------|
-| html()       | +    | +     | +     | +    | +     | +    | +    | +      | +           | +           |
-| setup()      | +    | +     | +     | +    | +     | +/-  | +/-  | +/-    | +           | +           |
+| setup()      | +    | +     | +     | +/-  | +     | +/-  | +/-  | +/-    | +           | +           |
 | activate()   | +    | -     | -     | -    | -     | -    | -    | -      | -           | -           |
 | rotate()     | +    | +     | +     | +    | +     | +    | +    | +      | +           | +           |
 | focus()      | +    | +     | +     | +    | +     | +    | +    | +      | +           | +           |
@@ -208,3 +208,6 @@ Standard JS events are used.
 | setZLayer()  | +    | +     | +     | +    | +     | +    | +    | +      | +           | +           |
 
 You can call setup() during editing, dragging, and resizing only to update objects, not to change a frame.
+You can change frame during draw only when you do not redraw an existing object
+
+Other methods do not change state and can be used everytime.
diff --git a/cvat-canvas/package-lock.json b/cvat-canvas/package-lock.json
diff --git a/cvat-canvas/package.json b/cvat-canvas/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cvat-canvas",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "Part of Computer Vision Annotation Tool which presents its canvas library",
   "main": "src/canvas.ts",
   "scripts": {

diff --git a/cvat-canvas/src/scss/canvas.scss b/cvat-canvas/src/scss/canvas.scss
@@ -151,6 +151,25 @@ polyline.cvat_canvas_shape_splitting {
     cursor: move;
 }
 
+.cvat_canvas_first_poly_point {
+    fill: lightgray;
+}
+
+.cvat_canvas_poly_direction {
+    fill: lightgray;
+    stroke: black;
+
+    &:hover {
+        fill: black;
+        stroke: lightgray;
+    }
+
+    &:active {
+        fill: lightgray;
+        stroke: black;
+    }
+}
+
 #cvat_canvas_wrapper {
     width: calc(100% - 10px);
     height: calc(100% - 10px);

diff --git a/cvat-canvas/src/typescript/canvas.ts b/cvat-canvas/src/typescript/canvas.ts
@@ -58,6 +58,7 @@ interface Canvas {
     mode(): Mode;
     cancel(): void;
     configure(configuration: Configuration): void;
+    isAbleToChangeFrame(): boolean;
 }
 
 class CanvasImpl implements Canvas {
@@ -153,6 +154,10 @@ class CanvasImpl implements Canvas {
     public configure(configuration: Configuration): void {
         this.model.configure(configuration);
     }
+
+    public isAbleToChangeFrame(): boolean {
+        return this.model.isAbleToChangeFrame();
+    }
 }
 
 export {

diff --git a/cvat-canvas/src/typescript/canvasModel.ts b/cvat-canvas/src/typescript/canvasModel.ts
@@ -71,6 +71,7 @@ export interface DrawData {
         labels: number[];
         edges: Edge[];
     }
+    redraw?: number;
 }
 
 type Point2D = [number, number];
@@ -173,6 +174,7 @@ export interface CanvasModel {
     dragCanvas(enable: boolean): void;
     zoomCanvas(enable: boolean): void;
 
+    isAbleToChangeFrame(): boolean;
     configure(configuration: Configuration): void;
     cancel(): void;
 }
@@ -386,10 +388,17 @@ export class CanvasModelImpl extends MasterImpl implements CanvasModel {
         }
 
         if (this.data.mode !== Mode.IDLE && clientID !== null) {
-            // Exception or just return?
             throw Error(`Canvas is busy. Action: ${this.data.mode}`);
         }
 
+        if (typeof (clientID) === 'number') {
+            const [state] = this.data.objects
+                .filter((_state: any): boolean => _state.clientID === clientID);
+            if (!['rectangle', 'polygon', 'polyline', 'points', 'cuboid'].includes(state.shapeType)) {
+                return;
+            }
+        }
+
         this.data.activeElement = {
             clientID,
             attributeID,
@@ -469,10 +478,24 @@ export class CanvasModelImpl extends MasterImpl implements CanvasModel {
             }
         }
 
-        this.data.drawData = { ...drawData };
-        if (this.data.drawData.initialState) {
-            this.data.drawData.shapeType = this.data.drawData.initialState.shapeType;
+        if (typeof (drawData.redraw) === 'number') {
+            const clientID = drawData.redraw;
+            const [state] = this.data.objects
+                .filter((_state: any): boolean => _state.clientID === clientID);
+
+            if (state) {
+                this.data.drawData = { ...drawData };
+                this.data.drawData.shapeType = state.shapeType;
+            } else {
+                return;
+            }
+        } else {
+            this.data.drawData = { ...drawData };
+            if (this.data.drawData.initialState) {
+                this.data.drawData.shapeType = this.data.drawData.initialState.shapeType;
+            }
         }
+
         this.notify(UpdateReasons.DRAW);
     }
 
@@ -552,6 +575,13 @@ export class CanvasModelImpl extends MasterImpl implements CanvasModel {
         this.notify(UpdateReasons.CONFIG_UPDATED);
     }
 
+    public isAbleToChangeFrame(): boolean {
+        const isUnable = [Mode.DRAG, Mode.EDIT, Mode.RESIZE].includes(this.data.mode)
+            || (this.data.mode === Mode.DRAW && typeof (this.data.drawData.redraw) === 'number');
+
+        return !isUnable;
+    }
+
     public cancel(): void {
         this.notify(UpdateReasons.CANCEL);
     }