MD History: Implement search functionality.

chrome/browser/resources/md_history/history_card_manager.js

Index: chrome/browser/resources/md_history/history_card_manager.js
diff --git a/chrome/browser/resources/md_history/history_card_manager.js b/chrome/browser/resources/md_history/history_card_manager.js
index 6844515fc8ce23f55f008b3a95b2e296ce5c8484..1dbc668d39331b5e50f47f1be6a896e658141142 100644
--- a/chrome/browser/resources/md_history/history_card_manager.js
+++ b/chrome/browser/resources/md_history/history_card_manager.js
@@ -28,6 +28,17 @@ Polymer({
     menuIdentifier: {
       type: Number,
       value: 0
+    },
+
+    searchTerm: {
+      type: String,
+      value: ''
+    },
+
+    // Page waits until results have finished loading before displaying message.
+    loading_: {
+      type: Boolean,

[tsergeant, 2016/02/09 04:28:53]

Should loading_ be true to start with while initial results are loaded in?

[hsampson, 2016/02/11 02:46:26]

Yes it should. Now when the page loads this is set to be true until the results
are properly set.

+      value: false
     }
   },
 
@@ -47,6 +58,16 @@ Polymer({
   },
 
   /**
+   * Clear the page completely so the page can display new results (search).
+   */
+  resetHistoryResults: function() {
+    // TODO(hsampson): make it so the old results aren't replaced immediately,
+    // only replaced when new results come in.
+    this.loading_ = true;
+    this.splice('historyDataByDay_', 0, this.historyDataByDay_.length);
+  },
+
+  /**
    * Opens the overflow menu unless the menu is already open and the same button
    * is pressed.
    * @param {Event} e The event with details of the menu item that was clicked.
@@ -73,37 +94,49 @@ Polymer({
    * Split the newly updated history results into history items sorted via day
    * accessed.
    * @param {!Array<!HistoryEntry>} results The new history results.
+   * @param {string} search The search term used for chrome.send.
    */
-  addNewResults: function(results) {
-    if (results.length == 0)
+  addNewResults: function(results, search) {
+    this.searchTerm = search;
+
+    if (results.length == 0) {
+      this.loading_ = false;
       return;
+    }
 
     var dateSortedData = [];
     var historyItems = [];
-    var currentDate = results[0].dateRelativeDay;
+    var currentCardTitle = search == '' ? results[0].dateRelativeDay : search;
 
     for (var i = 0; i < results.length; i++) {
-      if (!currentDate)
+      if (!currentCardTitle)
         continue;
 
+      results[i].cardTitle = search == '' ? results[i].dateRelativeDay : search;
+      results[i].visibleTimestamp =
+          search == '' ? results[i].dateTimeOfDay : results[i].dateShort;
       results[i].selected = false;
-      if (results[i].dateRelativeDay != currentDate) {
-        this.appendHistoryData_(currentDate, historyItems);
-        currentDate = results[i].dateRelativeDay;
+
+      if (results[i].cardTitle != currentCardTitle) {
+        this.appendHistoryData_(currentCardTitle, historyItems);
+        currentCardTitle = results[i].cardTitle;
         historyItems = [];
       }
       historyItems.push(results[i]);
     }
 
-    if (currentDate)
-      this.appendHistoryData_(currentDate, historyItems);
+    if (currentCardTitle)
+      this.appendHistoryData_(currentCardTitle, historyItems);
 
     this.lastVisitedTime = historyItems[historyItems.length - 1].time;
+    this.loading_ = false;
+    Polymer.dom.flush();

[tsergeant, 2016/02/09 04:28:53]

Why is this here?

[hsampson, 2016/02/11 02:46:26]

Unnecessary now.

   },
 
   /**
    * Cycle through each entry in historyDataByDay_ and set all items to be
    * unselected.
+   * @param {number} overallItemCount The number of selected items.
    */
   unselectAllItems: function(overallItemCount) {
     var historyCardData = this.historyDataByDay_;
@@ -124,20 +157,21 @@ Polymer({
 
   /**
    * Adds the given items into historyDataByDay_. Adds items to the last
-   * existing day if the date matches, creates a new element otherwise.
-   * @param {string} date The date of the history items.
+   * existing day if the cardTitle matches, creates a new element otherwise.
+   * @param {string} cardTitle The cardTitle for this list of history items.
    * @param {!Array<!HistoryEntry>} historyItems The list of history items for
-   * the current date.
+   * the current card.
    * @private
    */
-  appendHistoryData_: function(date, historyItems) {
+  appendHistoryData_: function(cardTitle, historyItems) {
     var lastDay = this.historyDataByDay_.length - 1;
-    if (lastDay > 0 && date == this.historyDataByDay_[lastDay].date) {
+    if (lastDay >= 0 &&
+        cardTitle == this.historyDataByDay_[lastDay].cardTitle) {
       this.set('historyDataByDay_.' + lastDay + '.historyItems',
           this.historyDataByDay_[lastDay].historyItems.concat(historyItems));
     } else {
       this.push('historyDataByDay_', {
-        date: date,
+        cardTitle: cardTitle,
         historyItems: historyItems
       });
     }
@@ -155,11 +189,47 @@ Polymer({
     // of the window.
     var scrollOffset = 10;
     var scrollElem = this.$['infinite-list'];
-
-    if (scrollElem.scrollHeight <=
-        scrollElem.scrollTop + scrollElem.clientHeight + scrollOffset) {
+    if (!this.loading_ && scrollElem.scrollHeight <=
+         scrollElem.scrollTop + scrollElem.clientHeight + scrollOffset) {
       chrome.send('queryHistory',
-          ['', 0, 0, this.lastVisitedTime, RESULTS_PER_PAGE]);
+          [this.searchTerm, 0, 0, this.lastVisitedTime, RESULTS_PER_PAGE]);
     }
+  },
+
+  /**
+   * True if there are no results available and the page has finished loading.
+   * @param {number} numberOfResults The length of historyDataByDay_.
+   * @param {boolean} loading Whether the page has finished loading results.
+   * @return {boolean} Whether there are results to show.
+   * @private
+   */
+  noResultsAvailable_: function(numberOfResults, loading) {
+    return numberOfResults == 0 && !loading;
+  },
+
+  /**
+   * True if there are results available or the page hasn't finished loading, or
+   * the results being returned are part of a search.
+   * @param {number} numberOfResults The length of historyDataByDay_.
+   * @param {boolean} loading Whether the page has finished loading results.
+   * @param {string} search The search term associated with these results.
+   * @return {boolean} Whether the "noResults" message should be shown.
+   * @private
+   */
+  resultsAvailable_: function(numberOfResults, loading, search) {
+    return !this.noResultsAvailable_(numberOfResults, loading) || search != '';
+  },
+
+  /**
+   * True if there are results available or the page hasn't finished loading, or
+   * the results being returned are not part of a search.
+   * @param {number} numberOfResults The length of historyDataByDay_.
+   * @param {boolean} loading Whether the page has finished loading results.
+   * @param {string} search The search term associated with these results.
+   * @return {boolean} Whether the "noSearchResults" message should be shown.
+   * @private
+   */
+  noSearch_: function(numberOfResults, loading, search) {
+    return !this.noResultsAvailable_(numberOfResults, loading) || search == '';
   }
 });