[GL] Account for non-1 values of devicePixelRaio (fix #147)

jcreedcmu · Jan 19, 2024 · efd66b1 · efd66b1
1 parent 801f460
commit efd66b1
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 18 deletions.
diff --git a/public/assets/world.frag b/public/assets/world.frag
@@ -19,7 +19,7 @@ const float NUM_SPRITES_PER_SHEET = 16.; // in both directions
 const float SPRITE_SIZE = 32.;
 
 const float CROSSHAIR_OPACITY = 0.3;
-const float CROSSHAIR_LENGTH = 1.;
+const float CROSSHAIR_LENGTH = 2.;
 
 out vec4 outputColor;
 

diff --git a/src/ui/gl-common.ts b/src/ui/gl-common.ts
@@ -125,7 +125,7 @@ export function useFrameBuffer(gl: WebGL2RenderingContext, fb: FrameBufferHelper
 
 export function endFrameBuffer(gl: WebGL2RenderingContext): void {
   gl.bindFramebuffer(gl.FRAMEBUFFER, null);
-  gl.viewport(0, 0, canvas_bds_in_canvas.sz.x, canvas_bds_in_canvas.sz.y);
+  gl.viewport(0, 0, devicePixelRatio * canvas_bds_in_canvas.sz.x, devicePixelRatio * canvas_bds_in_canvas.sz.y);
 }
 
 export function mkRectDrawer(gl: WebGL2RenderingContext): RectDrawer {

diff --git a/src/ui/gl-render.ts b/src/ui/gl-render.ts
@@ -104,20 +104,11 @@ function drawOneTile(gl: WebGL2RenderingContext, env: GlEnv, letter: string, sta
   gl.uniform1i(u_fontTexture, FONT_TEXTURE_UNIT);
 
   const u_canvasSize = gl.getUniformLocation(prog, 'u_canvasSize');
-  gl.uniform2f(u_canvasSize, canvas_bds_in_canvas.sz.x, canvas_bds_in_canvas.sz.y);
-
-  const world_from_canvas_SE2 = inverse(canvas_from_chunk_local);
-  const s = world_from_canvas_SE2.scale;
-  const t = world_from_canvas_SE2.translate;
-
-  const world_from_canvas = [
-    s.x, 0.0, 0.0,
-    0.0, s.y, 0.0,
-    t.x, t.y, 1.0,
-  ];
-  const u_world_from_canvas = gl.getUniformLocation(prog, 'u_world_from_canvas');
-  gl.uniformMatrix3fv(u_world_from_canvas, false, world_from_canvas);
-  gl.viewport(0, 0, canvas_bds_in_canvas.sz.x, canvas_bds_in_canvas.sz.y);
+  gl.uniform2f(u_canvasSize, devicePixelRatio * canvas_bds_in_canvas.sz.x, devicePixelRatio * canvas_bds_in_canvas.sz.y);
+
+  const u_world_from_canvas = gl.getUniformLocation(prog, "u_world_from_canvas");
+  gl.uniformMatrix3fv(u_world_from_canvas, false, asMatrix(inverse(compose(scale(vdiag(devicePixelRatio)), canvas_from_chunk_local))));
+
   gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
 }
 
@@ -199,12 +190,12 @@ function drawWorld(gl: WebGL2RenderingContext, env: GlEnv, state: GameState, can
   const u_chunkDataTexture = gl.getUniformLocation(prog, 'u_prepassTexture');
   gl.uniform1i(u_chunkDataTexture, PREPASS_FB_TEXTURE_UNIT);
   const u_canvasSize = gl.getUniformLocation(prog, 'u_canvasSize');
-  gl.uniform2f(u_canvasSize, canvas_bds_in_canvas.sz.x, canvas_bds_in_canvas.sz.y);
+  gl.uniform2f(u_canvasSize, devicePixelRatio * canvas_bds_in_canvas.sz.x, devicePixelRatio * canvas_bds_in_canvas.sz.y);
   const u_min_p_in_chunk = gl.getUniformLocation(prog, 'u_min_p_in_chunk');
   gl.uniform2f(u_min_p_in_chunk, aci.min_p_in_chunk.x, aci.min_p_in_chunk.y);
 
   const u_world_from_canvas = gl.getUniformLocation(prog, "u_world_from_canvas");
-  gl.uniformMatrix3fv(u_world_from_canvas, false, asMatrix(inverse(canvas_from_world)));
+  gl.uniformMatrix3fv(u_world_from_canvas, false, asMatrix(inverse(compose(scale(vdiag(devicePixelRatio)), canvas_from_world))));
 
   gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
 }