[mod] client/simple: client plugins (#5406)

* [mod] client/simple: client plugins

Defines a new interface for client side *"plugins"* that coexist with server
side plugin system. Each plugin (e.g., `InfiniteScroll`) extends the base
`ts Plugin`. Client side plugins are independent and lazy‑loaded via `router.ts`
when their `load()` conditions are met. On each navigation request, all
applicable plugins are instanced.

Since these are client side plugins, we can only invoke them once DOM is fully
loaded. E.g. `Calculator` will not render a new `answer` block until fully
loaded and executed.

For some plugins, we might want to handle its availability in `settings.yml`
and toggle in UI, like we do for server side plugins. In that case, we extend
`py Plugin` instancing only the information and then checking client side if
[`settings.plugins`](https://github.com/inetol/searxng/blob/1ad832b1dc33f3f388da361ff2459b05dc86a164/client/simple/src/js/toolkit.ts#L134)
array has the plugin id.

* [mod] client/simple: rebuild static

1 files changed, 69 insertions, 0 deletions

diff --git a/client/simple/src/js/router.ts b/client/simple/src/js/router.ts
new file mode 100644
index 000000000..24abb64c3
--- /dev/null
+++ b/client/simple/src/js/router.ts
@@ -0,0 +1,69 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+
+import { load } from "./loader.ts";
+import { Endpoints, endpoint, listen, ready, settings } from "./toolkit.ts";
+
+ready(() => {
+  document.documentElement.classList.remove("no-js");
+  document.documentElement.classList.add("js");
+
+  listen("click", ".close", function (this: HTMLElement) {
+    (this.parentNode as HTMLElement)?.classList.add("invisible");
+  });
+
+  listen("click", ".searxng_init_map", async function (this: HTMLElement, event: Event) {
+    event.preventDefault();
+    this.classList.remove("searxng_init_map");
+
+    load(() => import("./plugin/MapView.ts").then(({ default: Plugin }) => new Plugin(this)), {
+      on: "endpoint",
+      where: [Endpoints.results]
+    });
+  });
+
+  if (settings.plugins?.includes("infiniteScroll")) {
+    load(() => import("./plugin/InfiniteScroll.ts").then(({ default: Plugin }) => new Plugin()), {
+      on: "endpoint",
+      where: [Endpoints.results]
+    });
+  }
+
+  if (settings.plugins?.includes("calculator")) {
+    load(() => import("./plugin/Calculator.ts").then(({ default: Plugin }) => new Plugin()), {
+      on: "endpoint",
+      where: [Endpoints.results]
+    });
+  }
+});
+
+ready(
+  () => {
+    void import("./main/keyboard.ts");
+    void import("./main/search.ts");
+
+    if (settings.autocomplete) {
+      void import("./main/autocomplete.ts");
+    }
+  },
+  { on: [endpoint === Endpoints.index] }
+);
+
+ready(
+  () => {
+    void import("./main/keyboard.ts");
+    void import("./main/results.ts");
+    void import("./main/search.ts");
+
+    if (settings.autocomplete) {
+      void import("./main/autocomplete.ts");
+    }
+  },
+  { on: [endpoint === Endpoints.results] }
+);
+
+ready(
+  () => {
+    void import("./main/preferences.ts");
+  },
+  { on: [endpoint === Endpoints.preferences] }
+);