Merge pull request #46 from opencv/change_frame_optimization_1.5-2x

Performance of frame changing has been increased due to UI containers…
cvat-ai · Sep 10, 2018 · 89cb5eb · 89cb5eb
2 parents 4c3046c + a6db3a4
commit 89cb5eb
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 7 deletions.
diff --git a/cvat/apps/engine/static/engine/base.css b/cvat/apps/engine/static/engine/base.css
@@ -98,8 +98,9 @@ html {
  border: none;
  outline: none;
  cursor: pointer;
- padding: 14px 16px;
+ padding: 3px 0px;
  transition: 0.3s;
+
 }
 
 .tab button:hover {

diff --git a/cvat/apps/engine/static/engine/js/shapeCollection.js b/cvat/apps/engine/static/engine/js/shapeCollection.js
@@ -1247,8 +1247,17 @@ class ShapeCollectionView {
  view.erase();
  }
 
- this._currentViews = [];
+ // Save parents and detach elements from DOM
+ // in order to increase performance in the buildShapeView function
+ let parents = {
+ uis: this._UIContent.parent(),
+ shapes: this._frameContent.node.parentNode
+ }
+
+ this._frameContent.node.parent = null;
+ this._UIContent.detach();
 
+ this._currentViews = [];
  for (let shape of collection.currentShapes) {
  let model = shape.model;
  let view = buildShapeView(model, buildShapeController(model), this._frameContent, this._UIContent);
@@ -1259,6 +1268,10 @@ class ShapeCollectionView {
  view.subscribe(this);
  this._labelsContent.find(`.labelContentElement[label_id="${model.label}"]`).removeClass('hidden');
  }
+
+ parents.shapes.append(this._frameContent.node);
+ parents.uis.prepend(this._UIContent);
+
  ShapeCollectionView.sortByZOrder();
  }
 

diff --git a/cvat/apps/engine/static/engine/stylesheet.css b/cvat/apps/engine/static/engine/stylesheet.css
@@ -356,6 +356,9 @@
 .customizedTab {
  border-radius: 5px 5px 0px 0px;
  width: 100%;
+ width: 15%;
+ float: left;
+ margin: 0px 10px;
 }
 
 /* ----------------------- IDs ----------------------- */
@@ -392,7 +395,9 @@
 }
 
 #uiContent, #trackManagement, #aamMenu, #labelsContent {
- border: 1px black solid;
+ border-bottom: 1px solid black;
+ border-right: 1px solid black;
+ border-left: 1px solid black;
  border-radius: 5px;
  box-shadow: 0 0 5px rgba(0,0,0,0.5);
  background-color: #B0C4DE;

diff --git a/cvat/apps/engine/templates/engine/annotation.html b/cvat/apps/engine/templates/engine/annotation.html
@@ -375,11 +375,12 @@
  </div>
 </div>
 
+
+<div class="tab customizedTab">
+ <button class="h2 regular activeTabButton" id="sidePanelObjectsButton" style="width: 50%">Objects</button>
+ <button class="h2 regular" id="sidePanelLabelsButton" style="width: 50%">Labels</button>
+</div>
 <div id="taskAnnotationRightPanel">
- <div class="tab customizedTab">
- <button class="h2 regular activeTabButton" id="sidePanelObjectsButton" style="width: 50%">Objects</button>
- <button class="h2 regular" id="sidePanelLabelsButton" style="width: 50%">Labels</button>
- </div>
  <div id="uiContent"> </div>
  <div id="labelsContent" class="hidden"> </div>
  <div id="trackManagement">