Enable early Z for edge detection and render only in the used area of…

… the atlas

demo/client/src/index.ts

@@ -153,10 +153,10 @@ type WebGLQuery = any;
 type WebGLVertexArrayObject = any;
 
 const QUAD_POSITIONS: Float32Array = new Float32Array([
-    -1.0,  1.0,
-     1.0,  1.0,
-    -1.0, -1.0,
-     1.0, -1.0,
+    0.0, 1.0,
+    1.0, 1.0,
+    0.0, 0.0,
+    1.0, 0.0,
 ]);
 
 const QUAD_TEX_COORDS: Float32Array = new Float32Array([
@@ -891,6 +891,33 @@ class PathfinderView {
         this.gl.uniform2i(uniforms.uFramebufferSize, currentViewport[2], currentViewport[3]);
     }
 
+    setIdentityTexScaleUniform(uniforms: UniformMap) {
+        this.gl.uniform2f(uniforms.uTexScale, 1.0, 1.0);
+    }
+
+    usedSizeFactor(): glmatrix.vec2 {
+        const usedSize = glmatrix.vec2.create();
+        glmatrix.vec2.div(usedSize, this.appController.atlas.usedSize, ATLAS_SIZE);
+        return usedSize;
+    }
+
+    setTransformSTAndTexScaleUniformsForAtlas(uniforms: UniformMap) {
+        const usedSize = this.usedSizeFactor();
+        this.gl.uniform4f(uniforms.uTransformST, 2.0 * usedSize[0], 2.0 * usedSize[1], -1.0, -1.0);
+        this.gl.uniform2f(uniforms.uTexScale, usedSize[0], usedSize[1]);
+    }
+
+    setTransformAndTexScaleUniformsForAtlas(uniforms: UniformMap) {
+        const usedSize = this.usedSizeFactor();
+
+        const transform = glmatrix.mat4.create();
+        glmatrix.mat4.fromTranslation(transform, [-1.0, -1.0, 0.0]);
+        glmatrix.mat4.scale(transform, transform, [2.0 * usedSize[0], 2.0 * usedSize[1], 1.0]);
+        this.gl.uniformMatrix4fv(uniforms.uTransform, false, transform);
+
+        this.gl.uniform2f(uniforms.uTexScale, usedSize[0], usedSize[1]);
+    }
+
     renderDirect() {
         // Set up implicit cover state.
         this.gl.depthFunc(this.gl.GREATER);
@@ -1018,6 +1045,7 @@ class PathfinderView {
         this.gl.activeTexture(this.gl.TEXTURE0);
         this.gl.bindTexture(this.gl.TEXTURE_2D, this.appController.atlas.ensureTexture(this.gl));
         this.gl.uniform1i(blitProgram.uniforms.uSource, 0);
+        this.setIdentityTexScaleUniform(blitProgram.uniforms);
         this.gl.drawElements(this.gl.TRIANGLES, this.textGlyphCount * 6, this.gl.UNSIGNED_INT, 0);
     }
 
@@ -1155,7 +1183,7 @@ class PathfinderBufferTexture {
         }
 
         if (remainderDimensions[2] > 0) {
-            // Round data up to a multiple of 4 if necessary.
+            // Round data up to a multiple of 4 elements if necessary.
             let remainderLength = data.length - splitIndex;
             let remainder: Float32Array | Uint8Array;
             if (remainderLength % 4 == 0) {
@@ -1310,10 +1338,10 @@ class SSAAStrategy implements AntialiasingStrategy {
         initQuadVAO(view, blitProgram.attributes);
 
         // Resolve framebuffer.
-        view.gl.uniformMatrix4fv(blitProgram.uniforms.uTransform, false, glmatrix.mat4.create());
         view.gl.activeTexture(view.gl.TEXTURE0);
         view.gl.bindTexture(view.gl.TEXTURE_2D, this.supersampledColorTexture);
         view.gl.uniform1i(blitProgram.uniforms.uSource, 0);
+        view.setTransformAndTexScaleUniformsForAtlas(blitProgram.uniforms);
         view.gl.bindBuffer(view.gl.ELEMENT_ARRAY_BUFFER, view.quadElementsBuffer);
         view.gl.drawElements(view.gl.TRIANGLES, 6, view.gl.UNSIGNED_BYTE, 0);
     }
@@ -1605,6 +1633,7 @@ class ECAAStrategy implements AntialiasingStrategy {
         view.gl.useProgram(edgeDetectProgram.program);
         view.vertexArrayObjectExt.bindVertexArrayOES(this.edgeDetectVAO);
         view.setFramebufferSizeUniform(edgeDetectProgram.uniforms);
+        view.setTransformSTAndTexScaleUniformsForAtlas(edgeDetectProgram.uniforms);
         view.gl.activeTexture(view.gl.TEXTURE0);
         view.gl.bindTexture(view.gl.TEXTURE_2D, this.directColorTexture);
         view.gl.uniform1i(edgeDetectProgram.uniforms.uColor, 0);
@@ -1616,15 +1645,15 @@ class ECAAStrategy implements AntialiasingStrategy {
         view.vertexArrayObjectExt.bindVertexArrayOES(null);
     }
 
-    cover(view: PathfinderView) {
+    private cover(view: PathfinderView) {
         // Set state for conservative coverage.
         const coverProgram = view.shaderPrograms.ecaaCover;
         view.gl.bindFramebuffer(view.gl.FRAMEBUFFER, this.aaFramebuffer);
         view.gl.viewport(0, 0, this.framebufferSize[0], this.framebufferSize[1]);
 
         view.gl.depthMask(false);
-        //view.gl.depthFunc(view.gl.EQUAL);
-        view.gl.depthFunc(view.gl.ALWAYS);
+        view.gl.depthFunc(view.gl.EQUAL);
+        //view.gl.depthFunc(view.gl.ALWAYS);
         view.gl.enable(view.gl.DEPTH_TEST);
         view.gl.blendEquation(view.gl.FUNC_ADD);
         view.gl.blendFunc(view.gl.ONE, view.gl.ONE);
@@ -1649,13 +1678,13 @@ class ECAAStrategy implements AntialiasingStrategy {
         view.vertexArrayObjectExt.bindVertexArrayOES(null);
     }
 
-    setAAState(view: PathfinderView) {
+    private setAAState(view: PathfinderView) {
         view.gl.bindFramebuffer(view.gl.FRAMEBUFFER, this.aaFramebuffer);
         view.gl.viewport(0, 0, this.framebufferSize[0], this.framebufferSize[1]);
 
         view.gl.depthMask(false);
-        //view.gl.depthFunc(view.gl.EQUAL);
-        view.gl.depthFunc(view.gl.ALWAYS);
+        view.gl.depthFunc(view.gl.EQUAL);
+        //view.gl.depthFunc(view.gl.ALWAYS);
         view.gl.enable(view.gl.DEPTH_TEST);
         view.gl.blendEquation(view.gl.FUNC_REVERSE_SUBTRACT);
         view.gl.blendFunc(view.gl.ONE, view.gl.ONE);
@@ -1669,7 +1698,7 @@ class ECAAStrategy implements AntialiasingStrategy {
         view.atlasTransformBuffer.bind(view.gl, uniforms, 2);
     }
 
-    antialiasLines(view: PathfinderView) {
+    private antialiasLines(view: PathfinderView) {
         this.setAAState(view);
 
         const lineProgram = view.shaderPrograms.ecaaLine;
@@ -1694,7 +1723,7 @@ class ECAAStrategy implements AntialiasingStrategy {
         view.vertexArrayObjectExt.bindVertexArrayOES(null);
     }
 
-    antialiasCurves(view: PathfinderView) {
+    private antialiasCurves(view: PathfinderView) {
         this.setAAState(view);
 
         const curveProgram = view.shaderPrograms.ecaaCurve;
@@ -1719,7 +1748,7 @@ class ECAAStrategy implements AntialiasingStrategy {
         view.vertexArrayObjectExt.bindVertexArrayOES(null);
     }
 
-    resolveAA(view: PathfinderView) {
+    private resolveAA(view: PathfinderView) {
         // Set state for ECAA resolve.
         view.gl.bindFramebuffer(view.gl.FRAMEBUFFER, view.atlasFramebuffer);
         view.gl.viewport(0, 0, this.framebufferSize[0], this.framebufferSize[1]);
@@ -1741,6 +1770,7 @@ class ECAAStrategy implements AntialiasingStrategy {
         view.gl.activeTexture(view.gl.TEXTURE2);
         view.gl.bindTexture(view.gl.TEXTURE_2D, this.aaAlphaTexture);
         view.gl.uniform1i(resolveProgram.uniforms.uAAAlpha, 2);
+        view.setTransformSTAndTexScaleUniformsForAtlas(resolveProgram.uniforms);
         view.gl.drawElements(view.gl.TRIANGLES, 6, view.gl.UNSIGNED_BYTE, 0);
         view.vertexArrayObjectExt.bindVertexArrayOES(null);
     }

shaders/gles2/blit.vs.glsl

@@ -5,6 +5,7 @@
 precision mediump float;
 
 uniform mat4 uTransform;
+uniform vec2 uTexScale;
 
 attribute vec2 aPosition;
 attribute vec2 aTexCoord;
@@ -13,5 +14,5 @@ varying vec2 vTexCoord;
 
 void main() {
     gl_Position = uTransform * vec4(aPosition, 0.0, 1.0);
-    vTexCoord = aTexCoord;
+    vTexCoord = aTexCoord * uTexScale;
 }

shaders/gles2/common.inc.glsl

@@ -40,10 +40,14 @@ vec2 convertScreenToClipSpace(vec2 position, ivec2 framebufferSize) {
     return position / vec2(framebufferSize) * 2.0 - 1.0;
 }
 
-float convertPathIndexToDepthValue(int pathIndex) {
+float convertPathIndexToViewportDepthValue(int pathIndex) {
     return mix(-1.0, 1.0, float(pathIndex) / float(MAX_PATHS));
 }
 
+float convertPathIndexToWindowDepthValue(int pathIndex) {
+    return float(pathIndex) / float(MAX_PATHS);
+}
+
 bool computeQuadPosition(out vec2 outPosition,
                          inout vec2 leftPosition,
                          inout vec2 rightPosition,
@@ -64,10 +68,7 @@ bool computeQuadPosition(out vec2 outPosition,
     vec4 roundedExtents = vec4(floor(vec2(leftPosition.x, verticalExtents.x)),
                                ceil(vec2(rightPosition.x, verticalExtents.y)));
 
-    // FIXME(pcwalton): Use a separate VBO for this.
-    quadPosition = (quadPosition + 1.0) * 0.5;
-
-    vec2 position = mix(roundedExtents.xy, roundedExtents.zw,  quadPosition);
+    vec2 position = mix(roundedExtents.xy, roundedExtents.zw, quadPosition);
     outPosition = convertScreenToClipSpace(position, framebufferSize);
     return true;
 }

shaders/gles2/direct-curve.vs.glsl

@@ -30,7 +30,7 @@ void main() {
     position = transformVertexPosition(position, uTransform);
     position = convertScreenToClipSpace(position, uFramebufferSize);
 
-    float depth = convertPathIndexToDepthValue(pathID);
+    float depth = convertPathIndexToViewportDepthValue(pathID);
     gl_Position = vec4(position, depth, 1.0);
 
     vColor = fetchFloat4Data(uPathColors, pathID, uPathColorsDimensions);

shaders/gles2/direct-interior.vs.glsl

@@ -26,7 +26,7 @@ void main() {
     position = transformVertexPosition(position, uTransform);
     position = convertScreenToClipSpace(position, uFramebufferSize);
 
-    float depth = convertPathIndexToDepthValue(pathID);
+    float depth = convertPathIndexToViewportDepthValue(pathID);
     gl_Position = vec4(position, depth, 1.0);
 
     vColor = fetchFloat4Data(uPathColors, pathID, uPathColorsDimensions);

shaders/gles2/ecaa-cover.vs.glsl

@@ -56,12 +56,9 @@ void main() {
 
     vec4 roundedExtents = vec4(floor(extents.xy), ceil(extents.zw));
 
-    // FIXME(pcwalton): Use a separate VBO for this.
-    vec2 quadPosition = (aQuadPosition + 1.0) * 0.5;
-
-    vec2 position = mix(roundedExtents.xy, roundedExtents.zw, quadPosition);
+    vec2 position = mix(roundedExtents.xy, roundedExtents.zw, aQuadPosition);
     position = convertScreenToClipSpace(position, uFramebufferSize);
-    float depth = convertPathIndexToDepthValue(pathID);
+    float depth = convertPathIndexToViewportDepthValue(pathID);
     gl_Position = vec4(position, depth, 1.0);
 
     vHorizontalExtents = extents.xz;

shaders/gles2/ecaa-curve.vs.glsl

@@ -50,7 +50,7 @@ void main() {
         controlPointPosition = transformVertexPositionST(controlPointPosition, transform);
     }
 
-    float depth = convertPathIndexToDepthValue(pathID);
+    float depth = convertPathIndexToViewportDepthValue(pathID);
 
     gl_Position = vec4(position, depth, 1.0);
     vEndpoints = vec4(leftPosition, rightPosition);

shaders/gles2/ecaa-edge-detect.fs.glsl

@@ -63,7 +63,7 @@ void main() {
     // Determine the depth.
     //
     // If all colors are the same, avoid touching this pixel in any further passes.
-    float outDepth = fgColor == bgColor ? -1.0 : convertPathIndexToDepthValue(fgPathID);
+    float outDepth = fgColor == bgColor ? -1.0 : convertPathIndexToWindowDepthValue(fgPathID);
 
     // Output results.
     gl_FragData[0] = bgColor;

shaders/gles2/ecaa-edge-detect.vs.glsl

@@ -4,12 +4,15 @@
 
 precision highp float;
 
+uniform vec4 uTransformST;
+uniform vec2 uTexScale;
+
 attribute vec2 aPosition;
 attribute vec2 aTexCoord;
 
 varying vec2 vTexCoord;
 
 void main() {
-    gl_Position = vec4(aPosition, 0.0, 1.0);
-    vTexCoord = aTexCoord;
+    gl_Position = vec4(transformVertexPositionST(aPosition, uTransformST), 0.0, 1.0);
+    vTexCoord = aTexCoord * uTexScale;
 }

shaders/gles2/ecaa-line.vs.glsl

@@ -43,7 +43,7 @@ void main() {
                         uFramebufferSize,
                         transform);
 
-    float depth = convertPathIndexToDepthValue(pathID);
+    float depth = convertPathIndexToViewportDepthValue(pathID);
 
     gl_Position = vec4(position, depth, 1.0);
     vEndpoints = vec4(leftPosition, rightPosition);

shaders/gles2/ecaa-resolve.fs.glsl

@@ -4,7 +4,6 @@
 
 precision highp float;
 
-uniform ivec2 uFramebufferSize;
 uniform sampler2D uBGColor;
 uniform sampler2D uFGColor;
 uniform sampler2D uAAAlpha;

shaders/gles2/ecaa-resolve.vs.glsl

@@ -4,12 +4,15 @@
 
 precision highp float;
 
+uniform vec4 uTransformST;
+uniform vec2 uTexScale;
+
 attribute vec2 aPosition;
 attribute vec2 aTexCoord;
 
 varying vec2 vTexCoord;
 
 void main() {
-    gl_Position = vec4(aPosition, 0.0, 1.0);
-    vTexCoord = aTexCoord;
+    gl_Position = vec4(transformVertexPositionST(aPosition, uTransformST), 0.0, 1.0);
+    vTexCoord = aTexCoord * uTexScale;
 }