michael/pathfinder
michael
/
pathfinder
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Implement basic Loop-Blinn curves

This commit is contained in:
Patrick Walton 2017-08-14 19:08:18 -07:00
parent f8bd405759
commit 309034b7dd
2 changed files with 56 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
demo/client/src/index.ts
View File

@ -308,7 +308,9 @@ class PathfinderView {
}
resizeToFit() {
const width = window.innerWidth, height = window.innerHeight - this.canvas.scrollTop;
const width = window.innerWidth;
const height = window.scrollY + window.innerHeight -
this.canvas.getBoundingClientRect().top;
const devicePixelRatio = window.devicePixelRatio;
this.canvas.style.width = width + 'px';
this.canvas.style.height = height + 'px';
@ -331,6 +333,7 @@ class PathfinderView {
// Set up the depth buffer.
this.gl.depthFunc(this.gl.GREATER);
this.gl.depthMask(true);
this.gl.enable(this.gl.DEPTH_TEST);
// Set up the implicit cover interior VAO.
@ -359,10 +362,56 @@ class PathfinderView {
this.gl.uniform2i(directInteriorProgram.uniforms.uFramebufferSize,
this.canvas.width,
this.canvas.height);
const triangleCount =
this.gl.getBufferParameter(this.gl.ELEMENT_ARRAY_BUFFER, this.gl.BUFFER_SIZE) /
UINT32_SIZE;
this.gl.drawElements(this.gl.TRIANGLES, triangleCount, this.gl.UNSIGNED_INT, 0);
let indexCount = this.gl.getBufferParameter(this.gl.ELEMENT_ARRAY_BUFFER,
this.gl.BUFFER_SIZE) / UINT32_SIZE;
this.gl.drawElements(this.gl.TRIANGLES, indexCount, this.gl.UNSIGNED_INT, 0);
// Disable depth writing.
this.gl.depthMask(false);
// Set up the implicit cover curve VAO.
const directCurveProgram = shaderPrograms.directCurve;
this.gl.useProgram(directCurveProgram.program);
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.meshes.bVertexPositions);
this.gl.vertexAttribPointer(directCurveProgram.attributes.aPosition,
2,
this.gl.FLOAT,
false,
0,
0);
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.meshes.bVertexInfo);
this.gl.vertexAttribPointer(directCurveProgram.attributes.aTexCoord,
2,
this.gl.UNSIGNED_BYTE,
false,
B_VERTEX_QUAD_SIZE,
B_VERTEX_QUAD_TEX_COORD_OFFSET);
this.gl.vertexAttribPointer(directCurveProgram.attributes.aPathDepth,
1,
this.gl.UNSIGNED_SHORT, // FIXME(pcwalton)
true,
B_VERTEX_QUAD_SIZE,
B_VERTEX_QUAD_PATH_ID_OFFSET);
this.gl.vertexAttribPointer(directCurveProgram.attributes.aSign,
1,
this.gl.BYTE,
false,
B_VERTEX_QUAD_SIZE,
B_VERTEX_QUAD_SIGN_OFFSET);
this.gl.enableVertexAttribArray(directCurveProgram.attributes.aPosition);
this.gl.enableVertexAttribArray(directCurveProgram.attributes.aTexCoord);
this.gl.enableVertexAttribArray(directCurveProgram.attributes.aPathDepth);
this.gl.enableVertexAttribArray(directCurveProgram.attributes.aSign);
this.gl.bindBuffer(this.gl.ELEMENT_ARRAY_BUFFER, this.meshes.coverCurveIndices);
// Draw direct curve parts.
this.gl.uniformMatrix4fv(directCurveProgram.uniforms.uTransform, false, IDENTITY);
this.gl.uniform2i(directCurveProgram.uniforms.uFramebufferSize,
this.canvas.width,
this.canvas.height);
indexCount = this.gl.getBufferParameter(this.gl.ELEMENT_ARRAY_BUFFER,
this.gl.BUFFER_SIZE) / UINT32_SIZE;
this.gl.drawElements(this.gl.TRIANGLES, indexCount, this.gl.UNSIGNED_INT, 0);
// Clear dirty bit and finish.
this.dirty = false;

3
shaders/gles2/direct-curve.vs.glsl
View File

@ -23,7 +23,8 @@ void main() {
position = convertScreenToClipSpace(position, uFramebufferSize);
gl_Position = vec4(position, aPathDepth, 1.0);
vColor = fetchFloat4NormIndexedData(uPathColors, aPathDepth, uPathColorsDimensions);
//vColor = fetchFloat4NormIndexedData(uPathColors, aPathDepth, uPathColorsDimensions);
vColor = vec4(0.0, 0.0, 0.0, 1.0);
vTexCoord = vec2(aTexCoord) / 2.0;
vSign = aSign;
}