Add faster search

If there's only one search result enter navigates to it

index.html

@@ -4,12 +4,14 @@
 
 <p>{{ site.tagline }}</p>
 
-<div id="search-wrapper" class="mdc-text-field mdc-text-field--with-leading-icon mdc-text-field--filled">
-  <i class="material-icons mdc-text-field__icon" aria-hidden="true">search</i>
-  <input type="text" id="search" class="mdc-text-field__input">
-  <label class="mdc-floating-label" for="search">Search for tool</label>
-  <div class="mdc-line-ripple"></div>
-</div>
+<form id="search-form">
+  <div id="search-wrapper" class="mdc-text-field mdc-text-field--with-leading-icon mdc-text-field--filled">
+    <i class="material-icons mdc-text-field__icon" aria-hidden="true">search</i>
+    <input type="text" id="search" class="mdc-text-field__input">
+    <label class="mdc-floating-label" for="search">Search for tool</label>
+    <div class="mdc-line-ripple"></div>
+  </div>
+</form>
 
 <script src="/shared/search.js?v={{site.time | date: '%s' }}" defer></script>
 

shared/search.js

@@ -1,6 +1,17 @@
+const formEl = document.getElementById('search-form');
 const inputEl = document.getElementById('search');
 const tools = Array.from(document.getElementById('tools').children);
 
+formEl.addEventListener('submit', ev => {
+    ev.preventDefault();
+
+    const visibleMenuItems = document.querySelectorAll("#tools > a:not([hidden])");
+
+    if (visibleMenuItems.length === 1) {
+        window.location.href = visibleMenuItems[0].getAttribute("href");
+    }
+})
+
 inputEl.addEventListener('input', ev => {
     const searchQuery = ev.target.value.trim().toLowerCase();