v2.8.1 (#1912)

origo-map · Dec 4, 2023 · 6ba7814 · 6ba7814
1 parent 52edda2
commit 6ba7814
Show file tree

Hide file tree

Showing 5 changed files with 103 additions and 64 deletions.
diff --git a/build/css/style.css b/build/css/style.css
@@ -2808,6 +2808,14 @@ body {
     display: none; }
   .o-map .printmap-north-arrow {
     display: block; }
+  .o-map .print-map-loading-spinner {
+    display: inline-block;
+    width: 45px;
+    height: 45px;
+    border: 16px solid rgba(255, 255, 255, 0.884);
+    border-radius: 50%;
+    border-top-color: #008ff5;
+    animation: spin 1s ease-in-out infinite; }
   @media print {
     .o-map .no-print {
       display: none; } }

diff --git a/build/js/origo.js b/build/js/origo.js
@@ -50588,6 +50588,7 @@ const Origo = function Origo(configPath, options = {}) {
     featureinfoOptions: {},
     crossDomain: true,
     target: '#app-wrapper',
+    keyboardEventTarget: document,
     svgSpritePath: 'css/svg/',
     svgSprites: ['fa-icons.svg', 'material-icons.svg', 'miscellaneous.svg', 'origo-icons.svg', 'custom.svg'],
     breakPoints: {
@@ -54042,27 +54043,31 @@ function agsTransaction(transObj, layerName, viewer) {
     }
   }
 
+  function getFormData(object) {
+    const formData = new FormData();
+    Object.keys(object).forEach(key => formData.append(key, object[key]));
+    return formData;
+  }
+
   const cb = {
     update: updateSuccess,
     insert: insertSuccess,
     delete: deleteSuccess
   };
   types.forEach((type) => {
     if (transObj[type]) {
-      const u = source.url.slice(-1) === '/' ? source.url : `${source.url}/`;
-      const i = `${id}`.slice(-1) === '/' ? id : `${id}/`;
-      const url = u + i + urlSuffix[type];
+      const url = `${source.url}/${id}/${urlSuffix[type]}`;
 
       const data = writeAgsTransaction(transObj[type], {
         projection,
         type
       });
       fetch(url, {
         method: 'POST',
-        body: data
-      }, cb[type])
+        body: getFormData(data)
+      })
         .then(res => res.json())
-        .then(json => json)
+        .then(json => cb[type](json))
         .catch(err => error(err));
     }
   });
