@geops/rvf-mobility-web-component 0.1.74 → 0.1.75

package/src/RvfSingleClickListener/RvfSingleClickListener.tsx

@@ -1,238 +0,0 @@
-import { getFeatureInfoAtCoordinate } from "mobility-toolbox-js/ol";
-import { GeoJSON } from "ol/format";
-import { unByKey } from "ol/Observable";
-import { useCallback, useEffect } from "preact/hooks";
-
-import {
-  LAYER_NAME_REALTIME,
-  LAYER_NAME_STATIONS,
-  PROVIDER_LOGOS_BY_FEED_ID,
-} from "../utils/constants";
-import useMapContext from "../utils/hooks/useMapContext";
-import useRvfContext from "../utils/hooks/useRvfContext";
-import MobilityEvent from "../utils/MobilityEvent";
-import { fetchSharingStation } from "../utils/sharingGraphqlUtils";
-
-import type { GeoJSONSource } from "maplibre-gl";
-import type { Feature, MapBrowserEvent } from "ol";
-
-const geojson = new GeoJSON();
-
-function SingleClickListener({ eventNode }: { eventNode: HTMLElement }) {
-  const {
-    baseLayer,
-    map,
-    queryablelayers,
-    realtimeLayer,
-    setStationId,
-    setTrainId,
-    stationId,
-    stationsLayer,
-    tenant,
-    trainId,
-  } = useMapContext();
-  const { selectedFeature, setSelectedFeature, setSelectedFeatures } =
-    useRvfContext();
-
-  // Send the selctedFEature to the parent window
-  useEffect(() => {
-    eventNode?.dispatchEvent(
-      new MobilityEvent("mwc:selectedfeature", {
-        feature: selectedFeature
-          ? geojson.writeFeatureObject(selectedFeature)
-          : null,
-      }),
-    );
-  }, [eventNode, selectedFeature]);
-
-  const onPointerMove = useCallback(
-    (evt: MapBrowserEvent<PointerEvent>) => {
-      const [realtimeFeature] = evt.map.getFeaturesAtPixel(evt.pixel, {
-        hitTolerance: 5,
-        layerFilter: (l) => {
-          return l === realtimeLayer;
-        },
-      });
-      realtimeLayer?.highlight(realtimeFeature as Feature);
-
-      const stationsFeatures = evt.map.getFeaturesAtPixel(evt.pixel, {
-        layerFilter: (l) => {
-          return l === stationsLayer;
-        },
-      });
-
-      const [stationFeature] = stationsFeatures.filter((feat) => {
-        return feat.get("tralis_network")?.includes(tenant);
-      });
-
-      // Send all the features under the cursor
-      const features = evt.map.getFeaturesAtPixel(evt.pixel, {
-        layerFilter: (l) => {
-          return queryablelayers
-            ? queryablelayers.split(",").includes(l.get("name"))
-            : l.get("isQueryable");
-        },
-      }) as Feature[];
-
-      evt.map.getTargetElement().style.cursor =
-        realtimeFeature || stationFeature || features?.length
-          ? "pointer"
-          : "default";
-    },
-    [queryablelayers, realtimeLayer, stationsLayer, tenant],
-  );
-
-  const onSingleClick = useCallback(
-    async (evt: MapBrowserEvent<PointerEvent>) => {
-      if (!baseLayer?.mapLibreMap) {
-        return;
-      }
-      const [realtimeFeature] = evt.map.getFeaturesAtPixel(evt.pixel, {
-        hitTolerance: 5,
-        layerFilter: (l) => {
-          return l === realtimeLayer;
-        },
-      }) as Feature[];
-      realtimeFeature?.set("layerName", LAYER_NAME_REALTIME);
-
-      const stationsFeatures = evt.map.getFeaturesAtPixel(evt.pixel, {
-        layerFilter: (l) => {
-          return l === stationsLayer;
-        },
-      });
-      const [stationFeature] = stationsFeatures.filter((feat) => {
-        return feat.get("tralis_network")?.includes(tenant);
-      }) as Feature[];
-      stationFeature?.set("layerName", LAYER_NAME_STATIONS);
-
-      const newStationId = stationFeature?.get("uid");
-
-      const newTrainId = realtimeFeature?.get("train_id");
-
-      if (newStationId && stationId !== newStationId) {
-        setStationId(newStationId);
-        setTrainId(null);
-      } else if (newTrainId && newTrainId !== trainId) {
-        setTrainId(realtimeFeature.get("train_id"));
-        setStationId(null);
-      } else {
-        setTrainId(null);
-        setStationId(null);
-      }
-
-      // Send all the features under the cursor
-      // const features = evt.map.getFeaturesAtPixel(evt.pixel, {
-      //   hitTolerance: 5,
-      //   layerFilter: (l) => {
-      //     console.log(queryablelayers);
-      //     return queryablelayers
-      //       ? queryablelayers.split(",").includes(l.get("name"))
-      //       : l.get("isQueryable");
-      //   },
-      // }) as Feature[];
-
-      const queryableLayers = evt.map.getAllLayers().filter((l) => {
-        return queryablelayers
-          ? queryablelayers.split(",").includes(l.get("name"))
-          : l.get("isQueryable");
-      });
-      const featuresInfos = await getFeatureInfoAtCoordinate(
-        evt.coordinate,
-        queryableLayers,
-        5,
-        true,
-      );
-
-      // Set the layerName as property of the feature
-      featuresInfos.forEach((f) => {
-        f.features.forEach((feat) => {
-          feat.set("layerName", f.layer.get("name"));
-        });
-      });
-
-      const features = featuresInfos.flatMap((f) => {
-        return f.features;
-      });
-
-      // Append more infos about the features
-      for (const feature of features) {
-        const clusterId = feature.get("cluster_id");
-        if (clusterId) {
-          const vtFeat = feature.get("vectorTileFeature");
-          const sourceId = vtFeat.layer.source;
-          const leaves =
-            (await baseLayer.mapLibreMap
-              .getSource<GeoJSONSource>(sourceId)
-              ?.getClusterLeaves(clusterId, 1000, 0)) || [];
-
-          feature.set(
-            "clusterLeaves",
-            leaves.map((l) => {
-              return geojson.readFeature(l);
-            }),
-          );
-        }
-
-        // Sharing station
-        const sharingStationId = selectedFeature?.get("station_id");
-        if (sharingStationId) {
-          const sharingStationInfo =
-            await fetchSharingStation(sharingStationId);
-          selectedFeature.setProperties(sharingStationInfo);
-          selectedFeature.set(
-            "provider_logo",
-            PROVIDER_LOGOS_BY_FEED_ID[selectedFeature?.get("feed_id")],
-          );
-        }
-      }
-
-      if (newStationId || newTrainId || !features.length) {
-        setSelectedFeature(null);
-        setSelectedFeatures([]);
-      } else {
-        setSelectedFeatures(features);
-
-        // We prioritize some layers like the notification one over the others
-        const notificationFeature = features.find((feat) => {
-          return feat.get("situation");
-        });
-        if (notificationFeature) {
-          setSelectedFeature(notificationFeature);
-        } else {
-          setSelectedFeature(features[0]);
-        }
-      }
-    },
-    [
-      baseLayer?.mapLibreMap,
-      stationId,
-      trainId,
-      realtimeLayer,
-      stationsLayer,
-      tenant,
-      setStationId,
-      setTrainId,
-      queryablelayers,
-      selectedFeature,
-      setSelectedFeature,
-      setSelectedFeatures,
-    ],
-  );
-
-  useEffect(() => {
-    const key = map?.on("singleclick", onSingleClick);
-    return () => {
-      unByKey(key);
-    };
-  }, [map, onSingleClick]);
-
-  useEffect(() => {
-    const key = map?.on("pointermove", onPointerMove);
-    return () => {
-      unByKey(key);
-    };
-  }, [map, onPointerMove]);
-
-  return null;
-}
-export default SingleClickListener;

package/src/RvfSingleClickListener/index.tsx

@@ -1 +0,0 @@
-export { default } from "./RvfSingleClickListener";