[enh] theme/simple: custom router

Lay the foundation for loading scripts granularly depending on the endpoint it's
on.

Remove vendor specific prefixes as there are now managed by browserslist and
LightningCSS.

Enabled quite a few rules in Biome that don't come in recommended to better
catch issues and improve consistency.

Related:

- https://github.com/searxng/searxng/pull/5073#discussion_r2256037965
- https://github.com/searxng/searxng/pull/5073#discussion_r2256057100

1 files changed, 73 insertions, 78 deletions

diff --git a/client/simple/src/js/main/mapresult.ts b/client/simple/src/js/main/mapresult.ts
index 421b41f77..378e1e54f 100644
--- a/client/simple/src/js/main/mapresult.ts
+++ b/client/simple/src/js/main/mapresult.ts
@@ -1,89 +1,84 @@
-import { searxng } from "./00_toolkit.ts";
+import { listen } from "../core/toolkit.ts";
 
-searxng.ready(
-  () => {
-    searxng.listen("click", ".searxng_init_map", async function (this: HTMLElement, event: Event) {
-      event.preventDefault();
-      this.classList.remove("searxng_init_map");
+listen("click", ".searxng_init_map", async function (this: HTMLElement, event: Event) {
+  event.preventDefault();
+  this.classList.remove("searxng_init_map");
 
-      const {
-        View,
-        OlMap,
-        TileLayer,
-        VectorLayer,
-        OSM,
-        VectorSource,
-        Style,
-        Stroke,
-        Fill,
-        Circle,
-        fromLonLat,
-        GeoJSON,
-        Feature,
-        Point
-      } = await import("../pkg/ol.ts");
-      import("ol/ol.css");
+  const {
+    View,
+    OlMap,
+    TileLayer,
+    VectorLayer,
+    OSM,
+    VectorSource,
+    Style,
+    Stroke,
+    Fill,
+    Circle,
+    fromLonLat,
+    GeoJSON,
+    Feature,
+    Point
+  } = await import("../pkg/ol.ts");
+  import("ol/ol.css");
 
-      const { leafletTarget: target, mapLon, mapLat, mapGeojson } = this.dataset;
+  const { leafletTarget: target, mapLon, mapLat, mapGeojson } = this.dataset;
 
-      const lon = parseFloat(mapLon || "0");
-      const lat = parseFloat(mapLat || "0");
-      const view = new View({ maxZoom: 16, enableRotation: false });
-      const map = new OlMap({
-        target,
-        layers: [new TileLayer({ source: new OSM({ maxZoom: 16 }) })],
-        view
-      });
+  const lon = Number.parseFloat(mapLon || "0");
+  const lat = Number.parseFloat(mapLat || "0");
+  const view = new View({ maxZoom: 16, enableRotation: false });
+  const map = new OlMap({
+    target: target,
+    layers: [new TileLayer({ source: new OSM({ maxZoom: 16 }) })],
+    view: view
+  });
 
-      try {
-        const markerSource = new VectorSource({
-          features: [
-            new Feature({
-              geometry: new Point(fromLonLat([lon, lat]))
-            })
-          ]
-        });
+  try {
+    const markerSource = new VectorSource({
+      features: [
+        new Feature({
+          geometry: new Point(fromLonLat([lon, lat]))
+        })
+      ]
+    });
 
-        const markerLayer = new VectorLayer({
-          source: markerSource,
-          style: new Style({
-            image: new Circle({
-              radius: 6,
-              fill: new Fill({ color: "#3050ff" })
-            })
-          })
-        });
+    const markerLayer = new VectorLayer({
+      source: markerSource,
+      style: new Style({
+        image: new Circle({
+          radius: 6,
+          fill: new Fill({ color: "#3050ff" })
+        })
+      })
+    });
 
-        map.addLayer(markerLayer);
-      } catch (error) {
-        console.error("Failed to create marker layer:", error);
-      }
+    map.addLayer(markerLayer);
+  } catch (error) {
+    console.error("Failed to create marker layer:", error);
+  }
 
-      if (mapGeojson) {
-        try {
-          const geoSource = new VectorSource({
-            features: new GeoJSON().readFeatures(JSON.parse(mapGeojson), {
-              dataProjection: "EPSG:4326",
-              featureProjection: "EPSG:3857"
-            })
-          });
+  if (mapGeojson) {
+    try {
+      const geoSource = new VectorSource({
+        features: new GeoJSON().readFeatures(JSON.parse(mapGeojson), {
+          dataProjection: "EPSG:4326",
+          featureProjection: "EPSG:3857"
+        })
+      });
 
-          const geoLayer = new VectorLayer({
-            source: geoSource,
-            style: new Style({
-              stroke: new Stroke({ color: "#3050ff", width: 2 }),
-              fill: new Fill({ color: "#3050ff33" })
-            })
-          });
+      const geoLayer = new VectorLayer({
+        source: geoSource,
+        style: new Style({
+          stroke: new Stroke({ color: "#3050ff", width: 2 }),
+          fill: new Fill({ color: "#3050ff33" })
+        })
+      });
 
-          map.addLayer(geoLayer);
+      map.addLayer(geoLayer);
 
-          view.fit(geoSource.getExtent(), { padding: [20, 20, 20, 20] });
-        } catch (error) {
-          console.error("Failed to create GeoJSON layer:", error);
-        }
-      }
-    });
-  },
-  { on: [searxng.endpoint === "results"] }
-);
+      view.fit(geoSource.getExtent(), { padding: [20, 20, 20, 20] });
+    } catch (error) {
+      console.error("Failed to create GeoJSON layer:", error);
+    }
+  }
+});