@nextgis/leaflet-map-adapter 4.0.1 → 4.1.0

package/lib/leaflet-map-adapter.global.js

@@ -1,4 +1,4 @@
-/** Bundle of @nextgis/leaflet-map-adapter; version: 4.0.1; author: NextGIS */
+/** Bundle of @nextgis/leaflet-map-adapter; version: 4.1.0; author: NextGIS */
 var LeafletMapAdapter = (function () {
   'use strict';
 
@@ -15371,8 +15371,14 @@ var LeafletMapAdapter = (function () {
   }
 
   function updateUrlParams(urlStr, params) {
-    const url = new URL(urlStr);
-    const searchParams = new URLSearchParams(url.search);
+    const hashIndex = urlStr.indexOf("#");
+    const hash = hashIndex === -1 ? "" : urlStr.slice(hashIndex);
+    const url = hashIndex === -1 ? urlStr : urlStr.slice(0, hashIndex);
+    const queryIndex = url.indexOf("?");
+    const baseUrl = queryIndex === -1 ? url : url.slice(0, queryIndex);
+    const searchParams = new URLSearchParams(
+      queryIndex === -1 ? "" : url.slice(queryIndex + 1)
+    );
     Object.entries(params).forEach(([key, value]) => {
       if (value === void 0) {
         searchParams.delete(key);
@@ -15382,7 +15388,7 @@ var LeafletMapAdapter = (function () {
     });
     searchParams.set("timestamp", String((/* @__PURE__ */ new Date()).getTime()));
     const newSearch = [...searchParams.entries()].map(([key, value]) => `${key}=${value}`).join("&");
-    return `${url.origin}${url.pathname}?${newSearch}`;
+    return `${baseUrl}?${newSearch}${hash}`;
   }
 
   function boundsToArray(bounds) {
@@ -16491,15 +16497,31 @@ var LeafletMapAdapter = (function () {
     /**
      * @param {PromiseQueueOptions} options - Configuration options for the queue.
      */
-    constructor({ concurrency = 1, delay = 0 } = {}) {
+    constructor({
+      delay = 0,
+      limit,
+      timeout,
+      debounce,
+      concurrency = 1
+    } = {}) {
       __publicField$4(this, "queue", []);
+      __publicField$4(this, "activeRequests", []);
       __publicField$4(this, "concurrency");
-      __publicField$4(this, "activeCount", 0);
       __publicField$4(this, "timeoutId");
+      __publicField$4(this, "resumeTimer");
       __publicField$4(this, "delay");
-      __publicField$4(this, "toAbort", []);
-      this.concurrency = concurrency;
-      this.delay = delay;
+      __publicField$4(this, "timeout");
+      __publicField$4(this, "paused", false);
+      __publicField$4(this, "idleResolvers", []);
+      __publicField$4(this, "debounce");
+      this.concurrency = limit != null ? limit : concurrency;
+      this.delay = debounce != null ? debounce : delay;
+      this.debounce = this.delay;
+      this.timeout = timeout;
+    }
+    setLimit(limit) {
+      this.concurrency = limit;
+      this._next();
     }
     /**
      * Adds a task to the queue, which can be either a simple asynchronous function or an array containing a function and its abort handler.
@@ -16518,7 +16540,18 @@ var LeafletMapAdapter = (function () {
      * ```
      */
     add(promise, abort) {
-      this.queue.push({ promise, abort });
+      var _a, _b;
+      const options = typeof abort === "function" ? { abort } : abort;
+      if ((options == null ? void 0 : options.id) !== void 0) {
+        this.removeById(options.id);
+      }
+      this.queue.push({
+        id: (_a = options == null ? void 0 : options.id) != null ? _a : Math.random().toString(36).slice(2),
+        promise,
+        abort: options == null ? void 0 : options.abort,
+        abortController: new AbortController(),
+        timeout: (_b = options == null ? void 0 : options.timeout) != null ? _b : this.timeout
+      });
       this.debouncedNext();
     }
     /**
@@ -16528,60 +16561,167 @@ var LeafletMapAdapter = (function () {
      * queue.abort(); // Aborts all abortable tasks in the queue.
      */
     abort() {
-      for (const abort of this.toAbort) {
-        abort();
+      for (const item of [...this.queue, ...this.activeRequests]) {
+        this.abortRequest(item);
+        this.clearRequestTimeout(item);
+        item.completed = true;
       }
-      this.toAbort = [];
-      this.queue = [];
+      this.queue.length = 0;
+      this.activeRequests.length = 0;
       this._clearTimeout();
+      this.checkIdle();
+    }
+    remove(id) {
+      this.removeById(id);
+    }
+    clearQueue() {
+      for (const item of this.queue) {
+        this.abortRequest(item);
+        item.completed = true;
+      }
+      this.queue.length = 0;
+      this._clearTimeout();
+      this.checkIdle();
+    }
+    waitAll() {
+      return new Promise((resolve) => {
+        if (this.isIdle()) {
+          resolve();
+        } else {
+          this.idleResolvers.push(resolve);
+        }
+      });
+    }
+    pause(pauseDuration) {
+      this.paused = true;
+      this._clearTimeout();
+      this._clearResumeTimer();
+      if (pauseDuration) {
+        this.resumeTimer = setTimeout(() => this.resume(), pauseDuration);
+      }
+    }
+    resume() {
+      if (!this.paused) return;
+      this.paused = false;
+      this._clearResumeTimer();
+      this._next();
     }
     debouncedNext() {
+      if (this.paused) return;
+      if (this.activeRequests.length) {
+        this._next();
+        return;
+      }
       this._clearTimeout();
       this.timeoutId = setTimeout(() => this._next(), this.delay);
     }
     _clearTimeout() {
       if (this.timeoutId) {
         clearTimeout(this.timeoutId);
+        this.timeoutId = void 0;
+      }
+    }
+    _clearResumeTimer() {
+      if (this.resumeTimer) {
+        clearTimeout(this.resumeTimer);
+        this.resumeTimer = void 0;
       }
     }
     _next() {
-      while (this.activeCount < this.concurrency && this.queue.length > 0) {
-        const { promise, abort } = this.queue.shift();
-        this.activeCount++;
-        let toAbort = abort;
-        let request;
-        const execute = promise();
-        if (Array.isArray(execute)) {
-          request = execute[0];
-          toAbort = execute[1];
-        } else {
-          request = execute;
-        }
-        if (toAbort) {
-          this.toAbort.push(toAbort);
+      if (this.paused) return;
+      while (this.activeRequests.length < this.concurrency && this.queue.length) {
+        const item = this.queue.shift();
+        if (item.abortController.signal.aborted) continue;
+        this.activeRequests.push(item);
+        if (item.timeout && item.timeout > 0) {
+          item.timeoutId = setTimeout(() => {
+            this.abortRequest(
+              item,
+              new DOMException("Request timed out", "TimeoutError")
+            );
+            this.finishRequest(item);
+          }, item.timeout);
         }
-        request.finally(() => {
-          this.activeCount--;
-          if (toAbort) {
-            this.toAbort = this.toAbort.filter((a) => a !== toAbort);
+        try {
+          const execute = item.promise({ signal: item.abortController.signal });
+          const request = Array.isArray(execute) ? execute[0] : execute;
+          if (Array.isArray(execute)) {
+            const abort = item.abort;
+            item.abort = abort ? () => {
+              abort();
+              execute[1]();
+            } : execute[1];
           }
-          this.debouncedNext();
-        });
+          Promise.resolve(request).then(
+            () => this.finishRequest(item),
+            () => this.finishRequest(item)
+          );
+        } catch (error) {
+          this.finishRequest(item);
+          console.error(error);
+        }
+      }
+      this.checkIdle();
+    }
+    removeById(id) {
+      this.queue = this.queue.filter((item) => {
+        if (item.id !== id) return true;
+        this.abortRequest(item);
+        item.completed = true;
+        return false;
+      });
+      for (const item of [...this.activeRequests]) {
+        if (item.id === id) {
+          this.abortRequest(item);
+          this.finishRequest(item);
+        }
+      }
+      this.checkIdle();
+    }
+    abortRequest(item, reason) {
+      var _a;
+      if (!item.abortController.signal.aborted) {
+        item.abortController.abort(reason);
+      }
+      (_a = item.abort) == null ? void 0 : _a.call(item);
+    }
+    clearRequestTimeout(item) {
+      if (item.timeoutId) {
+        clearTimeout(item.timeoutId);
+        item.timeoutId = void 0;
+      }
+    }
+    finishRequest(item) {
+      if (item.completed) return;
+      item.completed = true;
+      this.clearRequestTimeout(item);
+      this.activeRequests = this.activeRequests.filter((x) => x !== item);
+      this.checkIdle();
+      this._next();
+    }
+    isIdle() {
+      return this.queue.length === 0 && this.activeRequests.length === 0;
+    }
+    checkIdle() {
+      if (this.isIdle()) {
+        this.idleResolvers.splice(0).forEach((resolve) => resolve());
       }
     }
   }
 
-  const imageQueue = new Queue({ concurrency: 6, delay: 200 });
+  const imageQueue = new Queue({ limit: 6, debounce: 150 });
 
   var __defProp$6 = Object.defineProperty;
   var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
   var __publicField$3 = (obj, key, value) => __defNormalProp$6(obj, key + "" , value);
+  const transparentImage = "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEAAAAALAAAAAABAAEAAAIBAAA=";
   class ImageOverlay extends leafletSrcExports.ImageOverlay {
     constructor(imageUrl, bounds, options) {
       super(imageUrl, bounds, options);
       __publicField$3(this, "_aborter");
     }
     cancelLoad() {
+      imageQueue.remove(leafletSrcExports.Util.stamp(this));
       if (this._aborter) {
         this._aborter();
         this._aborter = void 0;
@@ -16593,19 +16733,27 @@ var LeafletMapAdapter = (function () {
       const img = this._image;
       const src = img.src;
       img.src = "";
-      imageQueue.add(() => {
-        const [promise, abortFunc] = callAjax({
-          src,
-          headers,
-          request,
-          withCredentials
-        });
-        promise.then((imgUrl) => {
-          img.src = imgUrl;
-        });
-        this._aborter = abortFunc;
-        return promise;
-      });
+      imageQueue.add(
+        ({ signal }) => {
+          const [promise, abortFunc] = callAjax({
+            src,
+            headers,
+            request,
+            withCredentials
+          });
+          void promise.then((imgUrl) => {
+            if (!signal.aborted) img.src = imgUrl || transparentImage;
+          }).catch((error) => {
+            if (!signal.aborted) {
+              console.error(error);
+              img.src = transparentImage;
+            }
+          });
+          this._aborter = abortFunc;
+          return [promise, abortFunc];
+        },
+        { id: leafletSrcExports.Util.stamp(this) }
+      );
     }
   }
 
@@ -16675,6 +16823,12 @@ var LeafletMapAdapter = (function () {
         map.removeLayer(this._currentOverlay);
         delete this._currentOverlay;
       }
+      if (this._loadedOverlay) {
+        this._loadedOverlay.cancelLoad();
+        this._loadedOverlay.off("load");
+        map.removeLayer(this._loadedOverlay);
+        this._loadedOverlay = void 0;
+      }
       if (this._currentUrl) {
         delete this._currentUrl;
       }
@@ -16700,6 +16854,7 @@ var LeafletMapAdapter = (function () {
       if (this._loadedOverlay) {
         this._loadedOverlay.cancelLoad();
         this._loadedOverlay.off("load");
+        this._map.removeLayer(this._loadedOverlay);
         this._loadedOverlay = void 0;
       }
       const overlay = new ImageOverlay(url, bounds, {
@@ -16750,6 +16905,7 @@ var LeafletMapAdapter = (function () {
       if (this._currentOverlay) {
         this._currentOverlay.setOpacity(opacity);
       }
+      this.fire("opacitychange", { opacity });
     }
     bringToBack() {
       this.options.isBack = true;