Canvas failing and chunk loading status (#1306)

* fixed canvas failing * loading animation with play mode * Fixed reuire has no await * fixed exception handling
cvat-ai · Mar 27, 2020 · eac9a1b · eac9a1b
1 parent cb268ee
commit eac9a1b
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 16 deletions.
diff --git a/cvat-core/src/frames.js b/cvat-core/src/frames.js
@@ -457,8 +457,8 @@
                 } catch (error) {
                     if (typeof (error) === 'number' && error in this._requestedChunks) {
                         this._activeFillBufferRequest = false;
-                        throw error;
                     }
+                    throw error;
                 }
             }
         }
@@ -491,18 +491,16 @@
                     && cachedFrames.length < (this._size * 3) / 4) {
                     const maxFrame = cachedFrames ? Math.max(...cachedFrames) : frameNumber;
                     if (maxFrame < this._stopFrame) {
-                        this.makeFillRequest(maxFrame + 1, frameStep);
+                        this.makeFillRequest(maxFrame + 1, frameStep).catch((e) => {
+                            if (e !== 'not needed') {
+                                throw e;
+                            }
+                        });
                     }
                 }
             } else if (fillBuffer) {
                 this.clear();
-                try {
-                    await this.makeFillRequest(frameNumber, frameStep, fillBuffer ? null : 1);
-                } catch (error) {
-                    if (error !== 'not needed') {
-                        throw error;
-                    }
-                }
+                await this.makeFillRequest(frameNumber, frameStep, fillBuffer ? null : 1);
 
                 frame = this._buffer[frameNumber];
             } else {

diff --git a/cvat-ui/src/actions/annotation-actions.ts b/cvat-ui/src/actions/annotation-actions.ts
@@ -736,13 +736,15 @@ ThunkAction<Promise<void>, {}, {}, AnyAction> {
                 },
             });
         } catch (error) {
-            dispatch({
-                type: AnnotationActionTypes.CHANGE_FRAME_FAILED,
-                payload: {
-                    number: toFrame,
-                    error,
-                },
-            });
+            if (error !== 'not needed') {
+                dispatch({
+                    type: AnnotationActionTypes.CHANGE_FRAME_FAILED,
+                    payload: {
+                        number: toFrame,
+                        error,
+                    },
+                });
+            }
         }
     };
 }

diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/canvas-wrapper.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/canvas-wrapper.tsx
@@ -36,6 +36,7 @@ interface Props {
     annotations: any[];
     frameData: any;
     frameAngle: number;
+    frameFetching: boolean;
     frame: number;
     opacity: number;
     colorBy: ColorBy;
@@ -125,6 +126,7 @@ export default class CanvasWrapperComponent extends React.PureComponent<Props> {
             contrastLevel,
             saturationLevel,
             workspace,
+            frameFetching,
         } = this.props;
 
         if (prevProps.sidebarCollapsed !== sidebarCollapsed) {
@@ -199,6 +201,15 @@ export default class CanvasWrapperComponent extends React.PureComponent<Props> {
             canvasInstance.rotate(frameAngle);
         }
 
+        const loadingAnimation = window.document.getElementById('cvat_canvas_loading_animation');
+        if (loadingAnimation && frameFetching !== prevProps.frameFetching) {
+            if (frameFetching) {
+                loadingAnimation.classList.remove('cvat_canvas_hidden');
+            } else {
+                loadingAnimation.classList.add('cvat_canvas_hidden');
+            }
+        }
+
         this.activateOnCanvas();
     }
 

diff --git a/cvat-ui/src/containers/annotation-page/standard-workspace/canvas-wrapper.tsx b/cvat-ui/src/containers/annotation-page/standard-workspace/canvas-wrapper.tsx
@@ -55,6 +55,7 @@ interface StateToProps {
     annotations: any[];
     frameData: any;
     frameAngle: number;
+    frameFetching: boolean;
     frame: number;
     opacity: number;
     colorBy: ColorBy;
@@ -129,6 +130,7 @@ function mapStateToProps(state: CombinedState): StateToProps {
                 frame: {
                     data: frameData,
                     number: frame,
+                    fetching: frameFetching,
                 },
                 frameAngles,
             },
@@ -175,6 +177,7 @@ function mapStateToProps(state: CombinedState): StateToProps {
         jobInstance,
         frameData,
         frameAngle: frameAngles[frame - jobInstance.startFrame],
+        frameFetching,
         frame,
         activatedStateID,
         activatedAttributeID,