Add CRT post-process effect with UI controls and shader integration

Author: smokku

ext/sokol-tools-bin

@@ -12,7 +12,7 @@ const char* app_releases_address = "https://github.com/X65/emu/releases";
 const char full_name[] = FULL_NAME;
 
 struct arguments arguments = {
-    NULL, "-", false, false, false, false, false, NULL,
+    NULL, "-", false, false, false, false, false, false, NULL,
 };
 static char args_doc[] = "[ROM.xex]";
 
@@ -27,6 +27,7 @@ static struct argp_option options[] = {
     { "zero-mem", 'z', 0, 0, "Fill memory with zeros" },
     { "dap", 'd', 0, 0, "Enable Debug Adapter Protocol over stdin/stdout" },
     { "dap-port", 'p', "PORT", 0, "Enable Debug Adapter Protocol over TCP port" },
+    { "crt", 'c', 0, 0, "Enable CRT post-process effect" },
     { 0 }
 };
 
@@ -42,6 +43,7 @@ static error_t parse_opt(int key, char* arg, struct argp_state* argp_state) {
         case 'o': args->output_file = arg; break;
         case 'd': args->dap = true; break;
         case 'p': args->dap_port = arg; break;
+        case 'c': args->crt = true; break;
 
         case 'l': app_load_labels(arg, false); break;
 
@@ -74,4 +76,7 @@ void args_parse(int argc, char* argv[]) {
     if (sargs_exists("file")) {
         arguments.rom = sargs_value("file");
     }
+    if (sargs_exists("crt")) {
+        arguments.crt = true;
+    }
 }

src/args.c

@@ -12,7 +12,7 @@ extern char program_version[];
 extern struct arguments {
     const char* rom;
     const char* output_file;
-    bool silent, verbose, zeromem, joy, dap;
+    bool silent, verbose, zeromem, joy, dap, crt;
     const char* dap_port;
 } arguments;
 

src/args.h

@@ -45,8 +45,11 @@ typedef struct {
     struct {
         sg_buffer vbuf;
         sg_pipeline pip;
+        sg_pipeline pip_crt;
         sg_pass_action pass_action;
         bool portrait;
+        bool crt_enabled;
+        gfx_crt_params_t crt_params;
     } display;
     struct {
         sg_view tex_view;
@@ -178,6 +181,36 @@ chips_dim_t gfx_pixel_aspect(void) {
     return state.offscreen.pixel_aspect;
 }
 
+gfx_crt_params_t gfx_crt_default_params(void) {
+    return (gfx_crt_params_t){
+        .scanline_intensity = 0.25f,
+        .mask_intensity     = 0.30f,
+        .curvature          = 0.10f,
+        .gamma              = 1.10f,
+        .vignette           = 0.25f,
+    };
+}
+
+bool gfx_crt_enabled(void) {
+    assert(state.valid);
+    return state.display.crt_enabled;
+}
+
+void gfx_crt_set_enabled(bool enabled) {
+    assert(state.valid);
+    state.display.crt_enabled = enabled;
+}
+
+gfx_crt_params_t gfx_crt_get_params(void) {
+    assert(state.valid);
+    return state.display.crt_params;
+}
+
+void gfx_crt_set_params(gfx_crt_params_t params) {
+    assert(state.valid);
+    state.display.crt_params = params;
+}
+
 sg_view gfx_create_icon_texview(const uint8_t* packed_pixels, int width, int height, int stride, const char* label) {
     const size_t pixel_data_size = width * height * sizeof(uint32_t);
     uint32_t* pixels = malloc(pixel_data_size);
@@ -380,6 +413,19 @@ void gfx_init(const gfx_desc_t* desc) {
         .primitive_type = SG_PRIMITIVETYPE_TRIANGLE_STRIP
     });
 
+    state.display.pip_crt = sg_make_pipeline(&(sg_pipeline_desc){
+        .shader = sg_make_shader(display_crt_shader_desc(sg_query_backend())),
+        .layout = {
+            .attrs = {
+                [0].format = SG_VERTEXFORMAT_FLOAT2,
+                [1].format = SG_VERTEXFORMAT_FLOAT2
+            }
+        },
+        .primitive_type = SG_PRIMITIVETYPE_TRIANGLE_STRIP
+    });
+    state.display.crt_enabled = false;
+    state.display.crt_params = gfx_crt_default_params();
+
     // create an unpacked speaker icon image and sokol-gl pipeline
     {
         // textures must be 2^n for WebGL
@@ -419,9 +465,10 @@ void gfx_init(const gfx_desc_t* desc) {
 
 /* apply a viewport rectangle to preserve the emulator's aspect ratio,
    and for 'portrait' orientations, keep the emulator display at the
-   top, to make room at the bottom for mobile virtual keyboard
+   top, to make room at the bottom for mobile virtual keyboard.
+   Returns the applied viewport rect (in framebuffer pixels).
 */
-static void apply_viewport(chips_dim_t canvas, chips_rect_t view, chips_dim_t pixel_aspect, gfx_border_t border) {
+static chips_rect_t apply_viewport(chips_dim_t canvas, chips_rect_t view, chips_dim_t pixel_aspect, gfx_border_t border) {
     float cw = (float) (canvas.width - border.left - border.right);
     if (cw < 1.0f) {
         cw = 1.0f;
@@ -447,6 +494,10 @@ static void apply_viewport(chips_dim_t canvas, chips_rect_t view, chips_dim_t pi
         vp_y = border.top + (ch - vp_h) * 0.5f;
     }
     sg_apply_viewportf(vp_x, vp_y, vp_w, vp_h, true);
+    return (chips_rect_t){
+        .x = (int)vp_x, .y = (int)vp_y,
+        .width = (int)vp_w, .height = (int)vp_h,
+    };
 }
 
 void gfx_draw(chips_display_info_t display_info) {
@@ -538,13 +589,35 @@ void gfx_draw(chips_display_info_t display_info) {
         .action = state.display.pass_action,
         .swapchain = sglue_swapchain()
     });
-    apply_viewport(display, display_info.screen, state.offscreen.pixel_aspect, state.border);
-    sg_apply_pipeline(state.display.pip);
-    sg_apply_bindings(&(sg_bindings){
-        .vertex_buffers[0] = state.display.vbuf,
-        .views[VIEW_tex] = state.offscreen.tex_view,
-        .samplers[SMP_smp] = state.offscreen.smp,
-    });
+    const chips_rect_t vp = apply_viewport(display, display_info.screen, state.offscreen.pixel_aspect, state.border);
+    if (state.display.crt_enabled) {
+        sg_apply_pipeline(state.display.pip_crt);
+        sg_apply_bindings(&(sg_bindings){
+            .vertex_buffers[0] = state.display.vbuf,
+            .views[VIEW_crt_tex] = state.offscreen.tex_view,
+            .samplers[SMP_crt_smp] = state.offscreen.smp,
+        });
+        // fade out the shadow mask when the output is too small to resolve
+        // a clean 3-pixel-wide triad (avoids ugly moire at low scales)
+        const float mask_scale = (vp.height >= 2 * display_info.screen.height) ? 1.0f
+            : (float)vp.height / (float)(2 * display_info.screen.height);
+        const display_crt_fs_params_t crt_uniforms = {
+            .output_size        = { (float)vp.width, (float)vp.height },
+            .scanline_intensity = state.display.crt_params.scanline_intensity,
+            .mask_intensity     = state.display.crt_params.mask_intensity * mask_scale,
+            .curvature          = state.display.crt_params.curvature,
+            .gamma              = state.display.crt_params.gamma,
+            .vignette           = state.display.crt_params.vignette,
+        };
+        sg_apply_uniforms(UB_display_crt_fs_params, &SG_RANGE(crt_uniforms));
+    } else {
+        sg_apply_pipeline(state.display.pip);
+        sg_apply_bindings(&(sg_bindings){
+            .vertex_buffers[0] = state.display.vbuf,
+            .views[VIEW_tex] = state.offscreen.tex_view,
+            .samplers[SMP_smp] = state.offscreen.smp,
+        });
+    }
     sg_draw(0, 4, 1);
     sg_apply_viewport(0, 0, display.width, display.height, true);
     sdtx_draw();

src/common/gfx.c

@@ -1,10 +1,6 @@
 #pragma once
 /*
     Common graphics functions for the chips-test example emulators.
-
-    REMINDER: consider using this CRT shader?
-
-    https://github.com/mattiasgustavsson/rebasic/blob/master/source/libs/crtemu.h
 */
 #include <stdint.h>
 #include <stdbool.h>
@@ -38,6 +34,14 @@ typedef struct {
     gfx_draw_extra_t draw_extra_cb;
 } gfx_desc_t;
 
+typedef struct {
+    float scanline_intensity;
+    float mask_intensity;
+    float curvature;
+    float gamma;
+    float vignette;
+} gfx_crt_params_t;
+
 void gfx_init(const gfx_desc_t* desc);
 void gfx_draw(chips_display_info_t display_info);
 void gfx_shutdown(void);
@@ -47,6 +51,12 @@ void gfx_disable_speaker_icon(void);
 chips_dim_t gfx_pixel_aspect(void);
 sg_view gfx_create_icon_texview(const uint8_t* packed_pixels, int width, int height, int stride, const char* label);
 
+bool gfx_crt_enabled(void);
+void gfx_crt_set_enabled(bool enabled);
+gfx_crt_params_t gfx_crt_get_params(void);
+void gfx_crt_set_params(gfx_crt_params_t params);
+gfx_crt_params_t gfx_crt_default_params(void);
+
 #ifdef __cplusplus
 } /* extern "C" */
 #endif

src/common/gfx.h

@@ -58,6 +58,58 @@ void main() {
 }
 @end
 
+// CRT post-process display shader (parallel to display_fs)
+@fs display_crt_fs
+layout(binding=0) uniform texture2D crt_tex;
+layout(binding=0) uniform sampler crt_smp;
+layout(binding=0) uniform display_crt_fs_params {
+    vec2  output_size;
+    float scanline_intensity;
+    float mask_intensity;
+    float curvature;
+    float gamma;
+    float vignette;
+    float _pad0;
+    float _pad1;
+};
+in vec2 uv;
+out vec4 frag_color;
+
+vec2 crt_warp(vec2 p) {
+    vec2 c = p * 2.0 - 1.0;
+    c *= vec2(1.0 + (c.y * c.y) * curvature * 0.10,
+              1.0 + (c.x * c.x) * curvature * 0.12);
+    return c * 0.5 + 0.5;
+}
+
+vec3 crt_mask(vec2 frag_px) {
+    float m = mod(floor(frag_px.x), 3.0);
+    vec3 c = vec3(1.0 - mask_intensity);
+    if (m < 1.0)      c.r = 1.0;
+    else if (m < 2.0) c.g = 1.0;
+    else              c.b = 1.0;
+    return c;
+}
+
+void main() {
+    vec2 wuv = crt_warp(uv);
+    if (wuv.x < 0.0 || wuv.x > 1.0 || wuv.y < 0.0 || wuv.y > 1.0) {
+        frag_color = vec4(0.0, 0.0, 0.0, 1.0);
+        return;
+    }
+    vec3 col = texture(sampler2D(crt_tex, crt_smp), wuv).rgb;
+    float scan_phase = wuv.y * output_size.y;
+    float scan = 1.0 - scanline_intensity * (1.0 - cos(scan_phase * 3.14159265)) * 0.5;
+    col *= scan;
+    col *= crt_mask(wuv * output_size);
+    float d = distance(wuv, vec2(0.5));
+    col *= mix(1.0, max(0.0, 1.0 - vignette), smoothstep(0.4, 0.85, d));
+    col = pow(max(col, vec3(0.0)), vec3(1.0 / max(gamma, 0.01)));
+    frag_color = vec4(col, 1.0);
+}
+@end
+
 @program offscreen offscreen_vs offscreen_fs
 @program offscreen_pal offscreen_vs offscreen_pal_fs
 @program display display_vs display_fs
+@program display_crt display_vs display_crt_fs