@eeacms/volto-arcgis-block 0.1.141 → 0.1.143

package/CHANGELOG.md

@@ -4,6 +4,25 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+### [0.1.143](https://github.com/eea/volto-arcgis-block/compare/0.1.142...0.1.143) - 15 May 2023
+
+#### :hammer_and_wrench: Others
+
+- Lint [martinman - [`5b1c048`](https://github.com/eea/volto-arcgis-block/commit/5b1c04899fe2ccdde306c77a9f5f27d1aceb8ea3)]
+- FEAT: Logo not displayed [martinman - [`d10dfd0`](https://github.com/eea/volto-arcgis-block/commit/d10dfd04430e4da7df2cb6a21618cfef46442fd0)]
+- Commit [martinman - [`25f511d`](https://github.com/eea/volto-arcgis-block/commit/25f511d6506dc6e78f48261f748b977452e9d08e)]
+- No natural basemap [martinman - [`aa9c9ca`](https://github.com/eea/volto-arcgis-block/commit/aa9c9ca82527d251031740a316f719a9f2057bae)]
+- FEAT: Natural Earth with labels basemap added [martinman - [`8879146`](https://github.com/eea/volto-arcgis-block/commit/8879146804b5b7f5e499c16501e596353126823f)]
+- FEAT: Limits fixed. Next step basemap layer [martinman - [`7830627`](https://github.com/eea/volto-arcgis-block/commit/783062798e1e2339942e17614fdd290e448753e5)]
+- Commit [martinman - [`be26cd1`](https://github.com/eea/volto-arcgis-block/commit/be26cd14d8d8004dc83134f0a10e21936de57b61)]
+- FEAT: Extent limit when zoom min out. Rotation disabled. Next step logo and fit  optimal extent [martinman - [`a6828e3`](https://github.com/eea/volto-arcgis-block/commit/a6828e32e219aad91f463ea8cbb3ab23b53e97a5)]
+- FEAT: Extent limit when zoom min out. Rotation disabled. Next step logo and fit  optimal extent [martinman - [`1c1f9cd`](https://github.com/eea/volto-arcgis-block/commit/1c1f9cd5d0f44e739e10fd738f8bf297a9a2b309)]
+- First commit [martinman - [`80d20de`](https://github.com/eea/volto-arcgis-block/commit/80d20de2625a542f03b5ba117d1bd65b2987b4a8)]
+### [0.1.142](https://github.com/eea/volto-arcgis-block/compare/0.1.141...0.1.142) - 12 May 2023
+
+#### :hammer_and_wrench: Others
+
+- CLMS-1953 (fix): set legend image opacity to 1 regardless of layer view opacity [ujbolivar - [`0adad47`](https://github.com/eea/volto-arcgis-block/commit/0adad4733f487213ddbb90513e3d217c1d87c951)]
 ### [0.1.141](https://github.com/eea/volto-arcgis-block/compare/0.1.140...0.1.141) - 11 May 2023
 
 ### [0.1.140](https://github.com/eea/volto-arcgis-block/compare/0.1.139...0.1.140) - 11 May 2023

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-arcgis-block",
-  "version": "0.1.141",
+  "version": "0.1.143",
   "description": "volto-arcgis-block: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: CodeSyntax",

package/src/components/MapViewer/BasemapWidget.jsx

@@ -242,7 +242,6 @@ class BasemapWidget extends React.Component {
         ],
       });
     }
-
     this.props.view.ui.add(this.container.current, 'top-right');
   }
   /**

package/src/components/MapViewer/MapViewer.jsx

@@ -18,7 +18,7 @@ import InfoWidget from './InfoWidget';
 import MenuWidget from './MenuWidget';
 import HotspotWidget from './HotspotWidget';
 //import "isomorphic-fetch";  <-- Necessary to use fetch?
-var Map, MapView, Zoom, intl, Basemap, WebTileLayer;
+var Map, MapView, Zoom, intl, Basemap, WebTileLayer, Extent;
 let mapStatus = {};
 const CheckLanguage = () => {
   const { locale } = useIntl();
@@ -86,16 +86,20 @@ class MapViewer extends React.Component {
       'esri/intl',
       'esri/Basemap',
       'esri/layers/WebTileLayer',
-    ]).then(([_Map, _MapView, _Zoom, _intl, _Basemap, _WebTileLayer]) => {
-      [Map, MapView, Zoom, intl, Basemap, WebTileLayer] = [
-        _Map,
-        _MapView,
-        _Zoom,
-        _intl,
-        _Basemap,
-        _WebTileLayer,
-      ];
-    });
+      'esri/geometry/Extent',
+    ]).then(
+      ([_Map, _MapView, _Zoom, _intl, _Basemap, _WebTileLayer, _Extent]) => {
+        [Map, MapView, Zoom, intl, Basemap, WebTileLayer, Extent] = [
+          _Map,
+          _MapView,
+          _Zoom,
+          _intl,
+          _Basemap,
+          _WebTileLayer,
+          _Extent,
+        ];
+      },
+    );
   }
 
   /**
@@ -136,6 +140,7 @@ class MapViewer extends React.Component {
     this.map = new Map({
       // basemap: 'topo',
       basemap: this.positronCompositeBasemap,
+      logo: false,
     });
 
     mapStatus = this.recoverState();
@@ -162,6 +167,8 @@ class MapViewer extends React.Component {
       constraints: {
         minZoom: this.mapCfg.minZoom,
         maxZoom: this.mapCfg.maxZoom,
+        rotationEnabled: false,
+        geometry: this.mapCfg.geometry,
       },
       ui: {
         components: ['attribution'],
@@ -179,8 +186,27 @@ class MapViewer extends React.Component {
         this.setCenterState(newValue);
       });
 
+      let constraintExtent = null;
       this.view.watch('zoom', (newValue, oldValue, property, object) => {
         this.setZoomState(newValue);
+        if (mapStatus.zoom <= this.mapCfg.minZoom) {
+          constraintExtent = new Extent({
+            xmin: -90,
+            ymin: -45,
+            xmax: 90,
+            ymax: 45,
+            spatialReference: 4326,
+          });
+        } else {
+          constraintExtent = new Extent({
+            xmin: -90,
+            ymin: -85,
+            xmax: 90,
+            ymax: 85,
+            spatialReference: 4326,
+          });
+        }
+        this.view.constraints.geometry = constraintExtent;
       });
       this.view.popup.autoOpenEnabled = false;
       // After launching the MapViewerConfig action
@@ -193,6 +219,7 @@ class MapViewer extends React.Component {
       //we invoke the setState method, that changes the state and forces a
       //react component to render itself again
       //this.setState({});
+      this.view.ui._removeComponents(['attribution']);
     });
   }
 

package/src/components/MapViewer/MenuWidget.jsx

@@ -1963,7 +1963,7 @@ class MenuWidget extends React.Component {
         product.Datasets.forEach((dataset) => {
           if (dataset.DatasetTitle.includes(selectedDataset.title)) {
             this.url = dataset.ViewService;
-            this.productTitle = product.ProductTitle;
+            this.productId = product.ProductId;
           }
         });
       });
@@ -2108,12 +2108,12 @@ class MenuWidget extends React.Component {
     this.findCheckedDataset(elem);
     let BBoxes = {};
     let firstLayer;
-    if (this.productTitle.includes('Global Dynamic Land Cover')) {
+    if (this.productId.includes('333e4100b79045daa0ff16466ac83b7f')) {
       this.findDatasetBoundingBox(elem);
       BBoxes = this.parseBBOXJSON(this.dataBBox);
     } else if (
-      this.productTitle.includes('Low Resolution Vegetation Parameters') ||
-      this.productTitle.includes('Water Parameters')
+      this.productId.includes('fe8209dffe13454891cea05998c8e456') ||
+      this.productId.includes('8914fde2241a4035818af8f0264fd55e')
     ) {
       if (
         this.layers[elem.id].fullExtents &&
@@ -2143,7 +2143,7 @@ class MenuWidget extends React.Component {
       BBoxes[Object.keys(BBoxes)[0]] &&
       BBoxes[Object.keys(BBoxes)[0]] !== null
     ) {
-      if (elem.title.includes('Corine Land Cover')) {
+      if (this.productId.includes('130299ac96e54c30a12edd575eff80f7')) {
         if (elem.title.includes('Guadeloupe')) {
           firstLayer = BBoxes[Object.keys(BBoxes)[0]];
         } else if (elem.title.includes('French Guiana')) {
@@ -2682,6 +2682,30 @@ class MenuWidget extends React.Component {
       '.active-layer[layer-id="' + layer + '"] .active-layer-opacity',
     ).dataset.opacity = value;
     // }
+    setTimeout(() => {
+      this.setLegendOpacity();
+    }, 100);
+  }
+
+  setLegendOpacity() {
+    const collection = document.getElementsByClassName('esri-legend__symbol');
+
+    Array.prototype.forEach.call(collection, function (element) {
+      let img = {};
+
+      if (element.hasChildNodes()) {
+        img = element.childNodes[0];
+      } else {
+        img = element;
+      }
+      // Set Legend opacity back to 1;
+      if (img) {
+        img.setAttribute(
+          'style',
+          'opacity:1; -moz-opacity:1; filter:alpha(opacity=100)',
+        );
+      }
+    });
   }
 
   /**
@@ -2792,7 +2816,7 @@ class MenuWidget extends React.Component {
     this.saveLayerOrder();
     this.checkInfoWidget();
     this.setState({});
-    if (this.productTitle.includes('Global Dynamic Land Cover')) {
+    if (this.productId.includes('333e4100b79045daa0ff16466ac83b7f')) {
       if (this.visibleLayers[elem.id][1] === 'eye-slash') {
         this.map.findLayerById(elem.id).visible = false;
       } else {

package/src/components/MapViewer/config.js

@@ -5,6 +5,13 @@ const config = {
     zoom: 3,
     minZoom: 2,
     maxZoom: 20,
+    geometry: {
+      type: 'extent',
+      xmin: -90,
+      ymin: -45,
+      xmax: 90,
+      ymax: 45,
+    },
     activeLayers: [],
   },
   Components: [