Merge 192297 "Files.app: Show a spinner on search."

> Files.app: Show a spinner on search.
> 
> When a search is started, shows a spinner at the center of the list view. And when the first chunk of results comes, hides the spinner.
> 
> BUG=225991
> TEST=manual
> 
> Review URL: https://chromiumcodereview.appspot.com/13544004

TBR=yoshiki@chromium.org
Review URL: https://codereview.chromium.org/13862002

git-svn-id: svn://svn.chromium.org/chrome/branches/1453/src@192966 0039d316-1c4b-4281-b951-d872f2087c98

4 files changed, 44 insertions, 26 deletions

diff --git a/chrome/browser/resources/file_manager/css/file_manager.css b/chrome/browser/resources/file_manager/css/file_manager.css
index 18c4717..29ead98 100644
--- a/chrome/browser/resources/file_manager/css/file_manager.css
+++ b/chrome/browser/resources/file_manager/css/file_manager.css
@@ -606,6 +606,12 @@ button#detail-view:not([disabled]) {
   padding-left: 26px;
 }
 
+#spinner-with-text[hidden] {
+  -webkit-transition: opacity 200ms ease-in;
+  display: block;
+  opacity: 0;
+}
+
 .downloads-warning {
   -webkit-box-align: center;
   -webkit-box-orient: horizontal;
diff --git a/chrome/browser/resources/file_manager/js/directory_contents.js b/chrome/browser/resources/file_manager/js/directory_contents.js
index c44ec30..6824b75 100644
--- a/chrome/browser/resources/file_manager/js/directory_contents.js
+++ b/chrome/browser/resources/file_manager/js/directory_contents.js
@@ -296,9 +296,10 @@ DirectoryContents.prototype.onNewEntries = function(entries) {
       return;
     this.fileList_.push.apply(this.fileList_, entriesFiltered);
 
-    if (this.pendingMetadataRequests_ === 0 && this.allChunksFetched_) {
+    if (this.pendingMetadataRequests_ === 0 && this.allChunksFetched_)
       cr.dispatchSimpleEvent(this, 'scan-completed');
-    }
+    else
+      cr.dispatchSimpleEvent(this, 'scan-updated');
 
     if (!this.allChunksFetched_)
       this.readNextChunk();
diff --git a/chrome/browser/resources/file_manager/js/directory_model.js b/chrome/browser/resources/file_manager/js/directory_model.js
index 3c95e59..d7da7e5 100644
--- a/chrome/browser/resources/file_manager/js/directory_model.js
+++ b/chrome/browser/resources/file_manager/js/directory_model.js
@@ -404,7 +404,7 @@ DirectoryModel.prototype.rescan = function() {
     cr.dispatchSimpleEvent(this, 'rescan-completed');
   }).bind(this);
 
-  this.scan_(dirContents, successCallback);
+  this.scan_(dirContents, successCallback, function() {});
 };
 
 /**
@@ -415,7 +415,7 @@ DirectoryModel.prototype.rescan = function() {
  *
  * @param {DirectoryContentes} newDirContents New DirectoryContents instance to
  *     replace currentDirContents_.
- * @param {function=} opt_callback Called on success.
+ * @param {function()=} opt_callback Called on success.
  * @private
  */
 DirectoryModel.prototype.clearAndScan_ = function(newDirContents,
@@ -439,11 +439,15 @@ DirectoryModel.prototype.clearAndScan_ = function(newDirContents,
       opt_callback();
   }.bind(this);
 
+  var onUpdated = function() {
+    cr.dispatchSimpleEvent(this, 'scan-updated');
+  }.bind(this);
+
   // Clear the table first.
   var fileList = this.getFileList();
   fileList.splice(0, fileList.length);
   cr.dispatchSimpleEvent(this, 'scan-started');
-  this.scan_(this.currentDirContents_, onDone);
+  this.scan_(this.currentDirContents_, onDone, onUpdated);
 };
 
 /**
@@ -452,10 +456,13 @@ DirectoryModel.prototype.clearAndScan_ = function(newDirContents,
  *
  * @param {DirectoryContents} dirContents DirectoryContents instance on which
  *     the scan will be run.
- * @param {function} successCallback Callback on success.
+ * @param {function()} successCallback Callback on success.
+ * @param {function()} updatedCallback Callback on update. Only on the last
+ *     update, {@code successCallback} is called instead of this.
  * @private
  */
