@opengeoweb/webmap 15.3.0 → 16.0.0

package/index.esm.js

@@ -938,36 +938,6 @@ var getFirstPartOfDimensionValueSet = function getFirstPartOfDimensionValueSet(i
   return !(inputValue != null && inputValue.indexOf) || !(inputValue != null && inputValue.includes('/')) ? inputValue : inputValue.split('/')[0];
 };
 
-/* *
- * Licensed 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.
- *
- * Copyright 2024 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
- * Copyright 2024 - Finnish Meteorological Institute (FMI)
- * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
- * */
-var fakeMaxAgeResponsesByLayer = {
-  'observation:wis2_air_temperature': 600,
-  'fmi:observation:lightning': 300,
-  'fmi:observation:temperature': 3600,
-  'fmi:observation:dewpoint': 3600,
-  'fmi:observation:temperature_foreign': 3600,
-  'fmi:observation:dewpoint_foreign': 3600,
-  'fmi:observation:cloudceiling': 3600,
-  'fmi:observation:cloudheight': 3600,
-  'fmi:observation:cloudheight_foreign': 3600,
-  'fmi:observation:cloudceiling_foreign': 3600
-};
-
 /**
  * Returns the current time in ms
  * @returns the current time in ms
@@ -1057,6 +1027,8 @@ var WMImage = /*#__PURE__*/function () {
     this._hasError = false;
     this._numFailedAttempts = 0;
     this._imageTimeStampAtError = getCurrentImageTime();
+    this._maxAgeSeconds = undefined;
+    this._loadedAtTime = undefined;
   }
   /**
    * Returns true if the image has been loaded
@@ -1065,7 +1037,10 @@ var WMImage = /*#__PURE__*/function () {
     if (this._isLoading) {
       return false;
     }
-    return this._isLoaded;
+    if (!this._isLoaded) {
+      return false;
+    }
+    return !this.isStale();
   };
   _proto.isLoadedWithoutErrors = function isLoadedWithoutErrors() {
     return this.isLoaded() && !this.hasError();
@@ -1074,25 +1049,14 @@ var WMImage = /*#__PURE__*/function () {
     return !this._isLoaded && !this._isLoading;
   };
   _proto.isStale = function isStale() {
-    if (this._fakeMaxAge === undefined) {
-      try {
-        var layerName = new URL(this.getSrc()).searchParams.get('LAYERS');
-        if (layerName) {
-          var _fakeMaxAgeResponsesB;
-          this._fakeMaxAge = (_fakeMaxAgeResponsesB = fakeMaxAgeResponsesByLayer[layerName]) != null ? _fakeMaxAgeResponsesB : null;
-        } else {
-          this._fakeMaxAge = null;
-        }
-      } catch (_e) {
-        // failed to form URL
-        this._fakeMaxAge = null;
-      }
+    if (!this._isLoaded || this._loadedAtTime === undefined) {
+      return false;
     }
-    if (this._fakeMaxAge === null) {
+    if (this._maxAgeSeconds === null || this._maxAgeSeconds === undefined) {
       return false;
     }
-    var imageAge = getCurrentImageTime() - this._loadStartTime;
-    var maxAge = this._fakeMaxAge * 1000;
+    var imageAge = getCurrentImageTime() - this._loadedAtTime;
+    var maxAge = this._maxAgeSeconds * 1000;
     return imageAge > maxAge;
   }
   /**
@@ -1202,8 +1166,39 @@ var WMImage = /*#__PURE__*/function () {
     }
     this._load();
   };
-  _proto._getImageWithHeaders = function _getImageWithHeaders(url, headers) {
+  WMImage._parseMaxAgeFromCacheControl = function _parseMaxAgeFromCacheControl(cacheControlHeader) {
+    if (!cacheControlHeader) {
+      return null;
+    }
+    var maxAgeMatch = /(?:^|,)\s*max-age=(\d+)/i.exec(cacheControlHeader);
+    if (!maxAgeMatch) {
+      return null;
+    }
+    var parsed = Number(maxAgeMatch[1]);
+    return Number.isFinite(parsed) ? parsed : null;
+  };
+  _proto._setMaxAgeFromResponseHeaders = function _setMaxAgeFromResponseHeaders(response) {
+    this._maxAgeSeconds = WMImage._parseMaxAgeFromCacheControl(response.headers.get('cache-control'));
+  };
+  _proto._updateMaxAgeFromUrl = function _updateMaxAgeFromUrl(url) {
     var _this3 = this;
+    fetch(new Request(url), {
+      method: 'GET',
+      mode: 'cors',
+      cache: 'default',
+      headers: new Headers({
+        Range: 'bytes=0-0'
+      })
+    }).then(function (response) {
+      var _response$body;
+      _this3._setMaxAgeFromResponseHeaders(response);
+      void ((_response$body = response.body) == null ? void 0 : _response$body.cancel());
+    })["catch"](function () {
+      // Keep existing behaviour if headers are not readable.
+    });
+  };
+  _proto._getImageWithHeaders = function _getImageWithHeaders(url, headers) {
+    var _this4 = this;
     var fetchHeaders = new Headers();
     if (headers && headers.length > 0) {
       for (var _iterator = _createForOfIteratorHelperLoose(headers), _step; !(_step = _iterator()).done;) {
@@ -1227,19 +1222,21 @@ var WMImage = /*#__PURE__*/function () {
       return window.btoa(binary);
     };
     fetch(request, options).then(function (response) {
+      _this4._setMaxAgeFromResponseHeaders(response);
       response.arrayBuffer().then(function (buffer) {
         var base64Flag = 'data:image/png;base64,';
         var imageStr = arrayBufferToBase64(buffer);
-        _this3.getElement().src = base64Flag + imageStr;
+        _this4.getElement().src = base64Flag + imageStr;
       })["catch"](function () {
         debugLogger(DebugType.Error);
+        _this4._loadEvent(true);
       });
     })["catch"](function () {
       debugLogger(DebugType.Error, "Unable to fetch image " + url + " with headers [" + JSON.stringify(headers) + "]");
       if (url.startsWith('http://')) {
         debugLogger(DebugType.Error);
       }
-      _this3._loadEvent(true);
+      _this4._loadEvent(true);
     });
   };
   _proto._load = function _load() {
@@ -1247,8 +1244,12 @@ var WMImage = /*#__PURE__*/function () {
     this._loadStartTime = getCurrentImageTime();
     this._hasError = false;
     if (this._isLoaded) {
-      this._loadEvent(false);
-      return;
+      if (!this.isStale()) {
+        this._loadEvent(false);
+        return;
+      }
+      this._isLoaded = false;
+      this._srcLoaded = undefined;
     }
     this._isLoading = true;
     if (!this.srcToLoad) {
@@ -1275,6 +1276,7 @@ var WMImage = /*#__PURE__*/function () {
       this._getImageWithHeaders(this.srcToLoad, this.headers);
     } else if (this.randomize) {
       /* Do a standard img.src url request */
+      this._maxAgeSeconds = null;
       var newSrc = this.srcToLoad;
       if (!this.srcToLoad.includes('?')) {
         newSrc += '?';
@@ -1290,8 +1292,9 @@ var WMImage = /*#__PURE__*/function () {
       }
       this.getElement().src = newSrc;
     } else {
-      // setting src loads the image and the 'load' callback is called when its finished loading
+      // Keep the browser image loading path for rendering reliability.
       this.getElement().src = this.srcToLoad;
+      this._updateMaxAgeFromUrl(this.srcToLoad);
     }
   };
   _proto._loadEvent = function _loadEvent(hasError) {
@@ -1300,6 +1303,7 @@ var WMImage = /*#__PURE__*/function () {
     this._hasError = hasError;
     this._isLoading = false;
     this._isLoaded = true;
+    this._loadedAtTime = hasError ? undefined : getCurrentImageTime();
     this._srcLoaded = this.srcToLoad;
     this._resolveAll();
     (_this$loadEventCallba = this.loadEventCallback) == null || _this$loadEventCallba.call(this, this);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/webmap",
-  "version": "15.3.0",
+  "version": "16.0.0",
   "description": "GeoWeb webmap library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -8,7 +8,7 @@
     "url": "git@gitlab.com:opengeoweb/opengeoweb.git"
   },
   "dependencies": {
-    "@opengeoweb/shared": "15.3.0",
+    "@opengeoweb/shared": "16.0.0",
     "@tanstack/query-core": "^5.69.2",
     "lodash": "^4.17.21",
     "i18next": "^25.0.1",

package/src/lib/components/WMImage.d.ts

@@ -34,7 +34,8 @@ export default class WMImage {
     _numFailedAttempts: number;
     _loadStartTime: number;
     _loadDuration?: number;
-    _fakeMaxAge?: number | null;
+    _maxAgeSeconds?: number | null;
+    _loadedAtTime?: number;
     _resolveList: ((i: WMImage) => void)[];
     geoReference: WMGeoReference | null;
     hashUrl: string | undefined;
@@ -92,6 +93,9 @@ export default class WMImage {
     loadAwait(): Promise<WMImage>;
     load(): void;
     forceReload(randomize?: boolean): void;
+    private static _parseMaxAgeFromCacheControl;
+    private _setMaxAgeFromResponseHeaders;
+    private _updateMaxAgeFromUrl;
     private _getImageWithHeaders;
     _load(): void;
     _loadEvent(hasError: boolean): void;

package/src/lib/components/WMLayerTypes.d.ts

@@ -34,6 +34,7 @@ export interface LayerFoundation extends TiledLayerFoundation {
     type?: string;
     geojson?: FeatureCollection;
     options?: EDRFeatureLayerOptions;
+    showLayerLegend?: boolean;
 }
 export interface LayerOptions extends LayerFoundation {
     id: string;