@deck.gl/extensions 9.0.35 → 9.1.0-beta.1

package/src/path-style/path-style-extension.ts

@@ -1,29 +1,13 @@
-// Copyright (c) 2015 - 2017 Uber Technologies, Inc.
-//
-// Permission is hereby granted, free of charge, to any person obtaining a copy
-// of this software and associated documentation files (the "Software"), to deal
-// in the Software without restriction, including without limitation the rights
-// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-// copies of the Software, and to permit persons to whom the Software is
-// furnished to do so, subject to the following conditions:
-//
-// The above copyright notice and this permission notice shall be included in
-// all copies or substantial portions of the Software.
-//
-// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-// THE SOFTWARE.
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
 
 import {LayerExtension, _mergeShaders as mergeShaders} from '@deck.gl/core';
 import {vec3} from '@math.gl/core';
 import {dashShaders, offsetShaders} from './shaders.glsl';
 
 import type {Layer, LayerContext, Accessor, UpdateParameters} from '@deck.gl/core';
-import type {Model} from '@luma.gl/engine';
+import type {ShaderModule} from '@luma.gl/shadertools';
 
 const defaultProps = {
   getDashArray: {type: 'accessor', value: [0, 0]},
@@ -32,6 +16,11 @@ const defaultProps = {
   dashGapPickable: false
 };
 
+type PathStyleProps = {
+  dashAlignMode: number;
+  dashGapPickable: boolean;
+};
+
 export type PathStyleExtensionProps<DataT = any> = {
   /**
    * Accessor for the dash array to draw each path with: `[dashSize, gapSize]` relative to the width of the path.
@@ -97,7 +86,7 @@ export default class PathStyleExtension extends LayerExtension<PathStyleExtensio
     }
 
     // Merge shader injection
-    let result = {};
+    let result = {} as {inject: Record<string, string>};
     if (extension.opts.dash) {
       result = mergeShaders(result, dashShaders);
     }
@@ -105,7 +94,18 @@ export default class PathStyleExtension extends LayerExtension<PathStyleExtensio
       result = mergeShaders(result, offsetShaders);
     }
 
-    return result;
+    const {inject} = result;
+    const pathStyle: ShaderModule<PathStyleProps> = {
+      name: 'pathStyle',
+      inject,
+      uniformTypes: {
+        dashAlignMode: 'f32',
+        dashGapPickable: 'i32'
+      }
+    };
+    return {
+      modules: [pathStyle]
+    };
   }
 
   initializeState(this: Layer<PathStyleExtensionProps>, context: LayerContext, extension: this) {
@@ -149,14 +149,13 @@ export default class PathStyleExtension extends LayerExtension<PathStyleExtensio
       return;
     }
 
-    const uniforms: any = {};
-
     if (extension.opts.dash) {
-      uniforms.dashAlignMode = this.props.dashJustified ? 1 : 0;
-      uniforms.dashGapPickable = Boolean(this.props.dashGapPickable);
+      const pathStyleProps: PathStyleProps = {
+        dashAlignMode: this.props.dashJustified ? 1 : 0,
+        dashGapPickable: Boolean(this.props.dashGapPickable)
+      };
+      this.setShaderModuleProps({pathStyle: pathStyleProps});
     }
-
-    (this.state.model as Model)?.setUniforms(uniforms);
   }
 
   getDashOffsets(this: Layer<PathStyleExtensionProps>, path: number[] | number[][]): number[] {

package/src/path-style/shaders.glsl.ts

@@ -1,3 +1,7 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 export const dashShaders = {
   inject: {
     'vs:#decl': `
@@ -13,9 +17,11 @@ vDashOffset = instanceDashOffsets / width.x;
 `,
 
     'fs:#decl': `
-uniform float dashAlignMode;
-uniform float capType;
-uniform bool dashGapPickable;
+uniform pathStyleUniforms {
+  float dashAlignMode;
+  bool dashGapPickable;
+} pathStyle;
+
 in vec2 vDashArray;
 in float vDashOffset;
 `,
@@ -36,7 +42,7 @@ in float vDashOffset;
   float offset;
 
   if (unitLength > 0.0) {
-    if (dashAlignMode == 0.0) {
+    if (pathStyle.dashAlignMode == 0.0) {
       offset = vDashOffset;
     } else {
       unitLength = vPathLength / round(vPathLength / unitLength);
@@ -46,8 +52,8 @@ in float vDashOffset;
     float unitOffset = mod(vPathPosition.y + offset, unitLength);
 
     if (gapLength > 0.0 && unitOffset > solidLength) {
-      if (capType <= 0.5) {
-        if (!(dashGapPickable && bool(picking.isActive))) {
+      if (path.capType <= 0.5) {
+        if (!(pathStyle.dashGapPickable && bool(picking.isActive))) {
           discard;
         }
       } else {
@@ -57,7 +63,7 @@ in float vDashOffset;
           vPathPosition.x
         ));
         if (distToEnd > 1.0) {
-          if (!(dashGapPickable && bool(picking.isActive))) {
+          if (!(pathStyle.dashGapPickable && bool(picking.isActive))) {
             discard;
           }
         }

package/src/terrain/height-map-builder.ts

@@ -1,3 +1,7 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 import {Device, Framebuffer} from '@luma.gl/core';
 import {joinLayerBounds, getRenderBounds, makeViewport, Bounds} from '../utils/projection-utils';
 import {createRenderTarget} from './utils';

package/src/terrain/shader-module.ts

@@ -1,16 +1,20 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 /* eslint-disable camelcase */
 
 import type {ShaderModule} from '@luma.gl/shadertools';
-import {project} from '@deck.gl/core';
+import {project, ProjectProps, ProjectUniforms, Viewport} from '@deck.gl/core';
 
 import type {Texture} from '@luma.gl/core';
 import type {Bounds} from '../utils/projection-utils';
 import type {TerrainCover} from './terrain-cover';
-import {glsl} from '../utils/syntax-tags';
 
 /** Module parameters expected by the terrain shader module */
-export type TerrainModuleSettings = {
-  picking: {isActive?: boolean};
+export type TerrainModuleProps = {
+  project: ProjectProps;
+  isPicking: boolean;
   heightMap: Texture | null;
   heightMapBounds?: Bounds | null;
   dummyHeightMap: Texture;
@@ -20,6 +24,15 @@ export type TerrainModuleSettings = {
   terrainSkipRender?: boolean;
 };
 
+type TerrainModuleUniforms = {
+  mode: number;
+  bounds: [number, number, number, number];
+};
+
+type TerrainModuleBindings = {
+  terrain_map: Texture;
+};
+
 /** A model can have one of the following modes */
 export const TERRAIN_MODE = {
   NONE: 0,
@@ -39,35 +52,44 @@ const TERRAIN_MODE_CONSTANTS = Object.keys(TERRAIN_MODE)
   .map(key => `const float TERRAIN_MODE_${key} = ${TERRAIN_MODE[key]}.0;`)
   .join('\n');
 
+const uniformBlock =
+  // eslint-disable-next-line prefer-template
+  TERRAIN_MODE_CONSTANTS +
+  /* glsl */ `
+uniform terrainUniforms {
+  float mode;
+  vec4 bounds;
+} terrain;
+
+uniform sampler2D terrain_map;
+`;
+
 export const terrainModule = {
   name: 'terrain',
   dependencies: [project],
+  // eslint-disable-next-line prefer-template
+  vs: uniformBlock + /* glsl */ 'out vec3 commonPos;',
+  // eslint-disable-next-line prefer-template
+  fs: uniformBlock + /* glsl */ 'in vec3 commonPos;',
   inject: {
-    'vs:#decl':
-      glsl`
-uniform float terrain_mode;
-uniform sampler2D terrain_map;
-uniform vec4 terrain_bounds;
-out vec3 commonPos;
-` + TERRAIN_MODE_CONSTANTS,
-    'vs:#main-start': glsl`
-if (terrain_mode == TERRAIN_MODE_SKIP) {
+    'vs:#main-start': /* glsl */ `
+if (terrain.mode == TERRAIN_MODE_SKIP) {
   gl_Position = vec4(0.0);
   return;
 }
 `,
-    'vs:DECKGL_FILTER_GL_POSITION': glsl`
+    'vs:DECKGL_FILTER_GL_POSITION': /* glsl */ `
 commonPos = geometry.position.xyz;
-if (terrain_mode == TERRAIN_MODE_WRITE_HEIGHT_MAP) {
-  vec2 texCoords = (commonPos.xy - terrain_bounds.xy) / terrain_bounds.zw;
+if (terrain.mode == TERRAIN_MODE_WRITE_HEIGHT_MAP) {
+  vec2 texCoords = (commonPos.xy - terrain.bounds.xy) / terrain.bounds.zw;
   position = vec4(texCoords * 2.0 - 1.0, 0.0, 1.0);
-  commonPos.z += project_uCommonOrigin.z;
+  commonPos.z += project.commonOrigin.z;
 }
-if (terrain_mode == TERRAIN_MODE_USE_HEIGHT_MAP) {
+if (terrain.mode == TERRAIN_MODE_USE_HEIGHT_MAP) {
   vec3 anchor = geometry.worldPosition;
   anchor.z = 0.0;
   vec3 anchorCommon = project_position(anchor);
-  vec2 texCoords = (anchorCommon.xy - terrain_bounds.xy) / terrain_bounds.zw;
+  vec2 texCoords = (anchorCommon.xy - terrain.bounds.xy) / terrain.bounds.zw;
   if (texCoords.x >= 0.0 && texCoords.y >= 0.0 && texCoords.x <= 1.0 && texCoords.y <= 1.0) {
     float terrainZ = texture(terrain_map, texCoords).r;
     geometry.position.z += terrainZ;
@@ -75,24 +97,17 @@ if (terrain_mode == TERRAIN_MODE_USE_HEIGHT_MAP) {
   }
 }
     `,
-    'fs:#decl':
-      glsl`
-uniform float terrain_mode;
-uniform sampler2D terrain_map;
-uniform vec4 terrain_bounds;
-in vec3 commonPos;
-` + TERRAIN_MODE_CONSTANTS,
-    'fs:#main-start': glsl`
-if (terrain_mode == TERRAIN_MODE_WRITE_HEIGHT_MAP) {
+    'fs:#main-start': /* glsl */ `
+if (terrain.mode == TERRAIN_MODE_WRITE_HEIGHT_MAP) {
   fragColor = vec4(commonPos.z, 0.0, 0.0, 1.0);
   return;
 }
     `,
-    'fs:DECKGL_FILTER_COLOR': glsl`
-if ((terrain_mode == TERRAIN_MODE_USE_COVER) || (terrain_mode == TERRAIN_MODE_USE_COVER_ONLY)) {
-  vec2 texCoords = (commonPos.xy - terrain_bounds.xy) / terrain_bounds.zw;
+    'fs:DECKGL_FILTER_COLOR': /* glsl */ `
+if ((terrain.mode == TERRAIN_MODE_USE_COVER) || (terrain.mode == TERRAIN_MODE_USE_COVER_ONLY)) {
+  vec2 texCoords = (commonPos.xy - terrain.bounds.xy) / terrain.bounds.zw;
   vec4 pixel = texture(terrain_map, texCoords);
-  if (terrain_mode == TERRAIN_MODE_USE_COVER_ONLY) {
+  if (terrain.mode == TERRAIN_MODE_USE_COVER_ONLY) {
     color = pixel;
   } else {
     // pixel is premultiplied
@@ -103,7 +118,7 @@ if ((terrain_mode == TERRAIN_MODE_USE_COVER) || (terrain_mode == TERRAIN_MODE_US
     `
   },
   // eslint-disable-next-line complexity
-  getUniforms: (opts: Partial<TerrainModuleSettings> = {}, uniforms) => {
+  getUniforms: (opts: Partial<TerrainModuleProps> = {}) => {
     if ('dummyHeightMap' in opts) {
       const {
         drawToTerrainHeightMap,
@@ -114,8 +129,8 @@ if ((terrain_mode == TERRAIN_MODE_USE_COVER) || (terrain_mode == TERRAIN_MODE_US
         useTerrainHeightMap,
         terrainSkipRender
       } = opts;
-      // @ts-expect-error stricter luma gl types
-      const {project_uCommonOrigin} = uniforms;
+      const projectUniforms = project.getUniforms(opts.project) as ProjectUniforms;
+      const {commonOrigin} = projectUniforms;
 
       let mode: number = terrainSkipRender ? TERRAIN_MODE.SKIP : TERRAIN_MODE.NONE;
       // height map if case USE_HEIGHT_MAP, terrain cover if USE_COVER, otherwise empty
@@ -131,12 +146,11 @@ if ((terrain_mode == TERRAIN_MODE_USE_COVER) || (terrain_mode == TERRAIN_MODE_US
         bounds = heightMapBounds!;
       } else if (terrainCover) {
         // This is a terrain layer
-        const isPicking = opts.picking?.isActive;
-        const fbo = isPicking
+        const fbo = opts.isPicking
           ? terrainCover.getPickingFramebuffer()
           : terrainCover.getRenderFramebuffer();
         sampler = fbo?.colorAttachments[0].texture;
-        if (isPicking) {
+        if (opts.isPicking) {
           // Never render the layer itself in picking pass
           mode = TERRAIN_MODE.SKIP;
         }
@@ -150,19 +164,23 @@ if ((terrain_mode == TERRAIN_MODE_USE_COVER) || (terrain_mode == TERRAIN_MODE_US
 
       /* eslint-disable camelcase */
       return {
-        terrain_mode: mode,
+        mode,
         terrain_map: sampler,
         // Convert bounds to the common space, as [minX, minY, width, height]
-        terrain_bounds: bounds
+        bounds: bounds
           ? [
-              bounds[0] - project_uCommonOrigin[0],
-              bounds[1] - project_uCommonOrigin[1],
+              bounds[0] - commonOrigin[0],
+              bounds[1] - commonOrigin[1],
               bounds[2] - bounds[0],
               bounds[3] - bounds[1]
             ]
           : [0, 0, 0, 0]
       };
     }
-    return null;
+    return {};
+  },
+  uniformTypes: {
+    mode: 'f32',
+    bounds: 'vec4<f32>'
   }
-} as ShaderModule<TerrainModuleSettings>;
+} as const satisfies ShaderModule<TerrainModuleProps, TerrainModuleUniforms, TerrainModuleBindings>;

package/src/terrain/terrain-cover.ts

@@ -1,3 +1,7 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 import {Framebuffer} from '@luma.gl/core';
 
 import type {Layer, Viewport} from '@deck.gl/core';

package/src/terrain/terrain-effect.ts

@@ -1,7 +1,11 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 import {Texture} from '@luma.gl/core';
 import {log} from '@deck.gl/core';
 
-import {terrainModule, TerrainModuleSettings} from './shader-module';
+import {terrainModule, TerrainModuleProps} from './shader-module';
 import {TerrainCover} from './terrain-cover';
 import {TerrainPass} from './terrain-pass';
 import {TerrainPickingPass, TerrainPickingPassRenderOptions} from './terrain-picking-pass';
@@ -43,7 +47,6 @@ export class TerrainEffect implements Effect {
       log.warn('Terrain offset mode is not supported by this browser')();
     }
 
-    // @ts-expect-error stricter luma gl types
     deck._addDefaultShaderModule(terrainModule);
   }
 
@@ -83,16 +86,23 @@ export class TerrainEffect implements Effect {
     this._updateTerrainCovers(terrainLayers, drapeLayers, viewport, opts);
   }
 
-  getModuleParameters(layer: Layer): Omit<TerrainModuleSettings, 'picking'> {
+  getShaderModuleProps(
+    layer: Layer,
+    otherShaderModuleProps: Record<string, any>
+  ): {terrain: TerrainModuleProps} {
     const {terrainDrawMode} = layer.state;
 
     return {
-      heightMap: this.heightMap?.getRenderFramebuffer()?.colorAttachments[0].texture || null,
-      heightMapBounds: this.heightMap?.bounds,
-      dummyHeightMap: this.dummyHeightMap!,
-      terrainCover: this.isDrapingEnabled ? this.terrainCovers.get(layer.id) : null,
-      useTerrainHeightMap: terrainDrawMode === 'offset',
-      terrainSkipRender: terrainDrawMode === 'drape' || !layer.props.operation.includes('draw')
+      terrain: {
+        project: otherShaderModuleProps.project,
+        isPicking: this.isPicking,
+        heightMap: this.heightMap?.getRenderFramebuffer()?.colorAttachments[0].texture || null,
+        heightMapBounds: this.heightMap?.bounds,
+        dummyHeightMap: this.dummyHeightMap!,
+        terrainCover: this.isDrapingEnabled ? this.terrainCovers.get(layer.id) : null,
+        useTerrainHeightMap: terrainDrawMode === 'offset',
+        terrainSkipRender: terrainDrawMode === 'drape' || !layer.props.operation.includes('draw')
+      }
     };
   }
 
@@ -112,7 +122,6 @@ export class TerrainEffect implements Effect {
     }
     this.terrainCovers.clear();
 
-    // @ts-expect-error stricter luma gl types
     deck._removeDefaultShaderModule(terrainModule);
   }
 
@@ -130,11 +139,15 @@ export class TerrainEffect implements Effect {
     this.terrainPass.renderHeightMap(this.heightMap, {
       ...opts,
       layers: terrainLayers,
-      moduleParameters: {
-        heightMapBounds: this.heightMap.bounds,
-        dummyHeightMap: this.dummyHeightMap,
-        devicePixelRatio: 1,
-        drawToTerrainHeightMap: true
+      shaderModuleProps: {
+        terrain: {
+          heightMapBounds: this.heightMap.bounds,
+          dummyHeightMap: this.dummyHeightMap,
+          drawToTerrainHeightMap: true
+        },
+        project: {
+          devicePixelRatio: 1
+        }
       }
     });
   }
@@ -188,10 +201,14 @@ export class TerrainEffect implements Effect {
         renderPass.renderTerrainCover(terrainCover, {
           ...opts,
           layers: drapeLayers,
-          moduleParameters: {
-            dummyHeightMap: this.dummyHeightMap,
-            terrainSkipRender: false,
-            devicePixelRatio: 1
+          shaderModuleProps: {
+            terrain: {
+              dummyHeightMap: this.dummyHeightMap,
+              terrainSkipRender: false
+            },
+            project: {
+              devicePixelRatio: 1
+            }
           }
         });
 

package/src/terrain/terrain-extension.ts

@@ -1,3 +1,7 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 import {LayerExtension, UpdateParameters} from '@deck.gl/core';
 import {TerrainEffect} from './terrain-effect';
 import {terrainModule} from './shader-module';

package/src/terrain/terrain-pass.ts

@@ -1,3 +1,7 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 import {RenderPipelineParameters} from '@luma.gl/core';
 import {Layer, Viewport, _LayersPass as LayersPass, LayersPassRenderOptions} from '@deck.gl/core';
 import type {HeightMapBuilder} from './height-map-builder';
@@ -83,4 +87,12 @@ export class TerrainPass extends LayersPass {
       ...(layer.props.operation.includes('terrain') && TERRAIN_BLENDING)
     };
   }
+
+  getShaderModuleProps(layer: Layer, effects: any, otherShaderModuleProps: Record<string, any>) {
+    return {
+      terrain: {
+        project: otherShaderModuleProps.project
+      }
+    };
+  }
 }

package/src/terrain/terrain-picking-pass.ts

@@ -1,3 +1,7 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 import {
   Layer,
   Viewport,
@@ -78,4 +82,12 @@ export class TerrainPickingPass extends PickLayersPass {
     }
     return {...parameters, depthTest: false};
   }
+
+  getShaderModuleProps(layer: Layer, effects: any, otherShaderModuleProps: Record<string, any>) {
+    return {
+      terrain: {
+        project: otherShaderModuleProps.project
+      }
+    };
+  }
 }

package/src/terrain/utils.ts

@@ -1,3 +1,7 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 import type {Device} from '@luma.gl/core';
 import {GL} from '@luma.gl/constants';
 

package/src/utils/debug.ts

@@ -1,3 +1,7 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 /* global document */
 
 import {Framebuffer} from '@luma.gl/core';

package/src/utils/projection-utils.ts

@@ -1,3 +1,7 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
 import {WebMercatorViewport, OrthographicViewport} from '@deck.gl/core';
 import type {Layer, Viewport} from '@deck.gl/core';
 

package/dist/utils/syntax-tags.d.ts

@@ -1,6 +0,0 @@
-/**
- * Marks GLSL shaders for syntax highlighting: glsl`...`
- * Install https://marketplace.visualstudio.com/items?itemName=boyswan.glsl-literal
- */
-export declare const glsl: (s: TemplateStringsArray) => string;
-//# sourceMappingURL=syntax-tags.d.ts.map

package/dist/utils/syntax-tags.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"syntax-tags.d.ts","sourceRoot":"","sources":["../../src/utils/syntax-tags.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,IAAI,MAAO,oBAAoB,WAAW,CAAC"}

package/dist/utils/syntax-tags.js

@@ -1,5 +0,0 @@
-/**
- * Marks GLSL shaders for syntax highlighting: glsl`...`
- * Install https://marketplace.visualstudio.com/items?itemName=boyswan.glsl-literal
- */
-export const glsl = (s) => `${s}`;

package/src/utils/syntax-tags.ts

@@ -1,5 +0,0 @@
-/**
- * Marks GLSL shaders for syntax highlighting: glsl`...`
- * Install https://marketplace.visualstudio.com/items?itemName=boyswan.glsl-literal
- */
-export const glsl = (s: TemplateStringsArray) => `${s}`;