Extensions Docs Server: Filter APIs UI

chrome/common/extensions/docs/server2/templates/private/sidenav.html

 <div class="g-unit g-first" id="gc-toc">
   <ul>
     <li><h2>Starting</h2>
       <ul>
         <li><a href="getstarted.html">Getting Started</a></li>
         <li><a href="overview.html">Overview</a></li>
         <li><a href="whats_new.html">What's New?</a></li>
       </ul>
     </li>
     <li><h2>The API</h2>
@@ skipping 53 matching lines @@
     <li><h2>Reference</h2>
       <ul>
         <li><span>Formats</span>
           <ul style="display: none;">
             <li><a href="manifest.html">Manifest Files</a></li>
             <li><a href="match_patterns.html">Match Patterns</a></li>
           </ul>
         </li>
         <li><a href="permission_warnings.html">Permission Warnings</a></li>
         <li><a href="api_index.html">chrome.* APIs</a></li>
+        <div>
+          <input type="search" id="api_search" placeholder="Filter APIs">

[not at google - send to devlin, 2012/07/30 10:14:25]

I googled and found a couple of neat tricks: if you add a "results" property
then you get a little magnifying glass in WebKit. Not sure if you can get a
similar thing on Firefox, or if it works on platforms other than mac, but it's
pretty cool.

Also I'd call this "Search APIs" not "Filter APIs".

[cduvall, 2012/07/30 20:05:38]

Done.

+          <div id="filtered_apis"></div>
+        </div>

[not at google - send to devlin, 2012/07/30 10:14:25]

I reckon we should move this and the API references to the top. This one first.
It's the coolest feature we have.

I think we'll eventually make it more prominent, but for now just move it up (so
at least most people don't need to scroll down).

[cduvall, 2012/07/30 20:05:38]

Wasn't sure if you wanted me to move the whole section, but I did. Easy to
change though.

         <li><a href="api_other.html">Other APIs</a></li>
       </ul>
     </li>
     <li><h2><a href="samples.html">Samples</a></h2></li>
     <li><h2>More</h2>
       <ul>
         <li><a href="http://code.google.com/chrome/webstore/docs/index.html">Chrome Web Store</a></li>
         <li><a href="http://code.google.com/chrome/apps/docs/developers_guide.html">Hosted Apps</a></li>
         <li><a href="themes.html">Themes</a></li>
       </ul>
     </li>
   </ul>
 </div>