diff --git a/client/webgl_draw.js b/client/webgl_draw.js index 5e3979c..d3b81ec 100644 --- a/client/webgl_draw.js +++ b/client/webgl_draw.js @@ -137,7 +137,6 @@ function draw(state, context) { gl.uniform2f(locations['u_translation'], state.canvas.offset.x, state.canvas.offset.y); gl.uniform1i(locations['u_stroke_count'], state.stroke_count); gl.uniform1i(locations['u_debug_mode'], state.debug.red); - gl.uniform1i(locations['u_shrink'], 1); gl.enableVertexAttribArray(locations['a_pos']); gl.enableVertexAttribArray(locations['a_line']); @@ -178,8 +177,6 @@ function draw(state, context) { gl.vertexAttribPointer(locations['a_color'], 3, gl.UNSIGNED_BYTE, true, config.bytes_per_point, 4 * 3 + 4 * 4); gl.vertexAttribIPointer(locations['a_stroke_id'], 1, gl.INT, config.bytes_per_point, 4 * 3 + 4 * 4 + 4); - gl.uniform1i(locations['u_shrink'], 0); - if (context.need_dynamic_upload) { gl.bufferData(gl.ARRAY_BUFFER, new Uint8Array(context.dynamic_serializer.buffer, 0, context.dynamic_serializer.offset), gl.DYNAMIC_DRAW); context.need_dynamic_upload = false; diff --git a/client/webgl_shaders.js b/client/webgl_shaders.js index d615e36..b96a8ac 100644 --- a/client/webgl_shaders.js +++ b/client/webgl_shaders.js @@ -113,7 +113,6 @@ const sdf_vs_src = `#version 300 es uniform vec2 u_translation; uniform int u_stroke_count; - uniform int u_shrink; out vec4 v_line; out vec2 v_texcoord; @@ -125,36 +124,32 @@ const sdf_vs_src = `#version 300 es vec2 screen01 = (a_pos.xy * u_scale + u_translation) / u_res; vec2 screen02 = screen01 * 2.0; - if (u_shrink == 1) { - // Inflate quad by 2 pixels (change to 1 when I figure out how to fix the prepass shit) - float apron = 2.0; - vec2 line_dir = normalize(a_line.zw - a_line.xy); - vec2 up_dir = vec2(line_dir.y, -line_dir.x); - vec2 pixel = vec2(2.0) / u_res * apron; - - int vertex_index = gl_VertexID % 4; - - if (vertex_index == 0) { - // "top left" aka "p1" - screen02 += up_dir * pixel - line_dir * pixel; - v_texcoord = a_pos.xy + up_dir * 1.0 / u_scale - line_dir * 1.0 / u_scale; - } else if (vertex_index == 1) { - // "top right" aka "p2" - screen02 += up_dir * pixel + line_dir * pixel; - v_texcoord = a_pos.xy + up_dir * 1.0 / u_scale + line_dir * 1.0 / u_scale; - } else if (vertex_index == 2) { - // "bottom left" aka "p3" - screen02 += -up_dir * pixel - line_dir * pixel; - v_texcoord = a_pos.xy - up_dir * 1.0 / u_scale - line_dir * 1.0 / u_scale; - } else { - // "bottom right" aka "p4" - screen02 += -up_dir * pixel + line_dir * pixel; - v_texcoord = a_pos.xy - up_dir * 1.0 / u_scale + line_dir * 1.0 / u_scale; - } + float apron = 2.0; + vec2 line_dir = normalize(a_line.zw - a_line.xy); + vec2 up_dir = vec2(line_dir.y, -line_dir.x); + vec2 pixel = vec2(2.0) / u_res * apron; + float rscale = apron / u_scale.x; + + int vertex_index = gl_VertexID & 0x3; + + if (vertex_index == 0) { + // "top left" aka "p1" + screen02 += up_dir * pixel - line_dir * pixel; + v_texcoord = a_pos.xy + up_dir * rscale - line_dir * rscale; + } else if (vertex_index == 1) { + // "top right" aka "p2" + screen02 += up_dir * pixel + line_dir * pixel; + v_texcoord = a_pos.xy + up_dir * rscale + line_dir * rscale; + } else if (vertex_index == 2) { + // "bottom left" aka "p3" + screen02 += -up_dir * pixel - line_dir * pixel; + v_texcoord = a_pos.xy - up_dir * rscale - line_dir * rscale; } else { - v_texcoord = a_pos.xy; + // "bottom right" aka "p4" + screen02 += -up_dir * pixel + line_dir * pixel; + v_texcoord = a_pos.xy - up_dir * rscale + line_dir * rscale; } - + screen02.y = 2.0 - screen02.y; v_line = a_line; @@ -187,8 +182,8 @@ const sdf_fs_src = `#version 300 es float h = clamp(dot(pa, ba) / dot(ba, ba), 0.0, 1.0); float dist = length(pa - ba * h) - v_thickness / 2.0; - float fade = 0.5 * length(fwidth(v_texcoord)); - float alpha = 1.0 - smoothstep(-fade, fade, dist); + float fade = length(fwidth(v_texcoord)); + float alpha = 1.0 - smoothstep(0.0, fade, dist); FragColor = vec4(v_color * alpha, alpha); } else { @@ -308,7 +303,6 @@ function init_webgl(state, context) { 'u_debug_mode': gl.getUniformLocation(context.programs['sdf'].main, 'u_debug_mode'), 'u_tile_size': gl.getUniformLocation(context.programs['sdf'].main, 'u_tile_size'), 'u_stroke_count': gl.getUniformLocation(context.programs['sdf'].main, 'u_stroke_count'), - 'u_shrink': gl.getUniformLocation(context.programs['sdf'].main, 'u_shrink'), } };