MD History: Implement search functionality.

chrome/browser/resources/md_history/history_card_manager.html

Index: chrome/browser/resources/md_history/history_card_manager.html
diff --git a/chrome/browser/resources/md_history/history_card_manager.html b/chrome/browser/resources/md_history/history_card_manager.html
index 7108a87abc6593da7befccbd5ac3cc9501c978e2..6045498b08d832cf226f3ef41a60ff83cd9ca1e8 100644
--- a/chrome/browser/resources/md_history/history_card_manager.html
+++ b/chrome/browser/resources/md_history/history_card_manager.html
@@ -40,15 +40,31 @@
       paper-item:hover {
         background: #eaeaea;
       }
+
+      #no-results {
+        flex: 1;
+        align-items: center;
+        color: #b4b4b4;
+        display: flex;
+        font-size: 123.1%;
+        font-weight: 500;
+        justify-content: center;
+      }
     </style>
-    <iron-list items="{{historyDataByDay_}}" as="historyDay" id="infinite-list"
-        on-scroll="scrollHandler_">
-      <template>
-        <history-card history-date="{{historyDay.date}}"
-            history-items="{{historyDay.historyItems}}">
-        </history-card>
-      </template>
-    </iron-list>
+    <template is="dom-if" if="{{noResults_(historyDataByDay_.length, loading)}}">

[tsergeant, 2016/02/02 02:57:36]

These dom-ifs complicate the template a fair bit.

An alternative to dom-if is to use hidden$=. If you had

<template is="dom-if" if="{{expr}}">
  <div id="blah"></div>
</template>

Then you can do this instead:

<div id="blah" hidden$="{{!expr}}"></div>

dom-if is still better if the thing you're hiding is big and likely to never be
seen, but here it's fine to use hidden instead (See
https://www.polymer-project.org/1.0/docs/devguide/templates.html#dom-if for more
context on the differences)

[hsampson, 2016/02/03 02:37:58]

Done.

+      <div id="no-results">{{noResultsMessage}}</div>
+    </template>
+    <template is="dom-if" if="{{!noResults_(historyDataByDay_.length, loading)}}">
+      <iron-list items="{{historyDataByDay_}}" as="historyDay" id="infinite-list"
+          on-scroll="scrollHandler_">
+        <template>
+          <history-card history-date="{{historyDay.date}}"
+              search-term="[[searchTerm]]"
+              history-items="{{historyDay.historyItems}}">
+          </history-card>
+        </template>
+      </iron-list>
+    </template>
     <paper-menu id="overflow-menu">
       <paper-item i18n-content="moreFromSite" on-tap="onMoreFromSiteTap_">
       </paper-item>