Reduce redundancy

gisaia · Dec 20, 2024 · 5bf9391 · 5bf9391
1 parent e69b0b3
commit 5bf9391
Show file tree

Hide file tree

Showing 5 changed files with 106 additions and 185 deletions.
diff --git a/projects/arlas-map/src/lib/draw/modes/circles/radius.circle.mode.ts b/projects/arlas-map/src/lib/draw/modes/circles/radius.circle.mode.ts
@@ -21,6 +21,7 @@ import MapboxDraw from '@mapbox/mapbox-gl-draw';
 import circle from '@turf/circle';
 import length from '@turf/length';
 import numeral from 'numeral';
+import { displayFeatures, updateCoordinates } from '../utils';
 
 export const radiusCircleMode = { ...MapboxDraw.modes.draw_line_string };
 
@@ -29,21 +30,6 @@ radiusCircleMode.fireOnStop = function () {
     this.map.fire('draw.onStop', 'draw end');
   };
 
-function createVertex(parentId, coordinates, path, selected) {
-    return {
-        type: 'Feature',
-        properties: {
-            meta: 'vertex',
-            parent: parentId,
-            coord_path: path,
-            active: selected ? 'true' : 'false',
-        },
-        geometry: {
-            type: 'Point',
-            coordinates,
-        },
-    };
-}
 
 function getDisplayMeasurements(feature) {
     // should log both metric and standard display strings for the current drawn feature
@@ -144,17 +130,7 @@ radiusCircleMode.clickAnywhere = function (state, e) {
         e.lngLat.lng,
         e.lngLat.lat
     );
-    if (state.direction === 'forward') {
-        state.currentVertexPosition += 1; // eslint-disable-line
-        state.line.updateCoordinate(
-            state.currentVertexPosition,
-            e.lngLat.lng,
-            e.lngLat.lat
-        );
-    } else {
-        state.line.addCoordinate(0, e.lngLat.lng, e.lngLat.lat);
-    }
-
+    updateCoordinates(state, e);
     return null;
 };
 
@@ -199,41 +175,7 @@ radiusCircleMode.onStop = function (state) {
 };
 
 radiusCircleMode.toDisplayFeatures = function (state, geojson, display) {
-    const isActiveLine = geojson.properties.id === state.line.id;
-    geojson.properties.active = isActiveLine ? 'true' : 'false';
-    if (!isActiveLine) {
-        if (!geojson.geometry.coordinates[0][0]) {
-            return null;
-        }
-        return display(geojson);
-    }
-
-    // Only render the line if it has at least one real coordinate
-    if (geojson.geometry.coordinates.length < 2) {
-        return null;
-    }
-    geojson.properties.meta = 'feature';
-
-    // displays center vertex as a point feature
-    display(
-        createVertex(
-            state.line.id,
-            geojson.geometry.coordinates[
-            state.direction === 'forward'
-                ? geojson.geometry.coordinates.length - 2
-                : 1
-            ],
-            `${state.direction === 'forward'
-                ? geojson.geometry.coordinates.length - 2
-                : 1
-            }`,
-            false
-        )
-    );
-
-    // displays the line as it is drawn
-    display(geojson);
-
+    displayFeatures(state, geojson, display);
     const displayMeasurements = getDisplayMeasurements(geojson);
 
     // create custom feature for the current pointer position

diff --git a/projects/arlas-map/src/lib/draw/modes/circles/utils.ts b/projects/arlas-map/src/lib/draw/modes/circles/utils.ts
@@ -59,4 +59,3 @@ export const dragPan = {
         }, 0);
     }
 };
-
diff --git a/projects/arlas-map/src/lib/draw/modes/strip/strip.mode.ts b/projects/arlas-map/src/lib/draw/modes/strip/strip.mode.ts
@@ -18,31 +18,16 @@
  */
 
 import MapboxDraw from '@mapbox/mapbox-gl-draw';
-import { polygon, point, bearingToAzimuth } from '@turf/helpers';
-import rhumbDestination from '@turf/rhumb-destination';
-import rhumbBearing from '@turf/rhumb-bearing';
+import { bearingToAzimuth, point, polygon } from '@turf/helpers';
 import length from '@turf/length';
+import rhumbBearing from '@turf/rhumb-bearing';
+import rhumbDestination from '@turf/rhumb-destination';
 import transformRotate from '@turf/transform-rotate';
 import transformTranslate from '@turf/transform-translate';
+import { displayFeatures, updateCoordinates } from '../utils';
 
 export const stripMode = { ...MapboxDraw.modes.draw_line_string };
 
