Remove the need for split shader

Author: karimnaaji

debug/satellites-custom-layer.js

@@ -1,7 +1,7 @@
 const KM_TO_M = 1000;
 const TIME_STEP = 3 * 1000;
 
-const globeVertCode = `
+const vertCode = `
     attribute vec3 a_pos_ecef;
     attribute vec3 a_pos_merc;
 
@@ -11,16 +11,6 @@ const globeVertCode = `
     }
 `;
 
-const mercVertCode = `
-    precision highp float;
-    attribute vec3 a_pos_merc;
-
-    void main() {
-        gl_PointSize = 30.;
-        gl_Position = project_custom_layer(a_pos_merc);
-    }
-`;
-
 const fragCode = `
     precision highp float;
     uniform vec4 u_color;
@@ -83,8 +73,7 @@ const satellitesLayer = {
         this.posEcefVbo = gl.createBuffer();
         this.posMercVbo = gl.createBuffer();
 
-        this.globeProgram = createProgram(gl, map.customLayerVertexHeader.concat(globeVertCode), fragCode);
-        this.mercProgram = createProgram(gl, map.customLayerVertexHeader.concat(mercVertCode), fragCode);
+        this.program = createProgram(gl, map.customLayerVertexHeader.concat(vertCode), fragCode);
 
         fetch('space-track-leo.txt').then(r => r.text()).then(rawData => {
             const tleData = rawData.replace(/\r/g, '')
@@ -126,21 +115,20 @@ const satellitesLayer = {
         }
     },
 
-    getShaderProgram (projection) {
-        return projection && projection.name === 'globe' ? this.globeProgram : this.mercProgram;
+    getShaderProgram () {
+        return this.program;
     },
 
-    render (gl, projectionMatrix, projection) {
+    render (gl, projectionMatrix) {
         if (this.satData) {
             this.updateBuffers();
 
-            const program = this.getShaderProgram(projection);
             const primitiveCount = this.posEcef.length / 3;
             gl.disable(gl.DEPTH_TEST);
-            gl.useProgram(program);
+            gl.useProgram(this.program);
 
-            updateVboAndActivateAttrib(gl, program, this.posEcefVbo, this.posEcef, "a_pos_ecef");
-            updateVboAndActivateAttrib(gl, program, this.posMercVbo, this.posMerc, "a_pos_merc");
+            updateVboAndActivateAttrib(gl, this.program, this.posEcefVbo, this.posEcef, "a_pos_ecef");
+            updateVboAndActivateAttrib(gl, this.program, this.posMercVbo, this.posMerc, "a_pos_merc");
 
             gl.drawArrays(gl.POINTS, 0, primitiveCount);
         }

src/render/draw_custom.js

@@ -90,26 +90,24 @@ function drawCustom(painter: Painter, sourceCache: SourceCache, layer: CustomSty
 
         context.setDepthMode(depthMode);
 
-        const shaderProgram = implementation.getShaderProgram && implementation.getShaderProgram(painter.transform.getProjection());
-        if (painter.transform.projection.name === "globe") {
-            if (shaderProgram) {
-                context.gl.useProgram(shaderProgram);
+        const shaderProgram = implementation.getShaderProgram && implementation.getShaderProgram();
+        if (shaderProgram) {
+            context.gl.useProgram(shaderProgram);
+            context.gl.uniform1f(context.gl.getUniformLocation(shaderProgram, "u_isGlobe"), +(painter.transform.projection.name === "globe"));
+            context.gl.uniform1f(context.gl.getUniformLocation(shaderProgram, "u_transition"), globeToMercatorTransition(painter.transform.zoom));
+
+            if (painter.transform.projection.name === "globe") {
                 const center = painter.transform.pointMerc;
                 const globeProjection = mat4.multiply([], painter.transform.customLayerMatrix(), painter.transform.globeToMercatorMatrix());
-                const mercatorProjection = createMercatorGlobeMatrix(painter.transform.customLayerMatrix(), painter.transform.pixelsPerMeterRatio, center)
+                const mercatorProjection = createMercatorGlobeMatrix(painter.transform.customLayerMatrix(), painter.transform.pixelsPerMeterRatio, center);
                 context.gl.uniformMatrix4fv(context.gl.getUniformLocation(shaderProgram, "u_projection"), false, globeProjection);
                 context.gl.uniformMatrix4fv(context.gl.getUniformLocation(shaderProgram, "u_mercatorProjection"), false, mercatorProjection);
-                context.gl.uniform1f(context.gl.getUniformLocation(shaderProgram, "u_transition"), globeToMercatorTransition(painter.transform.zoom));
-            }
-
-            implementation.render(context.gl, painter.transform.customLayerMatrix(), painter.transform.getProjection());
-        } else {
-            if (shaderProgram) {
-                context.gl.useProgram(shaderProgram);
+            } else {
                 context.gl.uniformMatrix4fv(context.gl.getUniformLocation(shaderProgram, "u_projection"), false, painter.transform.customLayerMatrix());
             }
-            implementation.render(context.gl, painter.transform.customLayerMatrix(), painter.transform.getProjection());
         }
+        
+        implementation.render(context.gl, painter.transform.customLayerMatrix());
 
         context.setDirty();
         painter.setBaseState();

src/style/style_layer/custom_style_layer.js

@@ -7,7 +7,7 @@ import assert from 'assert';
 import type {ValidationErrors} from '../validate_style.js';
 import type {ProjectionSpecification} from '../../style-spec/types.js';
 
-type CustomRenderMethod = (gl: WebGLRenderingContext, matrix: Array<number>, projection: ?ProjectionSpecification) => void;
+type CustomRenderMethod = (gl: WebGLRenderingContext, matrix: Array<number>) => void;
 
 /**
  * Interface for custom style layers. This is a specification for
@@ -194,23 +194,24 @@ export function customLayerVertexHeader(): string {
     return `
         uniform mat4 u_projection;
         uniform mat4 u_mercatorProjection;
+        uniform float u_isGlobe;
         uniform float u_transition;
 
         vec4 project_custom_layer(vec3 pos_merc, vec3 pos_ecef) {
-            vec4 projected_pos = u_projection * vec4(pos_ecef, 1.0);
-            projected_pos /= projected_pos.w;
+            if (u_isGlobe == 1.0) {
+                vec4 projected_pos = u_projection * vec4(pos_ecef, 1.0);
+                projected_pos /= projected_pos.w;
 
-            if (u_transition > 0.0) {
-                vec4 mercator = u_mercatorProjection * vec4(pos_merc, 1.0);
-                mercator /= mercator.w;
-                projected_pos = mix(projected_pos, mercator, u_transition);
-            }
-
-            return projected_pos;
-        }
+                if (u_transition > 0.0) {
+                    vec4 mercator = u_mercatorProjection * vec4(pos_merc, 1.0);
+                    mercator /= mercator.w;
+                    projected_pos = mix(projected_pos, mercator, u_transition);
+                }
 
-        vec4 project_custom_layer(vec3 pos_merc) {
-            return u_projection * vec4(pos_merc, 1.0);
+                return projected_pos;
+            } else {
+                return u_projection * vec4(pos_merc, 1.0);
+            }
         }
     `;
 }