geonetwork-ui 2.7.0-dev.65c46841b → 2.7.0-dev.76c515d5b

package/src/libs/util/shared/src/lib/utils/geojson.ts

@@ -1,8 +1,11 @@
-import { Feature, FeatureCollection, Geometry } from 'geojson'
+import type { Feature, FeatureCollection, Geometry, Position } from 'geojson'
 
+/**
+ * @returns The geometry if available, otherwise null.
+ */
 export function getGeometryFromGeoJSON(
   data: FeatureCollection | Feature | Geometry
-): Geometry {
+): Geometry | null {
   if (data.type === 'FeatureCollection') {
     return data?.features?.[0]?.geometry || null
   }
@@ -24,3 +27,70 @@ export function getGeometryFromGeoJSON(
   }
   return null
 }
+
+// FIXME: this type should be more generic across the project
+export type BoundingBox = [number, number, number, number]
+
+export function getGeometryBoundingBox(geometry: Geometry): BoundingBox {
+  // use the bounding box if specified in the GeoJSON object
+  if (geometry.bbox) {
+    return geometry.bbox.length > 4
+      ? [geometry.bbox[0], geometry.bbox[1], geometry.bbox[3], geometry.bbox[4]]
+      : (geometry.bbox as BoundingBox)
+  }
+
+  const coordinatesReducer = (prev: BoundingBox, coords: Position) =>
+    [
+      Math.min(prev[0], coords[0]),
+      Math.min(prev[1], coords[1]),
+      Math.max(prev[2], coords[0]),
+      Math.max(prev[3], coords[1]),
+    ] as BoundingBox
+  const coordinatesArrayReducer = (
+    prev: BoundingBox,
+    coordsArray: Position[]
+  ) => {
+    const bbox = coordsArray.reduce(coordinatesReducer, emptyExtent)
+    return [
+      Math.min(prev[0], bbox[0]),
+      Math.min(prev[1], bbox[1]),
+      Math.max(prev[2], bbox[2]),
+      Math.max(prev[3], bbox[3]),
+    ] as BoundingBox
+  }
+  const emptyExtent = [Infinity, Infinity, -Infinity, -Infinity] as BoundingBox
+
+  switch (geometry.type) {
+    case 'MultiPolygon':
+      return geometry.coordinates.reduce((prev, polygonCoords) => {
+        const bbox = polygonCoords.reduce(coordinatesArrayReducer, emptyExtent)
+        return [
+          Math.min(prev[0], bbox[0]),
+          Math.min(prev[1], bbox[1]),
+          Math.max(prev[2], bbox[2]),
+          Math.max(prev[3], bbox[3]),
+        ] as BoundingBox
+      }, emptyExtent)
+    case 'GeometryCollection':
+      return geometry.geometries.reduce((prev, geom) => {
+        const bbox = getGeometryBoundingBox(geom)
+        return [
+          Math.min(prev[0], bbox[0]),
+          Math.min(prev[1], bbox[1]),
+          Math.max(prev[2], bbox[2]),
+          Math.max(prev[3], bbox[3]),
+        ] as BoundingBox
+      }, emptyExtent)
+    case 'Polygon':
+    case 'MultiLineString':
+      return geometry.coordinates.reduce(coordinatesArrayReducer, emptyExtent)
+    case 'LineString':
+    case 'MultiPoint':
+      return geometry.coordinates.reduce<BoundingBox>(
+        coordinatesReducer,
+        emptyExtent
+      )
+    case 'Point':
+      return coordinatesReducer(emptyExtent, geometry.coordinates)
+  }
+}

package/src/libs/util/shared/src/lib/utils/index.ts

@@ -4,6 +4,7 @@ export * from './format-fields'
 export * from './fuzzy-filter'
 export * from './geojson'
 export * from './image-resize'
+export * from './mobile-screen'
 export * from './no-duplicate-file-name'
 export * from './parse'
 export * from './remove-whitespace'

package/src/libs/util/shared/src/lib/utils/mobile-screen.ts

@@ -0,0 +1,14 @@
+import { fromEvent, startWith, map, shareReplay } from 'rxjs'
+
+/**
+ * This returns true when the screen size is under 768px, which is the mobile threshold.
+ */
+const MOBILE_MAX_WIDTH = 768
+
+export function getIsMobile() {
+  return fromEvent(window, 'resize').pipe(
+    startWith(window.innerWidth),
+    map(() => window.innerWidth < MOBILE_MAX_WIDTH),
+    shareReplay({ bufferSize: 1, refCount: true })
+  )
+}