-function createVertex(parentId, coordinates, path, selected) {
-    return {
-        type: 'Feature',
-        properties: {
-            meta: 'vertex',
-            parent: parentId,
-            coord_path: path,
-            active: selected ? 'true' : 'false',
-        },
-        geometry: {
-            type: 'Point',
-            coordinates,
-        },
-    };
-}
-
 export function rotateStrip(start, end, state, currentMaxBearing = 0, options: any = {}) {
     const properties = options.properties ? options.properties : {};
     const startPoint = point(start);
@@ -149,16 +134,7 @@ stripMode.clickAnywhere = function (state, e) {
         e.lngLat.lng,
         e.lngLat.lat
     );
-    if (state.direction === 'forward') {
-        state.currentVertexPosition += 1; // eslint-disable-line
-        state.line.updateCoordinate(
-            state.currentVertexPosition,
-            e.lngLat.lng,
-            e.lngLat.lat
-        );
-    } else {
-        state.line.addCoordinate(0, e.lngLat.lng, e.lngLat.lat);
-    }
+    updateCoordinates(state, e);
     return null;
 };
 
@@ -177,7 +153,7 @@ stripMode.onMouseMove = function (state, e) {
             const translatedPoint = transformTranslate(endPoint, translateDistance, bearing);
             const stripFeature = buildStrip(start, translatedPoint.geometry.coordinates, state.halfSwath);
             stripFeature.properties.parent = state.line.id;
-            (stripFeature.properties as any).meta = 'strip';
+            (stripFeature.properties).meta = 'strip';
             state.strip.setCoordinates(stripFeature.geometry.coordinates);
             state.currentMaxBearing = bearing;
             state.isStripDrew = true;
@@ -228,40 +204,8 @@ stripMode.onStop = function (state) {
 };
 
 stripMode.toDisplayFeatures = function (state, geojson, display) {
-    const isActiveLine = geojson.properties.id === state.line.id;
-    geojson.properties.active = isActiveLine ? 'true' : 'false';
-    if (!isActiveLine) {
-        if (!geojson.geometry.coordinates[0][0]) {
-            return null;
-        }
-        return display(geojson);
-    }
-
-    // Only render the line if it has at least one real coordinate
-    if (geojson.geometry.coordinates.length < 2) {
-        return null;
-    }
-    geojson.properties.meta = 'feature';
-
-    // displays center vertex as a point feature
-    display(
-        createVertex(
-            state.line.id,
-            geojson.geometry.coordinates[
-            state.direction === 'forward'
-                ? geojson.geometry.coordinates.length - 2
-                : 1
-            ],
-            `${state.direction === 'forward'
-                ? geojson.geometry.coordinates.length - 2
-                : 1
-            }`,
-            false
-        )
-    );
+    displayFeatures(state, geojson, display);
 
-    // displays the line as it is drawn
-    display(geojson);
 
     // create custom feature for the current pointer position
     const currentVertex = {

diff --git a/projects/arlas-map/src/lib/draw/modes/utils.ts b/projects/arlas-map/src/lib/draw/modes/utils.ts
@@ -0,0 +1,85 @@
+/*
+ * Licensed to Gisaïa under one or more contributor
+ * license agreements. See the NOTICE.txt file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Gisaïa licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+export function createDrawVertex(parentId, coordinates, path, selected) {
+    return {
+        type: 'Feature',
+        properties: {
+            meta: 'vertex',
+            parent: parentId,
+            coord_path: path,
+            active: selected ? 'true' : 'false',
+        },
+        geometry: {
+            type: 'Point',
+            coordinates,
+        },
+    };
+}
+export function displayFeatures(state, geojson, display) {
+    const isActiveLine = geojson.properties.id === state.line.id;
+    geojson.properties.active = isActiveLine ? 'true' : 'false';
+    if (!isActiveLine) {
+        if (!geojson.geometry.coordinates[0][0]) {
+            return null;
+        }
+        return display(geojson);
+    }
+
+    // Only render the line if it has at least one real coordinate
+    if (geojson.geometry.coordinates.length < 2) {
+        return null;
+    }
+    geojson.properties.meta = 'feature';
+
+    // displays center vertex as a point feature
+    display(
+        createDrawVertex(
+            state.line.id,
+            geojson.geometry.coordinates[
+            state.direction === 'forward'
+                ? geojson.geometry.coordinates.length - 2
+                : 1
+            ],
+            `${state.direction === 'forward'
+                ? geojson.geometry.coordinates.length - 2
+                : 1
+            }`,
+            false
+        )
+    );
+
+    // displays the line as it is drawn
+    display(geojson);
+
+}
+
+
+export function updateCoordinates(state, e) {
+    if (state.direction === 'forward') {
+        state.currentVertexPosition += 1; // eslint-disable-line
+        state.line.updateCoordinate(
+            state.currentVertexPosition,
+            e.lngLat.lng,
+            e.lngLat.lat
+        );
+    } else {
+        state.line.addCoordinate(0, e.lngLat.lng, e.lngLat.lat);
+    }
+}
diff --git a/src/tools/map.constants.ts b/src/tools/map.constants.ts
@@ -25,67 +25,18 @@ export const defaultBasemapStyle = {
   styleFile: 'https://api.maptiler.com/maps/basic/style.json?key=xIhbu1RwgdbxfZNmoXn4',
   image: 'https://cloud.maptiler.com/static/img/maps/basic.png'
 };
+
+export function getStyle(name: string) {
+  return ({
+    name,
+    styleFile: `https://api.maptiler.com/maps/${name}/style.json?key=xIhbu1RwgdbxfZNmoXn4`,
+    image: `https://cloud.maptiler.com/static/img/maps/${name}.png`
+  })
+}
 export const basemapStyles = [
-  {
-    name: 'Basic',
-    styleFile: 'https://api.maptiler.com/maps/basic/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://cloud.maptiler.com/static/img/maps/basic.png'
-  },
-  {
-    name: 'Bright',
-    styleFile: 'https://api.maptiler.com/maps/bright/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://cloud.maptiler.com/static/img/maps/bright.png'
-  },
-  {
-    name: 'Pastel',
-    styleFile: 'https://api.maptiler.com/maps/pastel/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://cloud.maptiler.com/static/img/maps/pastel.png'
-  },
-  {
-    name: 'Satellite Hybrid',
-    styleFile: 'https://api.maptiler.com/maps/hybrid/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://cloud.maptiler.com/static/img/maps/hybrid.png'
-  },
-  {
-    name: 'Streets',
-    styleFile: 'https://api.maptiler.com/maps/streets/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://cloud.maptiler.com/static/img/maps/streets.png'
-  },
-  {
-    name: 'Topo',
-    styleFile: 'https://api.maptiler.com/maps/topo/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://cloud.maptiler.com/static/img/maps/topo.png'
-  },
-  {
-    name: 'Topographique',
-    styleFile: 'https://api.maptiler.com/maps/topographique/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://cloud.maptiler.com/static/img/maps/topographique.png'
-  },
-  {
-    name: 'Voyager',
-    styleFile: 'https://api.maptiler.com/maps/voyager/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://cloud.maptiler.com/static/img/maps/voyager.png'
-  },
-  {
-    name: 'Positron',
-    styleFile: 'https://api.maptiler.com/maps/8bb9093c-9865-452b-8be4-7a397f552b49/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://api.maptiler.com/maps/8bb9093c-9865-452b-8be4-7a397f552b49/0/0/0.png?key=xIhbu1RwgdbxfZNmoXn4'
-  },
-  {
-    name: 'Dark Topo',
-    styleFile: 'https://api.maptiler.com/maps/99521f88-ff7f-4c7b-b1dc-05a5a773b1f1/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://api.maptiler.com/maps/99521f88-ff7f-4c7b-b1dc-05a5a773b1f1/0/0/0.png?key=xIhbu1RwgdbxfZNmoXn4'
-  },
-  {
-    name: 'Streets-dark',
-    styleFile: 'https://api.maptiler.com/maps/a1e62ee0-aca6-451a-a4b8-42250422a212/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    image: 'https://api.maptiler.com/maps/a1e62ee0-aca6-451a-a4b8-42250422a212/0/0/0.png?key=xIhbu1RwgdbxfZNmoXn4'
-  },
-  {
-    name: 'Streets-light',
-    styleFile: 'https://api.maptiler.com/maps/208a41eb-368f-4003-8e3c-2dba0d90b3cb/style.json?key=xIhbu1RwgdbxfZNmoXn4',
-    'image': 'https://api.maptiler.com/maps/208a41eb-368f-4003-8e3c-2dba0d90b3cb/0/0/0.png?key=xIhbu1RwgdbxfZNmoXn4'
-  }
+  getStyle('basic'),
+  getStyle('bright'),
+  getStyle('hybrid')
 ];
 
 export const geojsondata = {
Original file line number	Diff line number	Diff line change
Expand Up		@@ -59,4 +59,3 @@ export const dragPan = {
		}, 0);
		}
		};