MD History: Replace app-route with a custom router

chrome/browser/resources/md_history/history_toolbar.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-toolbar',
   properties: {
     // Number of history items currently selected.
     // TODO(calamity): bind this to
     // listContainer.selectedItem.selectedPaths.length.
     count: {
       type: Number,
       value: 0,
       observer: 'changeToolbarView_'
     },
 
     // True if 1 or more history items are selected. When this value changes
     // the background colour changes.
     itemsSelected_: {
       type: Boolean,
       value: false,
       reflectToAttribute: true
     },
 
     // The most recent term entered in the search field. Updated incrementally
     // as the user types.
     searchTerm: {
       type: String,
+      observer: 'searchTermChanged_',
       notify: true,
     },
 
     // True if the backend is processing and a spinner should be shown in the
     // toolbar.
     spinnerActive: {
       type: Boolean,
       value: false
     },
 
@@ skipping 28 matching lines @@
     // Whether to show the menu promo (a tooltip that points at the menu button
     // in narrow mode).
     showMenuPromo_: {
       type: Boolean,
       value: function() {
         return loadTimeData.getBoolean('showMenuPromo');
       },
     },
   },
 
+  /** @return {CrToolbarSearchFieldElement} */
+  get searchField() {
+    return /** @type {CrToolbarElement} */ (this.$['main-toolbar'])
+        .getSearchField();
+  },
+
+  showSearchField: function() {
+    this.searchField.showAndFocus();
+  },
+
   /**
    * Changes the toolbar background color depending on whether any history items
    * are currently selected.
    * @private
    */
   changeToolbarView_: function() {
     this.itemsSelected_ = this.count > 0;
   },
 
   /**
    * When changing the search term externally, update the search field to
    * reflect the new search term.
-   * @param {string} search
    */
-  setSearchTerm: function(search) {
-    if (this.searchTerm == search)
-      return;
-
-    this.searchTerm = search;
-    var searchField = /** @type {!CrToolbarElement} */(this.$['main-toolbar'])
-                          .getSearchField();
-    searchField.showAndFocus();
-    searchField.setValue(search);
+  searchTermChanged_: function() {
+    if (this.searchField.getValue() != this.searchTerm) {
+      this.searchField.showAndFocus();
+      this.searchField.setValue(this.searchTerm);
+    }
   },
 
   /** @private */
   onMenuPromoShown_: function() {
     md_history.BrowserService.getInstance().menuPromoShown();
   },
 
   /**
    * @param {!CustomEvent} event
    * @private
@@ skipping 13 matching lines @@
   },
 
   onClearSelectionTap_: function() {
     this.fire('unselect-all');
   },
 
   onDeleteTap_: function() {
     this.fire('delete-selected');
   },
 
-  get searchBar() {
-    return this.$['main-toolbar'].getSearchField();
-  },
-
-  showSearchField: function() {
-    /** @type {!CrToolbarElement} */(this.$['main-toolbar'])
-        .getSearchField()
-        .showAndFocus();
-  },
-
   /**
    * If the user is a supervised user the delete button is not shown.
    * @private
    */
   deletingAllowed_: function() {
     return loadTimeData.getBoolean('allowDeletingHistory');
   },
 
   numberOfItemsSelected_: function(count) {
     return count > 0 ? loadTimeData.getStringF('itemsSelected', count) : '';
   },
 
   getHistoryInterval_: function(queryStartTime, queryEndTime) {
     // TODO(calamity): Fix the format of these dates.
     return loadTimeData.getStringF(
       'historyInterval', queryStartTime, queryEndTime);
   },
 
   /** @private */
   hasDrawerChanged_: function() {
     this.updateStyles();
   },
 });