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,
+ *            incremental: boolean,
  *            range: HistoryRange,
  *            groupedOffset: number,
  *            sessionList: ?Array<!ForeignSession>}}
  */
 var QueryState;
 
 Polymer({
   is: 'history-app',
 
   properties: {
@@ skipping 13 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,
           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_',
   },
 
+  /** @override */
   ready: function() {
     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) {
@@ skipping 91 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);
   },
 
+  /**
+   * @param {string} selectedPage
+   * @param {HistoryRange} range
+   * @return {string}
+   */
   getSelectedPage: function(selectedPage, range) {
     if (selectedPage == 'history-list' && range != HistoryRange.ALL_TIME)
       return 'history-grouped-list';
 
     return selectedPage;
   },
 
-  syncedTabsSelected_(selectedPage) {
+  /**
+   * @param {string} selectedPage
+   * @return {boolean}
+   * @private
+   */
+  syncedTabsSelected_: function(selectedPage) {
     return selectedPage == 'history-synced-device-manager';
+  },
+
+  /**
+   * @param {boolean} querying
+   * @param {boolean} incremental
+   * @param {string} searchTerm
+   * @return {boolean} Whether a loading spinner should be shown (implies the
+   *     backend is querying a new search term).
+   * @private
+   */
+  shouldShowSpinner_: function(querying, incremental, searchTerm) {
+    return querying && !incremental && searchTerm != '';
   }
 });