Merge pull request #26 from tayloraswift/frontend-improvements

Frontend improvements

Author: tayloraswift

Assets/js/Main.js

@@ -1,6 +1,6 @@
 <div align="center">
 
-<strong><em><code>unidoc</code></em></strong><br><small><code>0.2.7</code></small>
+<strong><em><code>unidoc</code></em></strong><br><small><code>0.2.8</code></small>
 
 [![ci build status](https://github.com/kelvin13/swift-unidoc/actions/workflows/build.yml/badge.svg)](https://github.com/kelvin13/swift-unidoc/actions/workflows/build.yml)
 

Assets/js/Main.js.map

@@ -73,6 +73,18 @@ extension Site.Docs.MultipleFound:ApplicationPage
             $0[.div, { $0.class = "eyebrows" }]
             {
                 $0[.span, { $0.class = "phylum" }] = "Disambiguation Page"
+                $0[.span, { $0.class = "domain" }]
+                {
+                    $0[.span, { $0.class = "package" }]
+                    {
+                        $0[.a]
+                        {
+                            $0.href = "\(Site.Docs[self.names])"
+                        } = "\(self.names.package)"
+                    }
+
+                    $0[.span] { $0.class = "version" } = self.names.version
+                }
             }
 
             var path:URI.Path = []

README.md

@@ -18,12 +18,38 @@ if (list !== null) {
     const input: HTMLElement | null = document.getElementById('search-input');
 
     if (input !== null) {
-        input.addEventListener('focus',
-            (event: Event) => searchbar.focus());
-        input.addEventListener('input',
-            (event: Event) => searchbar.suggest(event));
-        input.addEventListener('keydown',
-            (event: KeyboardEvent) => searchbar.navigate(event));
+        input.addEventListener('focus', (event: Event) => searchbar.focus());
+
+        //  We don’t want to suggest a keyboard shortcut if the user focused the input
+        //  via touch, or if they were already using the keyboard shortcut.
+        input.addEventListener('mousedown', function (event: Event) {
+             input.setAttribute('placeholder', 'search shortcut: /');
+        });
+
+        input.addEventListener('blur', function (event: Event) {
+             input.setAttribute('placeholder', 'search symbols');
+        });
+
+        input.addEventListener('input', (event: Event) => searchbar.suggest(event));
+        input.addEventListener('keydown', (event: KeyboardEvent) => searchbar.navigate(event));
+
+        document.addEventListener('keydown', function (event: KeyboardEvent) {
+            switch (event.key) {
+                case 'Escape': {
+                    if (document.activeElement === input) {
+                        input.blur();
+                    }
+                    break;
+                }
+                case '/': {
+                    if (document.activeElement !== input) {
+                        input.focus();
+                        event.preventDefault();
+                    }
+                    break;
+                }
+            }
+        });
     }
 
     const form: HTMLElement | null = document.getElementById('search');