@geogirafe/lib-geoportal 1.1.0-dev.2273129895 → 1.1.0-dev.2273214250

package/components/drawing/olDrawing.d.ts

@@ -12,6 +12,7 @@ import { Coordinate } from 'ol/coordinate.js';
 import { ContextMenu } from '../map/tools/contextmenu.js';
 import IGirafeContext from '../../tools/context/icontext.js';
 import { StyleFunction } from 'ol/style/Style.js';
+import Transform from 'ol-ext/interaction/Transform.js';
 export default class OlDrawing {
     private readonly map;
     private readonly toolName;
@@ -28,7 +29,7 @@ export default class OlDrawing {
     drawingLayer: VectorLayer;
     lastClosestFeature: Feature | null;
     translate: Translate | null;
-    rotateAndScale: Modify | null;
+    transform: Transform | null;
     defaultStyle: StyleFunction | undefined;
     private readonly updateGeometryInState;
     private get state();
@@ -39,8 +40,8 @@ export default class OlDrawing {
     private addSnapInteraction;
     private addTranslateInteraction;
     private removeTranslateInteraction;
-    private addRotateAndScaleInteraction;
-    private removeRotateAndScaleInteraction;
+    private addTransformInteraction;
+    private removeTransformInteraction;
     /**
      * Adds a context menu to the map with a single entry 'remove vertex'. The menu is configured to open
      * when the user does an alternate click ( = context event) on or near a vertex of a modifiable feature.

package/components/drawing/olDrawing.js

@@ -8,14 +8,13 @@ import VectorSource from 'ol/source/Vector.js';
 import VectorLayer from 'ol/layer/Vector.js';
 import GeoJSON from 'ol/format/GeoJSON.js';
 import { getPointResolution } from 'ol/proj.js';
-import { never, primaryAction } from 'ol/events/condition.js';
+import { always, never, primaryAction } from 'ol/events/condition.js';
 import { ensurePolygonIsProperlyClosed, getAreaOfPolygon, getDistance, getHalfPoint, getLabelStyle, getRadiusDataForCircle } from '../../tools/utils/olutils.js';
 import { ContextMenu, EntryInteractionType } from '../map/tools/contextmenu.js';
 import { formatCoordinates } from '../../tools/geometrytools.js';
 import { v4 as uuidv4 } from 'uuid';
 import { isAlternateMouseClick, isPrimaryPointerAction } from '../../tools/state/userinteractionevent.js';
-import { getCenter, getHeight, getWidth } from 'ol/extent.js';
-import CircleStyle from 'ol/style/Circle.js';
+import Transform from 'ol-ext/interaction/Transform.js';
 function getLineStroke(strokeType, lineWidth) {
     switch (strokeType) {
         case 'full':
@@ -48,46 +47,6 @@ function extractVerticesFromGeometry(geometry) {
     }
     return new MultiPoint(vertices);
 }
-function calculateCenter(geometry) {
-    let center, coordinates, minRadius;
-    if (geometry instanceof Polygon) {
-        let x = 0;
-        let y = 0;
-        let i = 0;
-        coordinates = geometry.getCoordinates()[0].slice();
-        for (const coordinate of coordinates) {
-            x += coordinate[0];
-            y += coordinate[1];
-            i++;
-        }
-        center = [x / i, y / i];
-    }
-    else if (geometry instanceof LineString) {
-        center = geometry.getCoordinateAt(0.5);
-        coordinates = geometry.getCoordinates();
-    }
-    else {
-        center = getCenter(geometry.getExtent());
-    }
-    let sqDistances;
-    if (coordinates) {
-        sqDistances = coordinates.map(function (coordinate) {
-            const dx = coordinate[0] - center[0];
-            const dy = coordinate[1] - center[1];
-            return dx * dx + dy * dy;
-        });
-        minRadius = Math.sqrt(Math.max(...sqDistances)) / 3;
-    }
-    else {
-        minRadius = Math.max(getWidth(geometry.getExtent()), getHeight(geometry.getExtent())) / 3;
-    }
-    return {
-        center: center,
-        coordinates: coordinates,
-        minRadius: minRadius,
-        sqDistances: sqDistances
-    };
-}
 export default class OlDrawing {
     map;
     toolName;
@@ -104,7 +63,7 @@ export default class OlDrawing {
     drawingLayer;
     lastClosestFeature = null;
     translate = null;
-    rotateAndScale = null;
+    transform = null;
     defaultStyle;
     updateGeometryInState = (olFeature) => {
         const idx = this.drawingState.features.findIndex((f) => f.id === olFeature.getId());
@@ -205,92 +164,34 @@ export default class OlDrawing {
             this.translate = null;
         }
     }
-    addRotateAndScaleInteraction() {
-        this.removeRotateAndScaleInteraction();
-        const defaultStyle = this.defaultStyle;
-        const getCoordinates = (feature) => {
-            const geometry = feature.getGeometry();
-            if (geometry instanceof Point) {
-                return geometry.getCoordinates();
-            }
-            else if (geometry instanceof LineString) {
-                return geometry.getCoordinates()[0];
-            }
-            else if (geometry instanceof Polygon) {
-                return geometry.getCoordinates()[0][0];
-            }
-            return [];
-        };
-        this.rotateAndScale = new Modify({
-            features: this.modifiableFeatures,
-            condition: (event) => {
-                return this.rotateAndScale != null && primaryAction(event);
-            },
-            deleteCondition: never,
-            insertVertexCondition: never,
-            style: function (feature, resolution) {
-                feature.get('features').forEach(function (modifyFeature) {
-                    const modifyGeometry = modifyFeature.get('modifyGeometry');
-                    if (modifyGeometry) {
-                        const point = getCoordinates(feature);
-                        let modifyPoint = modifyGeometry.point;
-                        if (!modifyPoint) {
-                            // save the initial geometry and vertex position
-                            modifyPoint = point;
-                            modifyGeometry.point = modifyPoint;
-                            modifyGeometry.geometry0 = modifyGeometry.geometry;
-                            // get anchor and minimum radius of vertices to be used
-                            const result = calculateCenter(modifyGeometry.geometry0);
-                            modifyGeometry.center = result.center;
-                            modifyGeometry.minRadius = result.minRadius;
-                        }
-                        const center = modifyGeometry.center;
-                        const minRadius = modifyGeometry.minRadius;
-                        let dx, dy;
-                        dx = modifyPoint[0] - center[0];
-                        dy = modifyPoint[1] - center[1];
-                        const initialRadius = Math.hypot(dx, dy);
-                        if (initialRadius > minRadius) {
-                            const initialAngle = Math.atan2(dy, dx);
-                            dx = point[0] - center[0];
-                            dy = point[1] - center[1];
-                            const currentRadius = Math.hypot(dx, dy);
-                            if (currentRadius > 0) {
-                                const currentAngle = Math.atan2(dy, dx);
-                                const geometry = modifyGeometry.geometry0.clone();
-                                geometry.scale(currentRadius / initialRadius, undefined, center);
-                                geometry.rotate(currentAngle - initialAngle, center);
-                                modifyGeometry.geometry = geometry;
-                            }
-                        }
-                    }
-                });
-                return defaultStyle(feature, resolution);
+    addTransformInteraction() {
+        this.transform = new Transform({
+            enableRotatedTransform: false,
+            features: new Collection(this.lastClosestFeature ? [this.lastClosestFeature] : []),
+            hitTolerance: this.map.pixelTolerance,
+            translateFeature: false,
+            scale: true,
+            rotate: true,
+            keepAspectRatio: always,
+            keepRectangle: false,
+            translate: false,
+            stretch: false,
+            pointRadius: function (f) {
+                const radius = f.get('radius') || 10;
+                return [radius, radius];
             }
         });
-        this.rotateAndScale.on('modifystart', function (event) {
-            // prettier-ignore
-            event.features.forEach(function (feature) {
-                feature.set('modifyGeometry', { geometry: feature.getGeometry().clone() }, true);
-            });
-        });
-        this.rotateAndScale.on('modifyend', (event) => {
-            // prettier-ignore
-            event.features.forEach((olFeature) => {
-                const modifyGeometry = olFeature.get('modifyGeometry');
-                if (modifyGeometry) {
-                    olFeature.setGeometry(modifyGeometry.geometry);
-                    olFeature.unset('modifyGeometry', true);
-                    this.updateGeometryInState(olFeature);
-                }
-            });
-        });
-        this.map.olMap.addInteraction(this.rotateAndScale);
+        this.map.olMap.addInteraction(this.transform);
+        if (this.lastClosestFeature) {
+            this.transform.select(this.lastClosestFeature, true);
+            this.lastClosestFeature.changed();
+        }
     }
-    removeRotateAndScaleInteraction() {
-        if (this.rotateAndScale) {
-            this.map.olMap.removeInteraction(this.rotateAndScale);
-            this.rotateAndScale = null;
+    removeTransformInteraction() {
+        if (this.transform) {
+            this.map.olMap.removeInteraction(this.transform);
+            this.transform = null;
+            this.lastClosestFeature?.changed();
         }
     }
     /**
@@ -334,9 +235,9 @@ export default class OlDrawing {
                 callback: (_evt, _mapCoordinate) => {
                     if (this.lastClosestFeature) {
                         this.removeModifyInteraction();
-                        this.addRotateAndScaleInteraction();
+                        this.addTransformInteraction();
                         this.map.olMap.on('singleclick', () => {
-                            this.removeRotateAndScaleInteraction();
+                            this.removeTransformInteraction();
                             this.addModifyInteraction();
                         });
                     }
@@ -790,7 +691,7 @@ export default class OlDrawing {
             addLabel(getHalfPoint(segment), dFeature.getLengthText(getDistance(segment, this.state.projection)));
             addLabel(square.getInteriorPoint(), dFeature.getAreaText(getAreaOfPolygon(square, this.state.projection)));
         }
-        if (dFeature.selected && this.rotateAndScale == null) {
+        if (dFeature.selected && this.transform == null) {
             const vertexStyle = dFeature.getVertexStyle();
             // Add a node style to every vertex of the geometry
             vertexStyle.setGeometry(function (f) {
@@ -801,35 +702,6 @@ export default class OlDrawing {
             });
             styles.push(vertexStyle);
         }
-        // Draw Point/Circle for Center of Geometry if rotating/scaling
-        if (this.rotateAndScale != null) {
-            const result = calculateCenter(geometry);
-            const center = result.center;
-            if (center) {
-                styles.push(new Style({
-                    geometry: new Point(center),
-                    image: new CircleStyle({
-                        radius: 4,
-                        fill: new Fill({
-                            color: '#ff3333'
-                        })
-                    })
-                }));
-                const coordinates = result.coordinates;
-                if (coordinates) {
-                    const minRadius = result.minRadius;
-                    const sqDistances = result.sqDistances;
-                    const rsq = minRadius * minRadius;
-                    const points = coordinates.filter(function (_c, index) {
-                        return sqDistances[index] > rsq;
-                    });
-                    const vertexStyle = dFeature.getVertexStyle();
-                    // Add a node style to every vertex of the geometry
-                    vertexStyle.setGeometry(new MultiPoint(points));
-                    styles.push(vertexStyle);
-                }
-            }
-        }
         return styles;
     }
     removeDrawInteraction() {

package/package.json

@@ -5,7 +5,7 @@
     "name": "GeoGirafe PSC",
     "url": "https://doc.geomapfish.dev"
   },
-  "version": "1.1.0-dev.2273129895",
+  "version": "1.1.0-dev.2273214250",
   "type": "module",
   "engines": {
     "node": ">=20.19.0"
@@ -36,7 +36,7 @@
     "buffer": "6.0.3",
     "d3": "7.9.0",
     "dompurify": "3.2.6",
-    "driver.js": "^1.3.6",
+    "driver.js": "1.3.6",
     "error-stack-parser": "2.1.4",
     "file-saver": "2.0.5",
     "jsts": "2.12.1",
@@ -56,6 +56,7 @@
     "@types/geojson": "7946",
     "cesium": ">1.113",
     "ol": "8 || 9 || 10",
+    "ol-ext": "^4.0.37",
     "ol-mapbox-style": "12",
     "olcs": "2",
     "proj4": "2"
@@ -69,6 +70,7 @@
     "@types/geojson": "7946.0.16",
     "@types/jsts": "0.17.24",
     "@types/lodash-es": "4.17.12",
+    "@types/ol-ext": "npm:@siedlerchr/types-ol-ext@3.6.5",
     "@types/serviceworker": "0.0.147",
     "@types/tabulator-tables": "6.2.9",
     "@types/uuid": "10.0.0",
@@ -93,6 +95,7 @@
     "svgo": "4.0.0",
     "typescript": "5.8.3",
     "vite": "7.0.6",
+    "vite-bundle-analyzer": "1.3.2",
     "vite-plugin-html": "3.2.2",
     "vite-plugin-static-copy": "3.1.1",
     "vitest": "3.2.4"
@@ -157,6 +160,7 @@
     "prepare-commit": "npm run pretty && npm run tsc && npm run lint && npm run test && npm run build && npm run build-lib",
     "generate-dev-certs-win": "buildtools\\generate-dev-certs.cmd",
     "generate-dev-certs-nix": "bash -C './buildtools/generate-dev-certs.sh'",
-    "trust-default-dev-certs-win": "buildtools\\trust-dev-certs.cmd"
+    "trust-default-dev-certs-win": "buildtools\\trust-dev-certs.cmd",
+    "size-analysis": "node buildtools/app-clean.js && cross-env NODE_OPTIONS=--max-old-space-size=8192 vite build --mode analyze"
   }
 }

package/templates/public/about.json

@@ -1 +1 @@
-{"version":"1.1.0-dev.2273129895", "build":"2273129895", "date":"20/01/2026"}
+{"version":"1.1.0-dev.2273214250", "build":"2273214250", "date":"20/01/2026"}

package/templates/vite.config.js

@@ -7,6 +7,7 @@ import { HtmlRebuildPlugin } from '@geogirafe/lib-geoportal/buildtools';
 import { createHtmlPlugin } from 'vite-plugin-html';
 import { viteStaticCopy } from 'vite-plugin-static-copy';
 import dns from 'dns';
+import analyzer from 'vite-bundle-analyzer';
 
 /**
  * Custom name resolution for app.localhost:
@@ -43,7 +44,7 @@ const geogirafeSource = 'node_modules/@geogirafe/lib-geoportal';
 const certsDirectory = 'certs';
 
 // https://v2.vitejs.dev/config/
-export default defineConfig(({ command }) => {
+export default defineConfig(({ command, mode }) => {
   return {
     base: './',
     server: {
@@ -112,7 +113,6 @@ export default defineConfig(({ command }) => {
           { src: `${geogirafeSource}/styles/*.css`, dest: 'styles/' },
           { src: `${geogirafeSource}/assets/*`, dest: '' },
           { src: `${geogirafeSource}/tools/auth/silentlogincallback.html`, dest: '' },
-          //{ src: `${geogirafeSource}/api/index.html`, dest: 'api/' },
           { src: 'node_modules/ol/ol.css', dest: 'lib/ol/' },
           { src: 'node_modules/tabulator-tables/dist/css/tabulator.min.css', dest: 'lib/tabulator-tables/' },
           { src: 'node_modules/tippy.js/dist/*.css', dest: 'lib/tippy.js/' },
@@ -123,7 +123,15 @@ export default defineConfig(({ command }) => {
       HtmlRebuildPlugin(),
       createHtmlPlugin({
         minify: true
-      })
+      }),
+      mode === 'analyze' &&
+        // https://www.npmjs.com/package/vite-bundle-analyzer
+        analyzer({
+          analyzerMode: 'static',
+          openAnalyzer: true,
+          defaultSizes: 'brotli', // or "gzip"
+          summary: true
+        })
     ],
     define: {
       // Define relative base path in cesium for loading assets