-DirectoryModel.prototype.scan_ = function(dirContents, successCallback) {
+DirectoryModel.prototype.scan_ = function(
+    dirContents, successCallback, updatedCallback) {
   var self = this;
 
   /**
@@ -493,6 +500,7 @@ DirectoryModel.prototype.scan_ = function(dirContents, successCallback) {
   this.runningScan_ = dirContents;
 
   dirContents.addEventListener('scan-completed', onSuccess);
+  dirContents.addEventListener('scan-updated', updatedCallback);
   dirContents.addEventListener('scan-failed', onFailure);
   dirContents.addEventListener('scan-cancelled', this.dispatchEvent.bind(this));
   dirContents.scan();
@@ -590,7 +598,7 @@ DirectoryModel.prototype.findIndexByName_ = function(name) {
  * @param {Entry} entry Entry to rename.
  * @param {string} newName New name.
  * @param {function} errorCallback Called on error.
- * @param {function=} opt_successCallback Called on success.
+ * @param {function()=} opt_successCallback Called on success.
  */
 DirectoryModel.prototype.renameEntry = function(entry, newName,
                                                 errorCallback,
@@ -736,7 +744,8 @@ DirectoryModel.prototype.resolveDirectory = function(path, successCallback,
 
 /**
  * @param {DirectoryEntry} dirEntry The absolute path to the new directory.
- * @param {function=} opt_callback Executed if the directory loads successfully.
+ * @param {function()=} opt_callback Executed if the directory loads
+ *     successfully.
  * @private
  */
 DirectoryModel.prototype.changeDirectoryEntrySilent_ = function(dirEntry,
@@ -763,7 +772,8 @@ DirectoryModel.prototype.changeDirectoryEntrySilent_ = function(dirEntry,
  * @param {boolean} initial True if it comes from setupPath and
  *                          false if caused by an user action.
  * @param {DirectoryEntry} dirEntry The absolute path to the new directory.
- * @param {function=} opt_callback Executed if the directory loads successfully.
+ * @param {function()=} opt_callback Executed if the directory loads
+ *     successfully.
  * @private
  */
 DirectoryModel.prototype.changeDirectoryEntry_ = function(initial, dirEntry,
@@ -831,11 +841,11 @@ DirectoryModel.prototype.createDirectoryChangeTracker = function() {
  * file or directory).
  *
  * @param {string} path The root path to use.
- * @param {function=} opt_pathResolveCallback Invoked as soon as the path has
- *     been resolved, and called with the base and leaf portions of the path
- *     name, and a flag indicating if the entry exists. Will be called even
- *     if another directory change happened while setupPath was in progress,
- *     but will pass |false| as |exist| parameter.
+ * @param {function(string, string, boolean)=} opt_pathResolveCallback Invoked
+ *     as soon as the path has been resolved, and called with the base and leaf
+ *     portions of the path name, and a flag indicating if the entry exists.
+ *     Will be called even if another directory change happened while setupPath
+ *     was in progress, but will pass |false| as |exist| parameter.
  */
 DirectoryModel.prototype.setupPath = function(path, opt_pathResolveCallback) {
   var tracker = this.createDirectoryChangeTracker();
diff --git a/chrome/browser/resources/file_manager/js/file_manager.js b/chrome/browser/resources/file_manager/js/file_manager.js
index e499f2f..2f8b509 100644
--- a/chrome/browser/resources/file_manager/js/file_manager.js
+++ b/chrome/browser/resources/file_manager/js/file_manager.js
@@ -433,8 +433,9 @@ DialogType.isModal = function(type) {
       self.currentList_.endBatchUpdates();
     });
     dm.addEventListener('scan-started', this.onScanStarted_.bind(this));
-    dm.addEventListener('scan-completed', this.showSpinner_.bind(this, false));
+    dm.addEventListener('scan-completed', this.hideSpinnerLater_.bind(this));
     dm.addEventListener('scan-cancelled', this.hideSpinnerLater_.bind(this));
+    dm.addEventListener('scan-updated', this.hideSpinnerLater_.bind(this));
     dm.addEventListener('scan-completed',
                         this.refreshCurrentDirectoryMetadata_.bind(this));
     dm.addEventListener('rescan-completed',
@@ -799,10 +800,12 @@ DialogType.isModal = function(type) {
     // mouse-clicked.
     autocompleteList.handleEnterKeydown = function(event) {
       this.openAutocompleteSuggestion_();
+      this.lastQuery_ = '';
       this.autocompleteList_.suggestions = [];
     }.bind(this);
     autocompleteList.addEventListener('mousedown', function(event) {
       this.openAutocompleteSuggestion_();
+      this.lastQuery_ = '';
       this.autocompleteList_.suggestions = [];
     }.bind(this));
     autocompleteList.addEventListener('mouseover', function(event) {
@@ -2342,8 +2345,7 @@ DialogType.isModal = function(type) {
    */
   FileManager.prototype.hideSpinnerLater_ = function() {
     this.cancelSpinnerTimeout_();
-    this.showSpinnerTimeout_ =
-        setTimeout(this.showSpinner_.bind(this, false), 100);
+    this.showSpinner_(false);
   };
 
   /**
@@ -2351,15 +2353,14 @@ DialogType.isModal = function(type) {
    * @private
    */
   FileManager.prototype.showSpinner_ = function(on) {
-    if (on && this.directoryModel_ && this.directoryModel_.isScanning()) {
-      if (this.directoryModel_.isSearching())
-        this.spinner_.style.display = 'none';
-      else
-        this.spinner_.style.display = '';
-    }
+    if (on && this.directoryModel_ && this.directoryModel_.isScanning())
+      this.spinner_.hidden = false;
 
-    if (!on && (!this.directoryModel_ || !this.directoryModel_.isScanning()))
-      this.spinner_.style.display = 'none';
+    if (!on && (!this.directoryModel_ ||
+                !this.directoryModel_.isScanning() ||
+                this.directoryModel_.getFileList().length != 0)) {
+      this.spinner_.hidden = true;
+    }
   };
 
   FileManager.prototype.createNewFolder = function() {