MD History: Add spinners when new data is loading or searching

chrome/browser/resources/md_history/history_list.html

Index: chrome/browser/resources/md_history/history_list.html
diff --git a/chrome/browser/resources/md_history/history_list.html b/chrome/browser/resources/md_history/history_list.html
index 173a09ef1957e622e09f813fa538501340f3eccf..d6f048c94ed514215d1f7f96d3dc79a870b00c03 100644
--- a/chrome/browser/resources/md_history/history_list.html
+++ b/chrome/browser/resources/md_history/history_list.html
@@ -1,6 +1,7 @@
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-list/iron-list.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-item/paper-item.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-spinner/paper-spinner.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_shared_menu/cr_shared_menu.html">
 <link rel="import" href="chrome://history/constants.html">
 <link rel="import" href="chrome://history/history_item.html">
@@ -12,6 +13,7 @@
       :host {
         display: flex;
         flex-direction: column;
+        position: relative;
       }
 
       #infinite-list {
@@ -19,6 +21,15 @@
         padding-top: var(--first-card-padding-top);
       }
 
+      #loading-spinner {
+        bottom: 20px;
+        left: 0;
+        margin: 0 auto;
+        position: absolute;
+        right: 0;
+        width: 28px;
+      }
+
       paper-item {
         -webkit-user-select: none;
         cursor: pointer;
@@ -48,6 +59,9 @@
         </history-item>
       </template>
     </iron-list>
+    <paper-spinner id="loading-spinner" alt="$i18n{loading}"
+        active="[[loading_]]">
+    </paper-spinner>
     <cr-shared-menu id="sharedMenu">
       <paper-item id="menuMoreButton" on-tap="onMoreFromSiteTap_">
         $i18n{moreFromSite}