search: be even more prepared for the transition from the Rails app

dscho · dscho · commit 6635ab12bc0e · 2024-09-23T13:17:10.000+02:00
In the parent commit, we started supporting to load the client-side
search via the `/search?search=&lt;term&gt;` URL into the interactive search
box served from the Rails app version of the page.

The trick to make this work was to exploit the fact that `/search` will
resolve to a full HTML page in the Hugo/Pagefind version, including the
client-side search code, which finds the search box, interprets its
contents, and peforms the desired functionality.

However, this still shows a quite ugly "full page" inside the search
results &lt;div&gt;.

Even worse: While the user typed less than three characters, this would
show the warning (intended for users who turned off Javascript) that
the search functionality is now client-side and requires Javascript.

Of course, this all only matters as long as the cached versions of the
Rails app site are served while transitioning to the Hugo/Pagefind
version of the site.

For the transition from a Rails app to a static website, let's detect
the situation that we're running "in mixed mode" and replace the full
search page with a small placeholder that is less annoying to the eye.

Signed-off-by: Johannes Schindelin &lt;johannes.schindelin@gmx.de&gt;
diff --git a/content/search/_index.html b/content/search/_index.html
@@ -22,3 +22,11 @@
     </td>
   </tr>
 </tbody></table>
+<script>
+  if ($("#search-results").html().indexOf("<header>Search is now client-side only!</header>") > 0) {
+    // We seem to be running a client-side search started from the Rails-version of the page;
+    // This means that we loaded the _entire_ search page, <html> and all, into the div. Let's not
+    // show that while initializing and running the actual search...
+    $("#search-results").html("<header>Search results</header><table><tr><td>Initializing search &hellip;</td></tr></table>");
+  }
+</script>
