rook/val Public Public: anyone can read this; nobody can change it.
forked from benjivers/val
workbenchthis machine
Files 42b76dcb841680461f654961fcecac06b27bd342
| 1 | /** |
| 2 | * How big the world is drawn, before it is scaled onto the screen. |
| 3 | * |
| 4 | * A raycaster does not need device pixels. Every column is a ray marched |
| 5 | * through the grid, so the cost of the frame is the width of the canvas, and |
| 6 | * a retina window asks for three thousand of them — 1512 rays and as many |
| 7 | * fills at every frame, sixty times a second, for a picture made of flat |
| 8 | * shaded columns that upscales almost invisibly. |
| 9 | * |
| 10 | * So the world is drawn into an offscreen canvas of a fixed width and |
| 11 | * blitted up, and the HUD, the crosshair and the minimap stay on the visible |
| 12 | * canvas at full resolution, where sharpness actually shows. |
| 13 | * |
| 14 | * The ladder is the knob the frame governor turns: one step coarser is one |
| 15 | * step fewer rays. Nothing here touches what is sent, predicted or |
| 16 | * simulated — it is a choice of how many columns to draw, out of the window |
| 17 | * size and a level, and nothing else. |
| 18 | */ |
| 19 | |
| 20 | /** Internal widths, finest first. A step is about a fifth of the rays. */ |
| 21 | export const WIDTHS = [1280, 1080, 960, 800, 672, 544, 448]; |
| 22 | |
| 23 | /** The finest level a window of this many CSS pixels across starts at. */ |
| 24 | export const startLevel = (cssWidth) => (cssWidth >= 1200 ? 0 : 2); |
| 25 | |
| 26 | const clamp = (n, low, high) => (n < low ? low : n > high ? high : n); |
| 27 | |
| 28 | /** |
| 29 | * The size to draw the world at: never wider than the canvas actually has |
| 30 | * pixels for — upscaling a 448px render onto a 360px phone would be paying |
| 31 | * for columns nobody can see — and never so small it stops being a picture. |
| 32 | * The aspect is the canvas's own, so the blit only ever scales. |
| 33 | */ |
| 34 | export function renderSize(deviceWidth, deviceHeight, level) { |
| 35 | const want = WIDTHS[clamp(level | 0, 0, WIDTHS.length - 1)]; |
| 36 | const width = Math.max(240, Math.min(want, Math.round(deviceWidth) || 240)); |
| 37 | const height = Math.max( |
| 38 | 1, |
| 39 | Math.round(width * (deviceHeight > 0 && deviceWidth > 0 ? deviceHeight / deviceWidth : 0.6)), |
| 40 | ); |
| 41 | return { width, height }; |
| 42 | } |