MD History: Implement search functionality.

chrome/browser/resources/md_history/history_card_manager.js

 // Copyright 2015 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.
 
 Polymer({
   is: 'history-card-manager',
 
   properties: {
     // An array of objects sorted in reverse chronological order.
     // Each object has a date and the history items belonging to that date.
@@ skipping 10 matching lines @@
 
     menuOpen: {
       type: Boolean,
       value: false,
       reflectToAttribute: true
     },
 
     menuIdentifier: {
       type: Number,
       value: 0
+    },
+
+    searchTerm: {
+      type: String,
+      value: ''
+    },
+
+    // Page waits until results have finished loading before displaying message.
+    loading: {
+      type: Boolean,
+      value: false

[tsergeant, 2016/02/12 00:03:52]

Can you change to `value: true` instead of your change to history.js?

[hsampson, 2016/02/12 06:45:43]

Done.

     }
   },
 
   /** @const @private */
   X_OFFSET_: 30,
 
   listeners: {
     'tap': 'closeMenu',
     'toggle-menu': 'toggleMenu_'
   },
 
   /**
    * Closes the overflow menu.
    */
   closeMenu: function() {
     this.menuOpen = false;
   },
 
   /**
+   * 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.
    * @private
    */
   toggleMenu_: function(e) {
     var menu = this.$['overflow-menu'];
 
     // Menu closes if the same button is clicked.
     if (this.menuOpen && this.menuIdentifier == e.detail.accessTime) {
       this.closeMenu();
     } else {
       this.menuOpen = true;
       this.menuIdentifier = e.detail.accessTime;
 
       cr.ui.positionPopupAtPoint(e.detail.x + this.X_OFFSET_, e.detail.y, menu,
           cr.ui.AnchorType.BEFORE);
 
       menu.focus();
     }
   },
 
   /**
    * 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;
 
     for (var i = 0; i < results.length; i++) {
-      if (!currentDate)
+      if (currentDate == undefined)

[tsergeant, 2016/02/12 00:03:53]

I'm not sure what the intention is here? Nothing in the HistoryEntry will ever
be undefined -- it will be something like the empty string instead.

[hsampson, 2016/02/12 06:45:43]

I think this may just be leftover from a different architecture and doesn't do
anything anymore.

         continue;
 
+      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;
         historyItems = [];
       }
       historyItems.push(results[i]);
     }
 
-    if (currentDate)
+    if (currentDate != undefined)
       this.appendHistoryData_(currentDate, historyItems);
 
-    this.lastVisitedTime = historyItems[historyItems.length - 1].time;
+    // this.lastVisitedTime = historyItems[historyItems.length - 1].time;

[tsergeant, 2016/02/12 00:03:52]

Is this meant to be commented?

[hsampson, 2016/02/12 06:45:43]

Done.

+    this.loading = false;
   },
 
   /**
    * Cycle through each entry in historyDataByDay_ and set all items to be
    * unselected.
-   * @param {number} overallItemCount The number of items selected.
+   * @param {number} overallItemCount The number of selected items.
    */
   unselectAllItems: function(overallItemCount) {
     var historyCardData = this.historyDataByDay_;
 
     for (var i = 0; i < historyCardData.length; i++) {
       var items = historyCardData[i].historyItems;
       for (var j = 0; j < items.length; j++) {
         if (items[j].selected) {
           this.set('historyDataByDay_.' + i + '.historyItems.' + j +
               '.selected', false);
@@ skipping 45 matching lines @@
     var historyCards = this.historyDataByDay_;
     for (var i = historyCards.length - 1; i >= 0; i--) {
       if (historyCards[i].historyItems.length == 0) {
         this.splice('historyDataByDay_', i, 1);
       }
     }
   },
 
   /**
    * 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 currentDate matches, creates a new element otherwise.
+   * @param {string} currentDate The currentDate 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(currentDate, historyItems) {
     var lastDay = this.historyDataByDay_.length - 1;
-    if (lastDay > 0 && date == this.historyDataByDay_[lastDay].date) {
+    if (lastDay >= 0 &&
+        currentDate == this.historyDataByDay_[lastDay].date) {
       this.set('historyDataByDay_.' + lastDay + '.historyItems',
           this.historyDataByDay_[lastDay].historyItems.concat(historyItems));
     } else {
       this.push('historyDataByDay_', {
-        date: date,
+        date: currentDate,
         historyItems: historyItems
       });
     }
   },
 
   /**
    * Based on which items are selected, collect an array of the info required
    * for chrome.send('removeHistory', ...).
    * @param {number} count The number of items that are selected.
    * @return {Array<HistoryEntry>} toBeRemoved An array of objects which contain
@@ skipping 25 matching lines @@
    * @private
    */
   scrollHandler_: function() {
     // Close overflow menu on scroll.
     this.closeMenu();
 
     // Requests the next list of results when the scrollbar is near the bottom
     // of the window.
     var scrollOffset = 10;
     var scrollElem = this.$['infinite-list'];
+    if (!this.loading && scrollElem.scrollHeight <=
+         scrollElem.scrollTop + scrollElem.clientHeight + scrollOffset) {
+      chrome.send('queryHistory',
+          [this.searchTerm, 0, 0, this.lastVisitedTime, RESULTS_PER_PAGE]);
+    }
+  },
 
-    if (scrollElem.scrollHeight <=
-        scrollElem.scrollTop + scrollElem.clientHeight + scrollOffset) {
-      chrome.send('queryHistory',
-          ['', 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;
+  },
+
+  /**
+   * Return the message to be displayed if there are no results based on whether
+   * the empty results were for a search or normal history results.
+   * @param {string} search The search term for these results.
+   * @return {string} The displayed message.
+   * @private
+   */
+  noResultsMessage_: function(search) {
+    var messageId = search != '' ? 'noSearchResults' : 'noResults';
+    return loadTimeData.getString(messageId);
   }
 });