MD History: Delete button in the toolbar allows deletion of multiple history-items.

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 82 matching lines @@
     }
     if (currentDate != undefined)
       this.appendHistoryData_(currentDate, historyItems);
 
     this.lastVisitedTime = historyItems[historyItems.length - 1].time;
   },
 
   /**
    * Cycle through each entry in historyDataByDay_ and set all items to be
    * unselected.
+   * @param {number} overallItemCount The number of items selected.
    */
   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);
           overallItemCount--;
           if (overallItemCount == 0)
-            break;
+            return;
         }
       }
     }
   },
 
   /**
+   * Remove all selected items from the overall array so that they are also
+   * removed from view. Make sure that the card length and positioning is
+   * updated accordingly.
+   * @param {number} overallItemCount The number of items selected.
+   */
+  removeDeletedHistory: function(overallItemCount) {
+    for (var i = 0; i < this.historyDataByDay_.length; i++) {
+      var items = this.historyDataByDay_[i].historyItems;
+      var itemDeletedFromCard = false;
+
+      for (var j = items.length - 1; j >= 0; j--) {

[tsergeant, 2016/01/25 01:43:14]

There's a problem here that is kinda tough to explain.

When you delete an item, the historyDataByDay[i].historyItems loses an item and
gets smaller.

Specifically, the item which used to be at position `j` is removed. The item
which used to be at position `j+1` will then move back to position `j`.

You'll continue looping, and move on to the item in position `j+1`, but *that*
item, in turn, used to be in position `j+2`. You will have completely skipped
over the item that used to at `j+1` and is now at `j`.

You can avoid this by decrementing j after you delete anything.

[hsampson, 2016/01/25 04:15:42]

As discussed the loop going through backwards is to account for this.

+        if (items[j].selected) {
+          this.splice('historyDataByDay_.' + i + '.historyItems', j, 1);
+          itemDeletedFromCard = true;
+          overallItemCount--;
+          if (overallItemCount == 0) {
+            this.removeEmptyCards_();
+            // If the last card has been removed don't try to update its size.
+            if (this.historyDataByDay_.length > i) {

[tsergeant, 2016/01/25 01:43:14]

Remove {}

[hsampson, 2016/01/25 04:15:42]

Done.

+              this.$['infinite-list'].updateSizeForItem(i);
+            }
+            return;
+          }
+        }
+      }
+      if (itemDeletedFromCard)
+        this.$['infinite-list'].updateSizeForItem(i);
+    }
+  },
+
+  /**
+   * If a given day has had all the history it contains removed, remove this
+   * day from the array.
+   * @private
+   */
+  removeEmptyCards_: function() {
+    var historyCards = this.historyDataByDay_;
+    for (var i = historyCards.length - 1; i > -1; 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.
    * @param {Array<HistoryEntry>} historyItems The list of history items for the
    * current date.
    * @private
    */
   appendHistoryData_: function(date, historyItems) {
     var lastDay = this.historyDataByDay_.length - 1;
     if (lastDay > 0 && date == this.historyDataByDay_[lastDay].date) {
       this.set('historyDataByDay_.' + lastDay + '.historyItems',
           this.historyDataByDay_[lastDay].historyItems.concat(historyItems));
     } else {
       this.push('historyDataByDay_', {
         date: date,
         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} toBeRemoved An array of objects which contain information
+   * on which history-items should be deleted.
+   */
+  getItemsToDelete: function(count) {
+    var toBeRemoved = [];
+    for (var i = 0; i < this.historyDataByDay_.length; i++) {
+      var items = this.historyDataByDay_[i].historyItems;
+      for (j = 0; j < items.length; j++) {
+        if (items[j].selected) {
+
+          toBeRemoved.push({
+            url: items[j].url,
+            timestamps: items[j].allTimestamps
+          });
+
+          count--;
+          if (count == 0)
+            return toBeRemoved;
+        }
+      }
+    }
+  },
+
+  /**
    * Called when the card manager is scrolled.
    * @private
    */
   scrollHandler_: function() {
     // Closes overflow menu on scroll.
     this.closeMenu();
 
     this.loadMoreIfAtEnd_();
   },
 
   /**
    * Requests the next list of results when the scrollbar is near the bottom
    * of the window.
    */
   loadMoreIfAtEnd_: function() {
     var scrollOffset = 10;
     var scrollElem = this.$['infinite-list'];
 
     if (scrollElem.scrollHeight <=
         scrollElem.scrollTop + scrollElem.clientHeight + scrollOffset) {
       chrome.send('queryHistory',
           ['', 0, 0, this.lastVisitedTime, RESULTS_PER_PAGE]);
     }
   }
 });