On a screen scaled to 125 % or 150 % the editor looked soft beside
a page the browser draws itself. The layout counts in whole CSS
pixels, and most of those fall between two device pixels there. The
GPU averages both: text loses its edges, and a 1 px line becomes a
pixel and a half of mixed colour. Now text and boxes are rounded to
device pixels, and a line is one device pixel wide.
- ui/pixelGrid.ts holds the rule. crispText() makes a text with
Pixi's roundPixels, crisp() does the same for a Graphics of
upright boxes, and hairline() is the width of one device pixel.
- Every text of the interface is made with crispText() instead of
new Text().
- crisp() only rounds where the scale is not a whole number. At
100 % and 200 % nothing changes.
- drawControlBox, drawHeaderBar and drawSectionBand draw their
lines a hairline wide and flush with the edge. The widgets that
draw lines of their own do the same.
- Two bands share exactly the line they draw, and a column still
ends on a whole pixel.
- The stage is nudged by 1/32 px where the scale is not whole. At
150 % every odd pixel is an exact half, and without the nudge one
band came out a row shorter than its neighbours.
- Curves, icons and everything of the game stay unrounded. Rounding
their points would bend them.
- The harness takes deviceScaleFactor as an option, and the hooks
deviceColumn, edgeContrast and pixelGrid read the frame as the
screen gets it.
Not in here: the subpixel smoothing a browser gives its own text.
Pixi draws a text into a transparent picture first, and there only
greyscale smoothing is possible.
Measured at 150 %, edge contrast before and after: top bar 31.5 to
47.8, the lists on the left 68.6 to 86.4, inspector 27.6 to 38.4.
At 100 % it is 46.5, 90.1 and 37.9, and the picture there is the
same as before pixel for pixel, apart from the fps display.
Tests:
- Gate on melektaus-atx: 206 files, 3114 tests (3104 + 10), exit 0
- Full run on melektaus-atx: 1655 of 1656 checks passed, smokes
24/19/21. The one that failed was a condition of the new step
62 itself: it scrolled an inspector that had nothing to scroll.
The step now makes the window lower for that reading.
- e2e 61,62 after that fix: 14 checks. The full run was not
repeated, and CI is switched off for now.
- Ten unit tests, nine in tests/ui/pixel-grid.test.ts
- Eight e2e checks in the new step 62, which runs at 150 %
- Eleven unit counter-probes fail tests
- Four browser counter-probes fail their checks. They ran before
the fix to step 62 and were not repeated for it.
- Screenshots looked at for 125 % and 150 %
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Split GraphCanvas (1076 -> 831 lines) into EdgeLayer and graphMenus;
the port and marker menus were the same list and are now one function.
Value specs of the inspector and the list tab share valueSpecs.ts, and
the remaining copies (compound commands, type glyphs, typed asset
lookup, name rule, play/editor world setup, marquee) are merged.
Four copies had already drifted apart; merging them fixes:
- "Disconnect N links" in the port menu is one undo step, not N
- "+ Add collider" is hidden on a placed container instance, as in
the hierarchy menu, instead of always failing
- a bool property coerced from the text "false" becomes false
- a port command on an unknown node type reports instead of crashing
Comment-only edits leave the bundle byte-identical. README corrected in
35 places (step limit, jump-run clock, suite duration, 409 body, ...).
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Remove comments that only restate the code, keeping the section banners
and the notes that carry a reason, a measured fact or an external
contract.
ButtonOptions.width claimed to be a fixed width but only set minWidth,
so the Graph and Texture pickers grew with the name they showed. It is
now what it promises, with a separate minWidth for the buttons that have
two forms. Narrow buttons shrink their padding, otherwise a 24px icon
button had 8px left for its glyph and truncate dropped it entirely.
__gm.labelsDropped() guards that class: the overflow guard only saw text
that was too wide, never a label truncated to nothing.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
adminandClaude Opus 5.5