[MD History] Implement grouped history UI.

chrome/browser/resources/md_history/history_list.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-list',
 
   properties: {
     // The search term for the current query. Set when the query returns.
     searchedTerm: {
@@ skipping 68 matching lines @@
   disableResultLoading: function() {
     this.resultLoadingDisabled_ = true;
   },
 
   /**
    * Adds the newly updated history results into historyData_. Adds new fields
    * for each result.
    * @param {!Array<!HistoryEntry>} historyResults The new history results.
    */
   addNewResults: function(historyResults) {
+    var results = historyResults.slice();
     /** @type {IronScrollThresholdElement} */(this.$['scroll-threshold'])
         .clearTriggers();
 
     if (this.lastSearchedTerm_ != this.searchedTerm) {
       this.resultLoadingDisabled_ = false;
       if (this.historyData_)
         this.splice('historyData_', 0, this.historyData_.length);
       this.lastSearchedTerm_ = this.searchedTerm;
     }
 
-    if (historyResults.length == 0)
-      return;
-
-    // Creates a copy of historyResults to prevent accidentally modifying this
-    // field.
-    var results = historyResults.slice();
-
-    var currentDate = results[0].dateRelativeDay;
-
-    for (var i = 0; i < results.length; i++) {
-      // Sets the default values for these fields to prevent undefined types.
-      results[i].selected = false;
-      results[i].readableTimestamp =
-          this.searchedTerm == '' ?
-              results[i].dateTimeOfDay : results[i].dateShort;
-
-      if (results[i].dateRelativeDay != currentDate) {
-        currentDate = results[i].dateRelativeDay;
-      }
-    }
-
     if (this.historyData_) {
       // If we have previously received data, push the new items onto the
       // existing array.
       results.unshift('historyData_');
       this.push.apply(this, results);
     } else {
       // The first time we receive data, use set() to ensure the iron-list is
       // initialized correctly.
       this.set('historyData_', results);
     }
@@ skipping 80 matching lines @@
   /**
    * Check whether the time difference between the given history item and the
    * next one is large enough for a spacer to be required.
    * @param {HistoryEntry} item
    * @param {number} index The index of |item| in |historyData_|.
    * @param {number} length The length of |historyData_|.
    * @return {boolean} Whether or not time gap separator is required.
    * @private
    */
   needsTimeGap_: function(item, index, length) {
-    if (index >= length - 1 || length == 0)
-      return false;
-
-    var currentItem = this.historyData_[index];
-    var nextItem = this.historyData_[index + 1];
-
-    if (this.searchedTerm)
-      return currentItem.dateShort != nextItem.dateShort;
-
-    return currentItem.time - nextItem.time > BROWSING_GAP_TIME &&
-        currentItem.dateRelativeDay == nextItem.dateRelativeDay;
+    return md_history.HistoryItem.needsTimeGap(
+        this.historyData_, index, this.searchedTerm);
   },
 
   hasResults: function(historyDataLength) {
     return historyDataLength > 0;
   },
 
   noResultsMessage_: function(searchedTerm, isLoading) {
     if (isLoading)
       return '';
     var messageId = searchedTerm !== '' ? 'noSearchResults' : 'noResults';
@@ skipping 25 matching lines @@
    * @private
    */
   isCardEnd_: function(item, i, length) {
     if (length == 0 || i > length - 1)
       return false;
     return i == length - 1 ||
         this.historyData_[i].dateRelativeDay !=
         this.historyData_[i + 1].dateRelativeDay;
   },
 });