remove 'image-rendering: pixelated'

[floooh]

remove 'image-rendering: pixelated'

[floooh]

Thanks for the suggestion, but the situation is "complicated" :D

Basically: I'm already doing the scaling-trick you describe:

chips-test/examples/common/gfx.h

Lines 252 to 286 in 367775c

	/* upscale the original framebuffer 2x with nearest filtering */
	sg_begin_pass(gfx.upscale_pass, &gfx_upscale_pass_action);
	sg_apply_pipeline(gfx.upscale_pip);
	sg_apply_bindings(&gfx.upscale_bind);
	sg_draw(0, 4, 1);
	sg_end_pass();
	/* tint the clear color red or green if flash feedback is requested */
	if (gfx.flash_error_count > 0) {
	gfx.flash_error_count--;
	gfx_draw_pass_action.colors[0].val[0] = 0.7f;
	}
	else if (gfx.flash_success_count > 0) {
	gfx.flash_success_count--;
	gfx_draw_pass_action.colors[0].val[1] = 0.7f;
	}
	else {
	gfx_draw_pass_action.colors[0].val[0] = 0.05f;
	gfx_draw_pass_action.colors[0].val[1] = 0.05f;
	}
	/* draw the final pass with linear filtering */
	int w = (int) sapp_width();
	int h = (int) sapp_height();
	sg_begin_default_pass(&gfx_draw_pass_action, w, h);
	apply_viewport(w, h);
	sg_apply_pipeline(gfx.display_pip);
	sg_apply_bindings(&gfx.display_bind);
	sg_draw(0, 4, 1);
	sg_apply_viewport(0, 0, w, h, true);
	if (gfx.draw_extra_cb) {
	gfx.draw_extra_cb();
	}
	sg_end_pass();
	sg_commit();

The original frame buffer is first upscaled 2x with nearest-filtering into an offscreen rendering target, and then rendered to the WebGL canvas with linear filtering, which provides a bit of smoothing.

If the webpage is running on a HighDPI display, there will be another scaling step because the WebGL canvas isn't created as HighDPI and this "browser internal" scaling step is where the canvas CSS settings come in.

Without having the WebGL canvas pixelated, the text rendering in the debugging UI would look poorly (you can see this effect when running the demos on a Retina Mac in Safari, because Safari doesn't seem to support those pixelated CSS parameters). On Safari, the actual emulator framebuffer looks pretty much the same, but the text rendering in debugging UI looks blurry.

Sooo... it's not as simply as simply deactivation the CSS pixelation unfortunately, but I'll keep the topic in the back of my head :)

[nippur72]

I see there is no more pixelation with the latest commit. Very nice result, I love it!