dom-ui settings: Improve search field behavior....

chrome/browser/resources/options/search_page.js

 // Copyright (c) 2010 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.
 
 cr.define('options', function() {
   const OptionsPage = options.OptionsPage;
 
   /**
    * Encapsulated handling of a search bubble.
    * @constructor
@@ skipping 93 matching lines @@
       var searchField = document.createElement('input');
       searchField.id = 'search-field';
       searchField.type = 'search';
       searchField.setAttribute('autosave', 'org.chromium.options.search');
       searchField.setAttribute('results', '10');
       searchField.setAttribute('incremental', 'true');
 
       // Replace the contents of the navigation tab with the search field.
       self.tab.textContent = '';
       self.tab.appendChild(searchField);
+      self.tab.onclick = self.tab.onkeypress = undefined;
 
       // Handle search events. (No need to throttle, WebKit's search field
       // will do that automatically.)
       searchField.onsearch = function(e) {
         self.setSearchText_(this.value);
       };
+
+      // Install handler for key presses.
+      document.addEventListener('keydown',
+                                this.keyDownEventHandler_.bind(this));
+
+      // Focus the search field by default.
+      searchField.focus();
     },
 
     /**
      * @inheritDoc
      */
     get sticky() {
       return true;
     },
 
     /**
@@ skipping 23 matching lines @@
      * @private
      */
     setSearchActive_: function(active) {
       // It's fine to exit if search wasn't active and we're not going to
       // activate it now.
       if (!this.searchActive_ && !active)
         return;
 
       if (this.searchActive_ != active) {
         this.searchActive_ = active;
-        if (active) {
-          // Reset the search criteria, effectively hiding all the sections.
-          this.setSearchText_('');
-        } else {
+        if (!active) {
           // Just wipe out any active search text since it's no longer relevant.
           $('search-field').value = '';
         }
       }
 
       var pagesToSearch = this.getSearchablePages_();
       for (var key in pagesToSearch) {
         var page = pagesToSearch[key];
 
         if (!active)
@@ skipping 24 matching lines @@
         this.removeSearchBubbles_();
       }
     },
 
     /**
      * Set the current search criteria.
      * @param {string} text Search text.
      * @private
      */
     setSearchText_: function(text) {
+      // Consider whitespace-only strings as empty.
+      if (!text.replace(/^\s+/, '').length)
+        text = '';
+
+      // Toggle the search page if necessary.
+      if (text.length) {
+        if (!this.searchActive_)
+          OptionsPage.showPageByName(this.name);
+      } else {
+        if (this.searchActive_)
+          OptionsPage.showDefaultPage();
+        return;
+      }
+
       var foundMatches = false;
       var bubbleControls = [];
 
       // Remove any prior search results.
       this.unhighlightMatches_();
       this.removeSearchBubbles_();
 
       // Generate search text by applying lowercase and escaping any characters
       // that would be problematic for regular expressions.
       var searchText =
@@ skipping 59 matching lines @@
               for (var i = 0; i < length; i++)
                 bubbleControls.push(controls[i]);
             }
 
             foundMatches = true;
           }
         }
       }
 
       // Configure elements on the search results page based on search results.
-      if (searchText.length == 0) {
-        $('searchPageInfo').classList.remove('search-hidden');
+      if (foundMatches)
         $('searchPageNoMatches').classList.add('search-hidden');
-      } else if (foundMatches) {
-        $('searchPageInfo').classList.add('search-hidden');
-        $('searchPageNoMatches').classList.add('search-hidden');
-      } else {
-        $('searchPageInfo').classList.add('search-hidden');
+      else
         $('searchPageNoMatches').classList.remove('search-hidden');
-      }
 
       // Create search balloons for sub-page results.
       length = bubbleControls.length;
       for (var i = 0; i < length; i++)
         this.createSearchBubble_(bubbleControls[i], text);
     },
 
     /**
      * Performs a string replacement based on a regex and replace string.
      * @param {RegEx} regex A regular expression for finding search matches.
@@ skipping 127 matching lines @@
         page = OptionsPage.registeredPages[name];
         if (page.parentPage && page.associatedSection)
           pages.push(page);
       }
       for (name in OptionsPage.registeredOverlayPages) {
         page = OptionsPage.registeredOverlayPages[name];
         if (page.associatedSection && page.pageDiv != undefined)
           pages.push(page);
       }
       return pages;
+    },
+
+    /**
+     * A function to handle key press events.
+     * @return {Event} a keydown event.
+     * @private
+     */
+    keyDownEventHandler_: function(event) {
+      // Focus the search field on an unused forward-slash.
+      if (event.keyCode == 191 &&
+          !/INPUT|SELECT|BUTTON|TEXTAREA/.test(event.target.tagName)) {
+        $('search-field').focus();
+        event.stopPropagation();
+        event.preventDefault();
+      }
     }
   };
 
   // Export
   return {
     SearchPage: SearchPage
   };
 
 });