AMBARI-8953 Views: Files, reduce UI memory consumption (alexantonenko)

contrib/views/files/src/main/resources/ui/app/components/popoverDelete.js

@@ -18,6 +18,26 @@
 
 var App = require('app');
 
+Em.BsPopoverComponent.reopen({
+  willClearRender:function () {
+    var triggers = this.triggers.split(' ');
+
+      for (var i = triggers.length; i--;) {
+          var trigger = triggers[i];
+
+          if (trigger == 'click') {
+              this.$element.off('click');
+          } else if (trigger != 'manual') {
+              var eventIn  = trigger == 'hover' ? 'mouseenter' : 'focus';
+              var eventOut = trigger == 'hover' ? 'mouseleave' : 'blur';
+
+              this.$element.off(eventIn);
+              this.$element.off(eventOut);
+          }
+      }
+  }
+});
+
 App.PopoverDeleteComponent = Em.Component.extend({
   popover:Em.computed.alias('childViews.firstObject'),
   layoutName:'components/deletePopover',

contrib/views/files/src/main/resources/ui/app/components/toggleContext.js

@@ -50,7 +50,8 @@ App.ToggleContextComponent = Em.Component.extend({
     }
   },
   willClearRender:function () {
-    this.$().parents('.file-row').off('click');
-    this.$().parents('.file-row').off('.context.data-api').removeData('context');
+    var fileRow = this.$().parents('tr');
+    fileRow.off('click');
+    fileRow.data('context').destroy();
   }
 });

contrib/views/files/src/main/resources/ui/app/controllers/chmodModal.js

@@ -43,6 +43,7 @@ App.ChmodModalController = Em.ObjectController.extend({
   otrW:_permissionsProp(8, 'w').property('permissions'),
   otrE:_permissionsProp(9, 'x').property('permissions'),
   replaceAt:function (index,p) {
-    return this.get('permissions').substr(0, index) + p + perm.substr(index + p.length);;
+    var perm = this.get('permissions');
+    return perm.substr(0, index) + p + perm.substr(index + p.length);
   }
 });

contrib/views/files/src/main/resources/ui/app/routes/file.js

@@ -86,17 +86,18 @@ App.FilesRoute = Em.Route.extend({
   },
   model:function (params) {
     var path = (Em.isEmpty(params.path))?'/':params.path;
-    return this.store.listdir(path);
+    var model = this.store.listdir(path);
+    this.set('prevModel',model);
+    return model;
   },
-  afterModel:function (model) {
-    this.store.filter('file',function(file) {
-      if (!model.contains(file)) {
-        return true;
-      }
-    }).then(function (files) {
-      files.forEach(function (file) {
-        file.store.unloadRecord(file);
+  prevModel:null,
+  beforeModel:function () {
+    if (this.get('prevModel.isPending')) {
+      this.get('prevModel').then(function (files) {
+        files.forEach(function (file) {
+          file.store.unloadRecord(file);
+        });
       });
-    });
+    }
   }
 });

contrib/views/files/src/main/resources/ui/app/styles/application.less

@@ -157,9 +157,9 @@
       }
       .fa-spin {
         -webkit-animation: spin 0.7s infinite linear;
-        -moz-animation: spin 2s infinite linear;
-        -o-animation: spin 2s infinite linear;
-        animation: spin 2s infinite linear;
+        -moz-animation: spin 0.7s infinite linear;
+        -o-animation: spin 0.7s infinite linear;
+        animation: spin 0.7s infinite linear;
       }
       .chmod-row {
         &:hover > td {
@@ -381,4 +381,4 @@
 .modal-backdrop.in {
   filter: alpha(opacity=0);
   opacity: 0;
-}
+}

contrib/views/files/src/main/resources/ui/app/templates/util/fileRow.hbs

@@ -16,7 +16,6 @@
    limitations under the License.
 }}
 
-<tr {{bind-attr class=":file-row isMoving:isMoving"}}>
   <td>
     {{#if content.isDirectory}}
     <i class="fa fa-folder"></i>
@@ -69,7 +68,7 @@
         <li>{{popover-delete confirm="deleteFile"}}</li>
       </ul>
     {{/unless}}
-    </td>
+  </td>
   <td>
   {{#if isMoving}}
     <a href="#" {{action 'moveFile' 'cancel' target="parentController" }} data-toggle="tooltip" data-placement="bottom" title="Cancel moving"> <i class="fa fa-times fa-lg"></i></a>
@@ -78,4 +77,3 @@
   {{/if}}
   {{toggle-context}}
   </td>
-</tr>

contrib/views/files/src/main/resources/ui/app/views/file.js

@@ -23,6 +23,10 @@ Em.CloakedView.reopen({
   classNameBindings:['_containedView.controller.isMoving:isMoving']
 });
 
+Ember.CloakedView.reopen({
+  cloak:Em.K
+});
+
 App.FileView = Em.View.extend({
   templateName: 'util/fileRow',
   tagName:'tr'