leaflet adapter supports cancellation and min/max zoom from header [#48]

js/adapters.ts

@@ -4,24 +4,46 @@ import { PMTiles, Source } from "./index";
 export const leafletRasterLayer = (source: PMTiles, options: any) => {
   const cls = L.GridLayer.extend({
     createTile: function (coord: any, done: any) {
-      const tile: any = document.createElement("img");
+      if (!this.pmtilesHeaderLoaded) {
-      const controller = new AbortController();
+        source.getHeader().then((h) => {
-      const signal = controller.signal;
+          // Unfortunately this needs to call into private leaflet properties
-      tile.cancel = () => {
+          // and might break in future versions
-        controller.abort();
+          // because layer creation is synchronous and these are specified at
-      };
+          // initialization time
-      source.getZxy(coord.z, coord.x, coord.y).then((arr) => {
+          // TODO: set bounds?
-        if (arr) {
+          if (this.options.maxNativeZoom == undefined) {
-          const blob = new Blob([arr.data], { type: "image/png" });
+            this.options.minNativeZoom = h.minZoom;
-          const imageUrl = window.URL.createObjectURL(blob);
+          }
-          tile.src = imageUrl;
+          if (this.options.maxNativeZoom == undefined) {
-          tile.cancel = null;
+            this.options.maxNativeZoom = h.maxZoom;
-          done(null, tile);
-        } else {
-          // return an empty image
           }
         });
-      return tile;
+        this.pmtilesHeaderLoaded = true;
+      }
+
+      const el: any = document.createElement("img");
+      const controller = new AbortController();
+      const signal = controller.signal;
+      el.cancel = () => {
+        controller.abort();
+      };
+      source
+        .getZxy(coord.z, coord.x, coord.y, signal)
+        .then((arr) => {
+          if (arr) {
+            const blob = new Blob([arr.data]);
+            const imageUrl = window.URL.createObjectURL(blob);
+            el.src = imageUrl;
+            el.cancel = null;
+            done(null, el);
+          }
+        })
+        .catch((e) => {
+          if (e.name !== "AbortError") {
+            throw e;
+          }
+        });
+      return el;
     },
 
     _removeTile: function (key: string) {