downloads: add "No downloads" and "No search results" messages.

chrome/browser/resources/downloads/downloads.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.
 
 // TODO(jhawkins): Use hidden instead of showInline* and display:none.
 
 /**
  * The type of the download object. The definition is based on
  * chrome/browser/ui/webui/downloads_dom_handler.cc:CreateDownloadItemValue()
  * @typedef {{by_ext_id: (string|undefined),
@@ skipping 71 matching lines @@
  * Class to hold all the information about the visible downloads.
  * @constructor
  */
 function Downloads() {
   /**
    * @type {!Object.<string, Download>}
    * @private
    */
   this.downloads_ = {};
   this.node_ = $('downloads-display');
+  this.noDownloadsOrResults_ = $('no-downloads-or-results');
   this.summary_ = $('downloads-summary-text');
   this.searchText_ = '';
 
   // Keep track of the dates of the newest and oldest downloads so that we
   // know where to insert them.
   this.newestTime_ = -1;
 
   // Icon load request queue.
   this.iconLoadQueue_ = [];
   this.isIconLoading_ = false;
 
   this.progressForeground1_ = new Image();
   this.progressForeground1_.src =
     'chrome://theme/IDR_DOWNLOAD_PROGRESS_FOREGROUND_32@1x';
   this.progressForeground2_ = new Image();
   this.progressForeground2_.src =
     'chrome://theme/IDR_DOWNLOAD_PROGRESS_FOREGROUND_32@2x';
 
   window.addEventListener('keydown', this.onKeyDown_.bind(this));
+
+  this.onDownloadListChanged_();
 }
 
 /**
  * Called when a download has been updated or added.
  * @param {BackendDownloadObject} download A backend download object
  */
 Downloads.prototype.updated = function(download) {
   var id = download.id;
   if (!!this.downloads_[id]) {
     this.downloads_[id].update(download);
   } else {
     this.downloads_[id] = new Download(download);
     // We get downloads in display order, so we don't have to worry about
     // maintaining correct order - we can assume that any downloads not in
     // display order are new ones and so we can add them to the top of the
     // list.
     if (download.started > this.newestTime_) {
       this.node_.insertBefore(this.downloads_[id].node, this.node_.firstChild);
       this.newestTime_ = download.started;
     } else {
       this.node_.appendChild(this.downloads_[id].node);
     }
   }
   // Download.prototype.update may change its nodeSince_ and nodeDate_, so
   // update all the date displays.
   // TODO(benjhayden) Only do this if its nodeSince_ or nodeDate_ actually did
   // change since this may touch 150 elements and Downloads.prototype.updated
   // may be called 150 times.
-  this.updateDateDisplay_();
+  this.onDownloadListChanged_();
 };
 
 /**
  * Set our display search text.
  * @param {string} searchText The string we're searching for.
  */
 Downloads.prototype.setSearchText = function(searchText) {
   this.searchText_ = searchText;
 };
 
 /**
  * Update the summary block above the results
  */
 Downloads.prototype.updateSummary = function() {
   if (this.searchText_) {
     this.summary_.textContent = loadTimeData.getStringF('searchresultsfor',
                                                         this.searchText_);
   } else {
     this.summary_.textContent = '';
   }
-
-  var hasDownloads = false;
-  for (var i in this.downloads_) {
-    hasDownloads = true;
-    break;
-  }
 };
 
 /**
  * Returns the number of downloads in the model. Used by tests.
  * @return {number} Returns the number of downloads shown on the page.
  */
 Downloads.prototype.size = function() {
   return Object.keys(this.downloads_).length;
 };
 
 /**
- * Update the date visibility in our nodes so that no date is
- * repeated.
+ * Called whenever the downloads lists items have changed (either by being
+ * updated, added, or removed).
  * @private
  */
-Downloads.prototype.updateDateDisplay_ = function() {
+Downloads.prototype.onDownloadListChanged_ = function() {
+  // Update the date visibility in our nodes so that no date is repeated.
   var dateContainers = document.getElementsByClassName('date-container');
   var displayed = {};
   for (var i = 0, container; container = dateContainers[i]; i++) {
     var dateString = container.getElementsByClassName('date')[0].innerHTML;
     if (!!displayed[dateString]) {
       container.style.display = 'none';
     } else {
       displayed[dateString] = true;
       container.style.display = 'block';
     }
   }
+
+  this.noDownloadsOrResults_.textContent = loadTimeData.getString(
+      this.searchText_ ? 'no_search_results' : 'no_downloads');
+
+  var hasDownloads = this.size() > 0;
+  this.node_.hidden = !hasDownloads;
+  this.noDownloadsOrResults_.hidden = hasDownloads;
 };
 
 /**
  * Remove a download.
  * @param {string} id The id of the download to remove.
  */
 Downloads.prototype.remove = function(id) {
   this.node_.removeChild(this.downloads_[id].node);
   delete this.downloads_[id];
-  this.updateDateDisplay_();
+  this.onDownloadListChanged_();
 };
 
 /**
  * Clear all downloads and reset us back to a null state.
  */
 Downloads.prototype.clear = function() {
   for (var id in this.downloads_) {
     this.downloads_[id].clear();
     this.remove(id);
   }
@@ skipping 764 matching lines @@
     if (Date.now() - start > 50) {
       clearTimeout(resultsTimeout);
       resultsTimeout = setTimeout(tryDownloadUpdatedPeriodically, 5);
       break;
     }
   }
 }
 
 // Add handlers to HTML elements.
 window.addEventListener('DOMContentLoaded', load);