WIP

seasketch · Nov 22, 2023 · 8b01122 · 8b01122
1 parent 7c21a4a
commit 8b01122
Show file tree

Hide file tree

Showing 12 changed files with 353 additions and 235 deletions.
diff --git a/packages/client/src/admin/data/TableOfContentsEditor.tsx b/packages/client/src/admin/data/TableOfContentsEditor.tsx
@@ -151,6 +151,7 @@ export default function TableOfContentsEditor() {
         ) {
           contextMenuOptions.push({
             id: "zoom-to",
+            disabled: !item.bounds && !checkedItems.includes(item.stableId),
             label: t("Zoom to bounds"),
             onClick: async () => {
               let bounds: [number, number, number, number] | undefined;
@@ -270,6 +271,7 @@ export default function TableOfContentsEditor() {
       t,
       tocQuery,
       layersAndSources.data,
+      checkedItems,
     ]
   );
 

diff --git a/packages/client/src/admin/data/arcgis/ArcGISCartModal.tsx b/packages/client/src/admin/data/arcgis/ArcGISCartModal.tsx
@@ -576,6 +576,7 @@ export default function ArcGISCartModal({
               source as ArcGISFeatureLayerSource
             ).getFetchStrategy();
 
+            console.log("fetch strategy", fetchStrategy);
             sources.push({
               id: layer.id,
               type: ArcgisSourceType.ArcgisVector,

diff --git a/packages/client/src/components/ContextMenuDropdown.tsx b/packages/client/src/components/ContextMenuDropdown.tsx
@@ -94,7 +94,11 @@ export default function ContextMenuDropdown({
                 onClick={onOptionClick(props)}
                 className={classNames(
                   "group",
-                  "group-hover:bg-gray-100 group-hover:text-gray-900 text-gray-700",
+                  `${
+                    props.disabled
+                      ? ""
+                      : "group-hover:bg-gray-100 group-hover:text-gray-900"
+                  } text-gray-700`,
                   "block px-4 py-2 text-sm w-full text-left",
                   disabled ? "pointer-events-none opacity-50" : ""
                 )}

diff --git a/packages/client/src/dataLayers/MapContextManager.ts b/packages/client/src/dataLayers/MapContextManager.ts
@@ -784,7 +784,12 @@ class MapContextManager extends EventEmitter {
 
   async updateStyle() {
     if (this.map && this.internalState.ready) {
+      this.updateStyleInfiniteLoopDetector++;
       this.updateStyleInfiniteLoopDetector = 0;
+      if (this.updateStyleInfiniteLoopDetector > 10) {
+        this.updateStyleInfiniteLoopDetector = 0;
+        throw new Error("Infinite loop");
+      }
       const { style, sprites } = await this.getComputedStyle(() => {
         this.debouncedUpdateStyle();
       });
@@ -808,10 +813,6 @@ class MapContextManager extends EventEmitter {
             customSource.removeEventListeners(this.map);
             this.customSources[id].listenersAdded = false;
           }
-          // update sublayers
-          if (visible && sublayers !== undefined) {
-            customSource.updateLayers(sublayers);
-          }
         }
         this.pruneInactiveCustomSources();
         this.setState((prev) => ({ ...prev, styleHash }));
@@ -1315,10 +1316,8 @@ class MapContextManager extends EventEmitter {
                       // add style if ready
                       const { customSource, visible, listenersAdded } =
                         this.customSources[source.id];
-
+                      // Adding the source is skipped until later when sublayers are setup
                       if (customSource.ready) {
-                        baseStyle.sources[source.id.toString()] =
-                          await customSource.getGLSource();
                         const styleData = await customSource.getGLStyleLayers();
                         if (styleData.imageList && this.map) {
                           styleData.imageList.addToMap(this.map);
@@ -1396,6 +1395,18 @@ class MapContextManager extends EventEmitter {
     for (const id in this.customSources) {
       if (!insertedCustomSourceIds.includes(parseInt(id))) {
         this.customSources[id].visible = false;
+      } else {
+        const { customSource, sublayers } = this.customSources[id];
+        if (customSource.ready) {
+          // Update sublayers first so that sources that rely on a dynamically
+          // updated raster url can be initialized with proper data.
+          if (sublayers) {
+            customSource.updateLayers(sublayers);
+          }
+          const glSource = await customSource.getGLSource(this.map);
+          console.log(glSource);
+          baseStyle.sources[id] = glSource;
+        }
       }
     }
 

diff --git a/packages/client/src/projects/OverlayLayers.tsx b/packages/client/src/projects/OverlayLayers.tsx
@@ -6,7 +6,10 @@ import {
   OverlayFragment,
   TableOfContentsItem,
 } from "../generated/graphql";
-import { MapContext } from "../dataLayers/MapContextManager";
+import {
+  MapContext,
+  sourceTypeIsCustomGLSource,
+} from "../dataLayers/MapContextManager";
 import TreeView, { TreeItem, useOverlayState } from "../components/TreeView";
 import { DropdownDividerProps } from "../components/ContextMenuDropdown";
 import { DropdownOption } from "../components/DropdownButton";
@@ -47,7 +50,8 @@ export default function OverlayLayers({
           {
             id: "zoom-to",
             label: t("Zoom to bounds"),
-            onClick: () => {
+            disabled: !item.bounds && !checkedItems.includes(item.stableId),
+            onClick: async () => {
               let bounds: [number, number, number, number] | undefined;
               if (item.isFolder) {
                 bounds = createBoundsRecursive(item, items);
@@ -56,6 +60,22 @@ export default function OverlayLayers({
                   bounds = item.bounds.map((coord: string) =>
                     parseFloat(coord)
                   ) as [number, number, number, number];
+                } else {
+                  const layer = layers?.find((l) => l.id === item.dataLayerId);
+                  if (layer && layer.dataSourceId) {
+                    const source = sources?.find(
+                      (s) => s.id === layer.dataSourceId
+                    );
+                    if (source && sourceTypeIsCustomGLSource(source.type)) {
+                      const customSource =
+                        mapContext.manager?.getCustomGLSource(source.id);
+                      const metadata =
+                        await customSource?.getComputedMetadata();
+                      if (metadata?.bounds) {
+                        bounds = metadata.bounds;
+                      }
+                    }
+                  }
                 }
               }
               if (
@@ -89,7 +109,15 @@ export default function OverlayLayers({
         return [];
       }
     },
-    [items, mapContext.manager?.map, t, mapContext.manager]
+    [
+      items,
+      mapContext.manager?.map,
+      t,
+      mapContext.manager,
+      layers,
+      sources,
+      checkedItems,
+    ]
   );
 
   return (