godoc: use "search" input type for search box.

Uses placeholder attribute instead of changing the value of search
field on browsers that support it.  On other browsers, the fake
placeholder text is restored when the empty box loses focus.

R=golang-dev, gri
CC=golang-dev
https://golang.org/cl/4441041

doc/all.css

@@ -96,7 +96,7 @@ h1#title {
   color: #999;
 }
 #search {
-  width: 100px;
+  width: 120px;
   margin-left: 0.5em;
 }
 #search.inactive {

doc/godocs.js

@@ -34,7 +34,18 @@ function godocs_bindSearchEvents() {
       search.className = "";
     }
   }
+  function restoreInactive() {
+    if (search.value != "") {
+      return;
+    }
+    if (search.type != "search") {
+      search.value = search.getAttribute("placeholder");
+    }
+    search.className = "inactive";
+  }
+  restoreInactive();
   bindEvent(search, 'focus', clearInactive);
+  bindEvent(search, 'blur', restoreInactive);
 }
 
 /* Generates a table of contents: looks for h2 and h3 elements and generates

lib/godoc/godoc.html

@@ -33,7 +33,7 @@
         <a href="/pkg/">Packages</a> <span class="sep">|</span>
         <a href="/cmd/">Commands</a> <span class="sep">|</span>
         <a href="/doc/go_spec.html">Specification</a>
-        <input id="search" type="text" name="q" value="{.section Query}{Query|html-esc}{.or}code search{.end}" class="{.section Query}{.or}inactive{.end}" />
+        <input id="search" type="search" name="q" value="{.section Query}{Query|html-esc}{.end}" class="{.section Query}{.or}inactive{.end}" placeholder="code search" results="0" />
         </form>
       </div>
     </div>