[filebrowser] Save sorting field/order for modal dialogs, show spinner when scanning directories.

chrome/browser/resources/file_manager/js/file_manager.js

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 // Setting the src of an img to an empty string can crash the browser, so we
 // use an empty 1x1 gif instead.
 const EMPTY_IMAGE_URI = 'data:image/gif;base64,'
         + 'R0lGODlhAQABAPABAP///wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw%3D%3D';
 
 /**
@@ skipping 478 matching lines @@
 
     this.copyManager_ = new FileCopyManager();
     this.copyManager_.addEventListener('copy-progress',
                                        this.onCopyProgress_.bind(this));
 
     window.addEventListener('popstate', this.onPopState_.bind(this));
     window.addEventListener('unload', this.onUnload_.bind(this));
 
     this.directoryModel_.addEventListener('directory-changed',
                                           this.onDirectoryChanged_.bind(this));
+    this.directoryModel_.addEventListener('scan-started',
+                                          this.showSpinner_.bind(this, true));
+    this.directoryModel_.addEventListener('scan-completed',
+                                          this.showSpinner_.bind(this, false));
     this.addEventListener('selection-summarized',
                           this.onSelectionSummarized_.bind(this));
 
     // The list of archives requested to mount. We will show contents once
     // archive is mounted, but only for mounts from within this filebrowser tab.
     this.mountRequests_ = [];
     this.unmountRequests_ = [];
     chrome.fileBrowserPrivate.onMountCompleted.addListener(
         this.onMountCompleted_.bind(this));
 
     chrome.fileBrowserPrivate.onFileChanged.addListener(
         this.onFileChanged_.bind(this));
 
     var self = this;
 
     // The list of callbacks to be invoked during the directory rescan after
     // all paste tasks are complete.
     this.pasteSuccessCallbacks_ = [];
 
     this.setupCurrentDirectory_();
 
     this.summarizeSelection_();
 
-    this.directoryModel_.fileList.sort('cachedMtime_', 'desc');
+    var sortField = 'cachedMtime_';
+    var sortDirection = 'desc';
+    if (FileManager.DialogType.isModal(this.dialogType_)) {
+      sortField =
+          window.localStorage['sort-field-' + this.dialogType_] ||
+          sortField;
+      sortDirection =
+          window.localStorage['sort-direction-' + this.dialogType_] ||
+          sortDirection;
+    }
+    this.directoryModel_.fileList.sort(sortField, sortDirection);
 
     this.refocus();
 
     this.createMetadataProvider_();
 
     this.table_.list.endBatchUpdates();
     this.grid_.endBatchUpdates();
 
     metrics.recordInterval('Load.DOM');
     metrics.recordInterval('Load.Total');
@@ skipping 40 matching lines @@
     this.previewPanel_ = this.dialogDom_.querySelector('.preview-panel');
     this.previewFilename_ = this.dialogDom_.querySelector('.preview-filename');
     this.previewSummary_ = this.dialogDom_.querySelector('.preview-summary');
     this.filenameInput_ = this.dialogDom_.querySelector('.filename-input');
     this.taskItems_ = this.dialogDom_.querySelector('.tasks');
     this.okButton_ = this.dialogDom_.querySelector('.ok');
     this.cancelButton_ = this.dialogDom_.querySelector('.cancel');
     this.deleteButton_ = this.dialogDom_.querySelector('.delete-button');
     this.table_ = this.dialogDom_.querySelector('.detail-table');
     this.grid_ = this.dialogDom_.querySelector('.thumbnail-grid');
+    this.spinner_ = this.dialogDom_.querySelector('.spinner');
+    this.showSpinner_(false);
 
     cr.ui.Table.decorate(this.table_);
     cr.ui.Grid.decorate(this.grid_);
 
     this.downloadsWarning_ =
         this.dialogDom_.querySelector('.downloads-warning');
     var html = util.htmlUnescape(str('DOWNLOADS_DIRECTORY_WARNING'));
     this.downloadsWarning_.lastElementChild.innerHTML = html;
     var link = this.downloadsWarning_.querySelector('a');
     link.addEventListener('click', this.onDownloadsWarningClick_.bind(this));
@@ skipping 73 matching lines @@
     });
     dataModel.setCompareFunction('cachedMtime_',
                                  this.compareMtime_.bind(this));
     dataModel.setCompareFunction('cachedSize_',
                                  this.compareSize_.bind(this));
     dataModel.setCompareFunction('type',
                                  this.compareType_.bind(this));
 
     dataModel.addEventListener('splice',
                                this.onDataModelSplice_.bind(this));
+    dataModel.addEventListener('permuted',
+                               this.onDataModelPermuted_.bind(this));
 
     this.directoryModel_.fileListSelection.addEventListener(
         'change', this.onSelectionChanged_.bind(this));
 
     this.directoryModel_.autoSelectIndex =
         this.dialogType_ == FileManager.DialogType.SELECT_SAVEAS_FILE ? -1 : 0;
 
     // TODO(serya): temporary solution.
     this.directoryModel_.cacheEntryDate = cacheEntryDate;
     this.directoryModel_.cacheEntrySize = cacheEntrySize;
@@ skipping 104 matching lines @@
     if (successCallback)
       setTimeout(function() { successCallback(entry) }, 0);
   };
 
   FileManager.prototype.onDataModelSplice_ = function(event) {
     var checkbox = this.document_.querySelector('#select-all-checkbox');
     if (checkbox)
       this.updateSelectAllCheckboxState_(checkbox);
   };
 
+  FileManager.prototype.onDataModelPermuted_ = function(event) {
+    if (FileManager.DialogType.isModal(this.dialogType_)) {
+      var sortStatus = this.directoryModel_.fileList.sortStatus;
+      window.localStorage['sort-field-' + this.dialogType_] = sortStatus.field;
+      window.localStorage['sort-direction-' + this.dialogType_] =
+          sortStatus.direction;
+    }
+  };
+
   /**
    * Get the file type of the entry, caching the result.
    *
    * When this method completes, the entry object will get a
    * 'cachedIconType_' property (if it doesn't already have one) containing the
    * icon type of the file as a string.
    *
    * @param {Entry} entry An HTML5 Entry object.
    * @param {function(Entry)} successCallback The function to invoke once the
    *     file size is known.
@@ skipping 2320 matching lines @@
   FileManager.prototype.onToggleSidebar_ = function(event) {
     if (this.dialogContainer_.hasAttribute('sidebar')) {
       this.dialogContainer_.removeAttribute('sidebar');
     } else {
       this.dialogContainer_.setAttribute('sidebar', 'sidebar');
     }
     // TODO(dgozman): make table header css-resizable.
     setTimeout(this.onResize_.bind(this), 300);
   };
 
+  FileManager.prototype.showSpinner_ = function(on) {
+    this.spinner_.style.display = on ? '' : 'none';
+  };
+
   FileManager.prototype.onNewFolderCommand_ = function(event) {
     var self = this;
 
     function onNameSelected(name) {
       var valid = self.validateFileName_(name, function() {
         promptForName(name);
       });
 
       if (!valid) {
         // Validation failed.  User will be prompted for a new name after they
@@ skipping 412 matching lines @@
           });
       }, onError);
 
       function onError(err) {
         console.log('Error while checking free space: ' + err);
         setTimeout(doCheck, 1000 * 60);
       }
     }
   }
 })();