@@ -63173,6 +63178,10 @@ const PrintComponent = function PrintComponent(options = {}) {
 
   const printMapComponent = (0,_print_map__WEBPACK_IMPORTED_MODULE_3__["default"])({ logo, northArrow, map, viewer, showNorthArrow, printLegend, showPrintLegend });
 
+  const centerComponent = (0,_ui__WEBPACK_IMPORTED_MODULE_1__.Element)({ cls: 'flex column align-start absolute center-center transparent z-index-ontop-middle' });
+  const printMapSpinner = (0,_ui__WEBPACK_IMPORTED_MODULE_1__.Element)({ cls: 'print-map-loading-spinner' });
+  centerComponent.addComponent(printMapSpinner);
+
   const closeButton = (0,_ui__WEBPACK_IMPORTED_MODULE_1__.Button)({
     cls: 'fixed top-right medium round icon-smaller light box-shadow z-index-ontop-high',
     icon: '#ic_close_24px',
@@ -63259,10 +63268,12 @@ const PrintComponent = function PrintComponent(options = {}) {
 
   function disablePrintToolbar() {
     printToolbar.setDisabled(true);
+    document.querySelector(`#${printMapSpinner.getId()}`).style.display = '';
   }
 
   function enablePrintToolbar() {
     printToolbar.setDisabled(false);
+    document.querySelector(`#${printMapSpinner.getId()}`).style.display = 'none';
   }
 
   function updateScaleOnMove() {
@@ -63618,6 +63629,7 @@ const PrintComponent = function PrintComponent(options = {}) {
             </div>
           </div>
         </div>
+        ${centerComponent.render()}
         <div id="o-print-tools-left" class="top-left fixed no-print flex column spacing-vertical-small z-index-ontop-top height-full">
           ${printSettings.render()}
           ${printInteractionToggle.render()}
@@ -64708,7 +64720,7 @@ function PrintResize(options = {}) {
     if (isVector(layer)) {
       const features = source.getFeatures();
       const styleName = layer.get('styleName');
-      let style = viewer.getStyle();
+      let style = viewer.getStyle(styleName);
 
       const clusterStyleName = layer.get('clusterStyle') ? layer.get('clusterStyle') : undefined;
       if (typeof layer.get('styleName') !== 'undefined' && layer.get('styleName') !== 'origoStylefunction' && layer.get('styleName') !== 'default') {
@@ -68011,8 +68023,8 @@ const Featureinfo = function Featureinfo(options = {}) {
   };
 
   /**
-  * Shows the featureinfo popup/sidebar/infowindow for the provided feature and fit the view to it.
-  * @param {any} featureObj An object containing layerName and feature
+  * Shows the featureinfo popup/sidebar/infowindow for the provided features and fit the view to it.
+  * @param {any} featureObj An object containing layerName and feature. "feature" is either one Feature or an Array of Feature
   * @param {any} opts An object containing options. Supported options are : coordinate, the coordinate where popup will be shown. If omitted first feature is used.
   *                                                                         ignorePan, do not autopan if type is overlay. Pan should be supressed if view is changed manually to avoid contradicting animations.
   * @returns nothing
@@ -68034,7 +68046,7 @@ const Featureinfo = function Featureinfo(options = {}) {
     }
     if (newItems.length > 0) {
       render(newItems, identifyTarget, opts.coordinate || _maputils__WEBPACK_IMPORTED_MODULE_4__["default"].getCenter(newItems[0].getFeature().getGeometry()), opts);
-      viewer.getMap().getView().fit(_maputils__WEBPACK_IMPORTED_MODULE_4__["default"].getExtent(featureObj.feature));
+      viewer.getMap().getView().fit(_maputils__WEBPACK_IMPORTED_MODULE_4__["default"].getExtent(newItems.map(i => i.getFeature())));
     }
   };
 
@@ -70745,7 +70757,7 @@ function createSource({
   const esrijsonFormat = new ol_format_EsriJSON__WEBPACK_IMPORTED_MODULE_2__["default"]();
   const vectorSource = new ol_source_Vector__WEBPACK_IMPORTED_MODULE_3__["default"]({
     attributions: attribution,
-    loader(extent, resolution, projection) {
+    loader(extent, resolution, projection, success) {
       const that = this;
       let url = sourceUrl.endsWith('/') ? sourceUrl : `${sourceUrl}/`;
       url += id
@@ -70767,6 +70779,7 @@ function createSource({
         if (features.length > 0) {
           that.addFeatures(features);
         }
+        success(features);
       }).catch(error => console.warn(error));
     },
     strategy: ol_loadingstrategy__WEBPACK_IMPORTED_MODULE_4__.bbox
@@ -71002,7 +71015,7 @@ function createSource(options) {
   if (options.url) {
     const vectorSource = new ol_source_Vector__WEBPACK_IMPORTED_MODULE_3__["default"]({
       attributions: options.attribution,
-      loader() {
+      loader(extent, resolution, projection, success) {
         fetch(options.url, { headers: options.headers }).then(response => response.json()).then((data) => {
           if (data.features) {
             vectorSource.addFeatures(vectorSource.getFormat().readFeatures(data, formatOptions));
@@ -71023,6 +71036,7 @@ function createSource(options) {
               });
             }
           }
+          success(vectorSource.getFeatures());
         }).catch(error => console.warn(error));
       },
       format: new ol_format_GeoJSON__WEBPACK_IMPORTED_MODULE_4__["default"]()
@@ -72876,6 +72890,10 @@ const maputils = {
     }
     return center;
   },
+  /**
+   * Gets the union extent for an array of features
+   * @param {any} featureArray An array of features
+   */
   getExtent: function getCenter(featureArray) {
     const featureExtent = featureArray[0].getGeometry().getExtent();
     let i;
@@ -81438,6 +81456,26 @@ const Viewer = function Viewer(targetOption, options = {}) {
     return urlParams;
   };
 
+  /**
+   * Internal helper used when urlParams.feature is set and the popup should be displayed.
+   * @param {any} feature
+   * @param {any} layerName
+   */
+  const displayFeatureInfo = function displayFeatureInfo(feature, layerName) {
+    if (feature) {
+      const fidsbylayer = {};
+      fidsbylayer[layerName] = [feature.getId()];
+      featureinfo.showInfo(fidsbylayer, { ignorePan: true });
+      if (!urlParams.zoom && !urlParams.center) {
+        map.getView().fit(feature.getGeometry(), {
+          maxZoom: getResolutions().length - 2,
+          padding: [15, 15, 40, 15],
+          duration: 1000
+        });
+      }
+    }
+  };
+
   return (0,_ui__WEBPACK_IMPORTED_MODULE_0__.Component)({
     onInit() {
       this.render();
@@ -81488,50 +81526,43 @@ const Viewer = function Viewer(targetOption, options = {}) {
             const layer = getLayer(layerName);
             if (layer && layer.get('type') !== 'GROUP') {
               const layerType = layer.get('type');
-              // FIXME: postrender event is only emitted if any features from a layer is actually drawn, which means there is no feature in the default extent,
-              // it will not be triggered until map is panned or zoomed where a feature exists.
-              layer.once('postrender', () => {
-                const clusterSource = layer.getSource().source;
-                // Assume that id is just the second part of the argumment and adjust it for special cases later.
-                let id = featureId.split('.')[1];
-                let feature;
-
-                if (layerType === 'WFS') {
-                  // WFS uses the layername as a part of the featureId. Problem is that it what the server think is the name that matters.
-                  // First we assume that the layername is actually correct, then take the special cases
-                  let idLayerPart = layerName;
-                  const layerId = layer.get('id');
-                  if (layerId) {
-                    // if layer explicitly has set the id it takes precedense over name
-                    // layer name already have popped the namespace part, but id is untouched.
-                    idLayerPart = layerId.split(':').pop();
-                  } else if (layerName.includes('__')) {
-                    // If using the __-notation to use same layer several times, we must only use the actual layer name
-                    idLayerPart = layerName.split('__')[0];
-                  }
-                  // Build the correct WFS id
-                  id = `${idLayerPart}.${id}`;
-                }
-                // FIXME: ensure that feature is loaded. If using bbox and feature is outside default extent it will not be found.
-                // Workaround is to have a default extent covering the entire map with the layer in visible range or use strategy all
-                if (clusterSource) {
-                  feature = clusterSource.getFeatureById(id);
-                } else {
-                  feature = layer.getSource().getFeatureById(id);
+              const layerSource = layer.getSource().source ? layer.getSource().source : layer.getSource();
+              // Assume that id is just the second part of the argumment and adjust it for special cases later.
+              let id = featureId.split('.')[1];
+
+              if (layerType === 'WFS') {
+                // WFS uses the layername as a part of the featureId. Problem is that it what the server think is the name that matters.
+                // First we assume that the layername is actually correct, then take the special cases
+                let idLayerPart = layerName;
+                const layerId = layer.get('id');
+                if (layerId) {
+                  // if layer explicitly has set the id it takes precedense over name
+                  // layer name already have popped the namespace part, but id is untouched.
+                  idLayerPart = layerId.split(':').pop();
+                } else if (layerName.includes('__')) {
+                  // If using the __-notation to use same layer several times, we must only use the actual layer name
+                  idLayerPart = layerName.split('__')[0];
                 }
+                // Build the correct WFS id
+                id = `${idLayerPart}.${id}`;
+              }
 
-                if (feature) {
-                  const obj = {};
-                  obj.feature = feature;
-                  obj.layerName = layerName;
-                  featureinfo.showFeatureInfo(obj);
-                  map.getView().fit(feature.getGeometry(), {
-                    maxZoom: getResolutions().length - 2,
-                    padding: [15, 15, 40, 15],
-                    duration: 1000
-                  });
-                }
-              });
+              // Some layer types may already have been loaded, e.g. GeoJson with static configured features. As features are loaded
+              // on creation it is impossible to listen to the featuresloadend event, but on the other hand the features will be ready already
+              // when we get here. It is highly unlikely that a remote source is finished already, but that would work as well.
+              if (layerSource.getFeatures().length > 0) {
+                displayFeatureInfo(layerSource.getFeatureById(id), layerName);
+              } else {
+                // Set up an eventhandler and wait for the source to finsish loading if there are no features yet.
+                // Important that the source actually emits this event.
+                layerSource.once('featuresloadend', () => {
+                  // FIXME: ensure that feature is loaded. If using bbox and feature is outside default extent it will not be found.
+                  // Workaround is to have a default extent covering the entire map with the layer in visible range or use strategy all
+                  // Most likely it will work as sharemap links contains center and zoom so extent will be visible. Most sane people
+                  // will only share maps where the selected feature is in view
+                  displayFeatureInfo(layerSource.getFeatureById(id), layerName);
+                });
+              }
             }
           }
 

diff --git a/build/js/origo.min.js b/build/js/origo.min.js
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "origo",
-  "version": "2.8.0",
+  "version": "2.8.1",
   "repository": {
     "type": "git",
     "url": "git://github.com/origo-map/origo.git"