258a0a679ddb8d39698b72e63e0907b3a1baab35
chmalee
  Wed Dec 20 15:45:33 2023 -0800
Add a search bar to the home page, refs #25146

diff --git src/hg/htdocs/index.html src/hg/htdocs/index.html
index 3117aa8..64e4e30 100755
--- src/hg/htdocs/index.html
+++ src/hg/htdocs/index.html
@@ -67,30 +67,92 @@
       </div> <!-- previewWarningRow -->
       <!--#endif -->
 
       <!-- warning for mirrors (if applicable) -->
       <!--#if expr='"$SERVER_NAME" != /.*.ucsc.edu/ && "$SERVER_NAME" != /.*.sdsc.edu/
       && "$SERVER_NAME" != /browser/'-->
       <!-- 'browser' = GBiB -->
       <p style="text-align: center;">
         <strong>This website <em><!--#echo var="HTTP_HOST" --></em> is a &quot;mirror&quot; not run by
         UCSC.</strong> If you have questions, please try to contact the person who manages this mirror.
         <br><br>
         <strong>If you write the UCSC mailing list, please include this mirror's address
         <em>http://<!--#echo var="HTTP_HOST" --></em> with any questions.</strong></p>
       <!--#endif -->
 
+  <p style="text-align: center;">
+    <input size=50 name="searchString" id="searchBarSearchString" type="text" 
+        placeholder="Search genes, data, help docs and more..."></input>
+    <input name="searchButton" id="searchBarSearchButton" type="submit" value="Search"></input>
+    <script>
+    function searchBarClick() {
+        searchStr = document.getElementById('searchBarSearchString').value;
+        if (searchStr.length > 0) {
+            // helper functions for checking whether a plain chrom name was searched for
+            term = encodeURIComponent(searchStr.replace(/^[\s]*/,'').replace(/[\s]*$/,''));
+            function onSuccess(jqXHR, textStatus) {
+                if (jqXHR.chromName !== null) {
+                    window.location.assign("../cgi-bin/hgTracks?position=" + term );
+                } else {
+                    window.location.assign("../cgi-bin/hgSearch?search=" + term);
+                }
+            }
+            function onFail(jqXHR, textStatus) {
+                window.location.assign("../cgi-bin/hgSearch?search=" + term);
+            }
+
+            // redirect to search disambiguation page if it looks like we didn't enter a regular position:
+            var canonMatch = searchStr.match(canonicalRangeExp)
+            var gbrowserMatch = searchStr.match(gbrowserRangeExp);
+            var lengthMatch = searchStr.match(lengthRangeExp);
+            var bedMatch = searchStr.match(bedRangeExp);
+            var sqlMatch = searchStr.match(sqlRangeExp);
+            var singleMatch = searchStr.match(singleBaseExp);
+            var positionMatch = canonMatch || gbrowserMatch || lengthMatch || bedMatch || sqlMatch || singleMatch;
+
+            // the following encodes the cartJson cmd as a query string, skipping reliance
+            // on hgTracks.js:cart:varsToUrlData()
+            const url = new URL(window.location.href);
+            const params = new URLSearchParams(url.search);
+            params.append("cjCmd", '{"getChromName": {"searchTerm": "' + term + '"}}');
+            if (positionMatch === null) {
+                // user may have entered a full chromosome name, check for that asynchronosly:
+                $.ajax({
+                    type: "GET",
+                    url: "../cgi-bin/hgSearch",
+                    data:  params.toString(),
+                    dataType: "json",
+                    trueSuccess: onSuccess,
+                    success: onSuccess,
+                    error: onFail,
+                    cache: true
+                });
+                return false;
+            }
+            
+        }
+    }
+    document.getElementById('searchBarSearchButton').addEventListener('click', searchBarClick);
+    $('#searchBarSearchString').bind('keypress', function(e) {  // binds listener to url field
+        if (e.which === 13) {  // listens for return key
+             e.preventDefault();   // prevents return from also submitting whole form
+             searchBarClick();
+        }
+    });
+    </script>
+  </p>
+
   <div class="row">
     <!-- Tools -->
     <!--#include virtual="ourTools.html"-->
 
     <!-- Latest Releases -->
     <!--#include virtual="indexReleases.html"-->
   </div>
 
   <!-- Meetings and Workshops -->
   <!--#include virtual="indexMeetings.html"-->
 
   <div class="row">
     <!-- Sharing -->
     <!--#include virtual="indexSharing.html"-->