MD WebUI: Add loading spinner to cr-toolbar, hook into MD History toolbar

chrome/browser/resources/md_history/app.js

 // Copyright 2016 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.
 
 /**
  * @typedef {{querying: boolean,
  *            searchTerm: string,
  *            results: ?Array<!HistoryEntry>,
  *            info: ?HistoryQuery,
  *            range: HistoryRange,
@@ skipping 22 matching lines @@
     // TODO(calamity): Split out readOnly data into a separate property which is
     // only set on result return.
     queryState_: {
       type: Object,
       value: function() {
         return {
           // A query is initiated by page load.
           querying: true,
           searchTerm: '',
           results: null,
+          // Whether the most recent query was incremental.
+          incremental: false,

[dpapad, 2016/06/08 00:07:35]

Shouldn't the QueryState typedef also be upadated? 

[tsergeant, 2016/06/08 02:53:54]

Done.

           info: null,
           range: HistoryRange.ALL_TIME,
           // TODO(calamity): Make history toolbar buttons change the offset.
           groupedOffset: 0,
           sessionList: null,
         };
       }
     },
   },
 
   observers: [
     'searchTermChanged_(queryState_.searchTerm)',
     'groupedRangeChanged_(queryState_.range)',
   ],
 
   // TODO(calamity): Replace these event listeners with data bound properties.
   listeners: {
     'history-checkbox-select': 'checkboxSelected',
     'unselect-all': 'unselectAll',
     'delete-selected': 'deleteSelected',
     'search-domain': 'searchDomain_',
     'load-more-history': 'loadMoreHistory_',
   },
 
   ready: function() {

[dpapad, 2016/06/08 00:07:35]

Nit:
/** @override */

[tsergeant, 2016/06/08 02:53:54]

Done.

     this.grouped_ = loadTimeData.getBoolean('groupByDomain');
   },
 
   /**
    * Listens for history-item being selected or deselected (through checkbox)
    * and changes the view of the top toolbar.
    * @param {{detail: {countAddition: number}}} e
    */
   checkboxSelected: function(e) {
     var toolbar = /** @type {HistoryToolbarElement} */(this.$.toolbar);
@@ skipping 90 matching lines @@
   /**
    * Queries the history backend for results based on queryState_.
    * @param {boolean} incremental Whether the new query should continue where
    *    the previous query stopped.
    */
   queryHistory: function(incremental) {
     if (this.queryingDisabled_ || this.firstLoad_)
       return;
 
     this.set('queryState_.querying', true);
+    this.set('queryState_.incremental', incremental);
 
     var queryState = this.queryState_;
 
     var lastVisitTime = 0;
     if (incremental) {
       var lastVisit = queryState.results.slice(-1)[0];
       lastVisitTime = lastVisit ? lastVisit.time : 0;
     }
 
     var maxResults =
       queryState.range == HistoryRange.ALL_TIME ? RESULTS_PER_PAGE : 0;
     chrome.send('queryHistory', [
       queryState.searchTerm, queryState.groupedOffset, Number(queryState.range),
       lastVisitTime, maxResults
     ]);
   },
 
   /**
    * @param {!Array<!ForeignSession>} sessionList Array of objects describing
    *     the sessions from other devices.
    * @param {boolean} isTabSyncEnabled Is tab sync enabled for this profile?
    */
   setForeignSessions: function(sessionList, isTabSyncEnabled) {
     if (!isTabSyncEnabled)
       return;
 
     this.set('queryState_.sessionList', sessionList);
   },
 
   getSelectedPage: function(selectedPage, range) {

[dpapad, 2016/06/08 00:07:35]

@param, @return missing

[tsergeant, 2016/06/08 02:53:54]

Done.

     if (selectedPage == 'history-list' && range != HistoryRange.ALL_TIME)
       return 'history-grouped-list';
 
     return selectedPage;
   },
 
-  syncedTabsSelected_(selectedPage) {
+  syncedTabsSelected_: function(selectedPage) {

[dpapad, 2016/06/08 00:07:35]

Same here.

[tsergeant, 2016/06/08 02:53:54]

Done.

     return selectedPage == 'history-synced-device-manager';
+  },
+
+  /**
+   * True if the toolbar should show a loading spinner. True when the backend is
+   * querying a new search term.
+   * @param {boolean} querying
+   * @param {boolean} incremental
+   * @param {string} searchTerm
+   * @return {boolean}

[dpapad, 2016/06/08 00:07:36]

Nit: Move the comment at lines 222-223 here, as follows.

@return {boolean} Whether a spinner should be shown
    (implies that the backend is querying a new search term).

[tsergeant, 2016/06/08 02:53:54]

Done.

+   * @private
+   */
+  shouldShowSpinner_: function(querying, incremental, searchTerm) {
+    return querying && !incremental && searchTerm != '';
   }
 });