examples: update glyphs example to use new object system

Signed-off-by: Stephen Gutekanst <stephen@hexops.com>

build.zig

@@ -75,7 +75,7 @@ pub fn build(b: *std.Build) !void {
         .{ .name = "core-triangle", .deps = &.{} },
         .{ .name = "core-transparent-window", .deps = &.{} },
         .{ .name = "custom-renderer", .deps = &.{} },
-        // .{ .name = "glyphs", .deps = &.{ .assets, .freetype } },
+        .{ .name = "glyphs", .deps = &.{ .assets, .freetype } },
         // .{ .name = "hardware-check", .deps = &.{ .assets, .zigimg } },
         .{ .name = "piano", .deps = &.{} },
         .{ .name = "play-opus", .deps = &.{.assets} },

examples/glyphs/App.zig

@@ -1,8 +1,12 @@
 const std = @import("std");
 const mach = @import("mach");
+const freetype = @import("freetype");
+const assets = @import("assets");
+
 const gpu = mach.gpu;
 const gfx = mach.gfx;
 const math = mach.math;
+
 const vec2 = math.vec2;
 const vec3 = math.vec3;
 const Vec2 = math.Vec2;
@@ -10,50 +14,41 @@ const Vec3 = math.Vec3;
 const Mat3x3 = math.Mat3x3;
 const Mat4x4 = math.Mat4x4;
 
-const Glyphs = @import("Glyphs.zig");
-
 const App = @This();
 
 pub const mach_module = .app;
 
-pub const mach_systems = .{ .start, .init, .deinit, .tick, .end_frame };
+pub const mach_systems = .{ .main, .init, .deinit, .tick };
 
+const RegionMap = std.AutoArrayHashMapUnmanaged(u21, mach.gfx.Atlas.Region);
+
+allocator: std.mem.Allocator,
+window: mach.ObjectID,
 timer: mach.time.Timer,
-player: mach.EntityID,
-direction: Vec2 = vec2(0, 0),
-spawning: bool = false,
 spawn_timer: mach.time.Timer,
 fps_timer: mach.time.Timer,
-frame_count: usize,
-sprites: usize,
 rand: std.Random.DefaultPrng,
-time: f32,
-pipeline: mach.EntityID,
-frame_encoder: *gpu.CommandEncoder = undefined,
-frame_render_pass: *gpu.RenderPassEncoder = undefined,
 
-fn deinit(sprite_pipeline: *gfx.SpritePipeline.Mod, glyphs: *Glyphs.Mod) !void {
+frame_count: usize = 0,
-    sprite_pipeline.schedule(.deinit);
+sprites: usize = 0,
-    glyphs.schedule(.deinit);
+time: f32 = 0,
-}
+direction: Vec2 = vec2(0, 0),
+spawning: bool = true,
+player_id: mach.ObjectID = undefined,
+pipeline_id: mach.ObjectID = undefined,
+texture_atlas: mach.gfx.Atlas = undefined,
+texture: *gpu.Texture = undefined,
+ft: freetype.Library = undefined,
+face: freetype.Face = undefined,
+regions: RegionMap = .{},
 
-fn start(core: *mach.Core, sprite_pipeline: *gfx.SpritePipeline.Mod, glyphs: *Glyphs.Mod, app: *App) !void {
+pub const main = mach.schedule(.{
-    core.schedule(.init);
+    .{ mach.Core, .init },
-    sprite_pipeline.schedule(.init);
+    .{ App, .init },
-    glyphs.schedule(.init);
+    .{ mach.Core, .main },
+});
 
-    // Prepare which glyphs we will render
+pub fn init(
-    glyphs.schedule(.prepare);
-
-    // Run our init code after glyphs module is initialized.
-    app.schedule(.init);
-}
-
-fn init(
-    entities: *mach.Entities.Mod,
-    sprite: *gfx.Sprite.Mod,
-    sprite_pipeline: *gfx.SpritePipeline.Mod,
-    glyphs: *Glyphs.Mod,
     app: *App,
     core: *mach.Core,
     app_mod: mach.Mod(App),
@@ -61,46 +56,141 @@ fn init(
     core.on_tick = app_mod.id.tick;
     core.on_exit = app_mod.id.deinit;
 
-    // Create a sprite rendering pipeline
+    const window = try core.windows.new(.{
-    const texture = glyphs.state().texture;
+        .title = "glyphs",
-    const pipeline = try entities.new();
+    });
-    texture.reference();
-    try sprite_pipeline.set(pipeline, .texture, texture);
-    sprite_pipeline.schedule(.update);
 
-    // We can create entities, and set components on them. Note that components live in a module
+    // TODO(allocator): find a better way to get an allocator here
-    // namespace, e.g. the `Sprite` module could have a 3D `.location` component with a different
+    const allocator = std.heap.c_allocator;
-    // type than the `.physics2d` module's `.location` component if you desire.
 
-    const r = glyphs.state().regions.get('?').?;
+    app.* = .{
-    const player = try entities.new();
+        .allocator = allocator,
-    try sprite.set(player, .transform, Mat4x4.translate(vec3(-0.02, 0, 0)));
+        .window = window,
-    try sprite.set(player, .pipeline, pipeline);
-    try sprite.set(player, .size, vec2(@floatFromInt(r.width), @floatFromInt(r.height)));
-    try sprite.set(player, .uv_transform, Mat3x3.translate(vec2(@floatFromInt(r.x), @floatFromInt(r.y))));
-    sprite.schedule(.update);
-
-    app.init(.{
         .timer = try mach.time.Timer.start(),
         .spawn_timer = try mach.time.Timer.start(),
-        .player = player,
         .fps_timer = try mach.time.Timer.start(),
-        .frame_count = 0,
-        .sprites = 0,
         .rand = std.Random.DefaultPrng.init(1337),
-        .time = 0,
+    };
-        .pipeline = pipeline,
-    });
 }
 
-fn tick(
+pub fn deinit(app: *App) void {
-    entities: *mach.Entities.Mod,
+    app.texture_atlas.deinit(app.allocator);
+    app.texture.release();
+    app.face.deinit();
+    app.ft.deinit();
+    app.regions.deinit(app.allocator);
+}
+
+fn setupPipeline(
     core: *mach.Core,
-    sprite: *gfx.Sprite.Mod,
-    sprite_pipeline: *gfx.SpritePipeline.Mod,
-    glyphs: *Glyphs.Mod,
     app: *App,
+    sprite: *gfx.Sprite,
+    window_id: mach.ObjectID,
 ) !void {
+    const window = core.windows.getValue(app.window);
+
+    // rgba32_pixels
+    const img_size = gpu.Extent3D{ .width = 1024, .height = 1024 };
+
+    // Create a GPU texture
+    const label = @tagName(mach_module) ++ ".createPipeline";
+    app.texture = window.device.createTexture(&.{
+        .label = label,
+        .size = img_size,
+        .format = .rgba8_unorm,
+        .usage = .{
+            .texture_binding = true,
+            .copy_dst = true,
+            .render_attachment = true,
+        },
+    });
+
+    app.texture_atlas = try mach.gfx.Atlas.init(
+        app.allocator,
+        img_size.width,
+        .rgba,
+    );
+
+    app.ft = try freetype.Library.init();
+    app.face = try app.ft.createFaceMemory(assets.roboto_medium_ttf, 0);
+    try prepareGlyphs(window.queue, app);
+
+    // Create a sprite rendering pipeline
+    app.pipeline_id = try sprite.pipelines.new(.{
+        .window = window_id,
+        .render_pass = undefined,
+        .texture = app.texture,
+    });
+
+    // Create our player sprite
+    const r = app.regions.get('?').?;
+    app.player_id = try sprite.sprites.new(.{
+        .transform = Mat4x4.translate(vec3(-0.02, 0, 0)),
+        .size = vec2(@floatFromInt(r.width), @floatFromInt(r.height)),
+        .uv_transform = Mat3x3.translate(vec2(@floatFromInt(r.x), @floatFromInt(r.y))),
+    });
+    // Attach the sprite to our sprite rendering pipeline.
+    try sprite.pipelines.setParent(app.player_id, app.pipeline_id);
+}
+
+fn prepareGlyphs(queue: *gpu.Queue, app: *App) !void {
+    // Prepare which glyphs we will render
+    const codepoints: []const u21 = &[_]u21{ '?', '!', 'a', 'b', '#', '@', '%', '$', '&', '^', '*', '+', '=', '<', '>', '/', ':', ';', 'Q', '~' };
+    for (codepoints) |codepoint| {
+        const font_size = 48 * 1;
+        try app.face.setCharSize(font_size * 64, 0, 50, 0);
+        try app.face.loadChar(codepoint, .{ .render = true });
+        const glyph = app.face.glyph();
+        const metrics = glyph.metrics();
+
+        const glyph_bitmap = glyph.bitmap();
+        const glyph_width = glyph_bitmap.width();
+        const glyph_height = glyph_bitmap.rows();
+
+        // Add 1 pixel padding to texture to avoid bleeding over other textures
+        const margin = 1;
+        const glyph_data = try app.allocator.alloc([4]u8, (glyph_width + (margin * 2)) * (glyph_height + (margin * 2)));
+        defer app.allocator.free(glyph_data);
+        const glyph_buffer = glyph_bitmap.buffer().?;
+        for (glyph_data, 0..) |*data, i| {
+            const x = i % (glyph_width + (margin * 2));
+            const y = i / (glyph_width + (margin * 2));
+            if (x < margin or x > (glyph_width + margin) or y < margin or y > (glyph_height + margin)) {
+                data.* = [4]u8{ 0, 0, 0, 0 };
+            } else {
+                const alpha = glyph_buffer[((y - margin) * glyph_width + (x - margin)) % glyph_buffer.len];
+                data.* = [4]u8{ 0, 0, 0, alpha };
+            }
+        }
+        var glyph_atlas_region = try app.texture_atlas.reserve(app.allocator, glyph_width + (margin * 2), glyph_height + (margin * 2));
+        app.texture_atlas.set(glyph_atlas_region, @as([*]const u8, @ptrCast(glyph_data.ptr))[0 .. glyph_data.len * 4]);
+
+        glyph_atlas_region.x += margin;
+        glyph_atlas_region.y += margin;
+        glyph_atlas_region.width -= margin * 2;
+        glyph_atlas_region.height -= margin * 2;
+
+        try app.regions.put(app.allocator, codepoint, glyph_atlas_region);
+        _ = metrics;
+    }
+
+    // rgba32_pixels
+    const img_size = gpu.Extent3D{ .width = 1024, .height = 1024 };
+    const data_layout = gpu.Texture.DataLayout{
+        .bytes_per_row = @as(u32, @intCast(img_size.width * 4)),
+        .rows_per_image = @as(u32, @intCast(img_size.height)),
+    };
+    queue.writeTexture(&.{ .texture = app.texture }, &data_layout, &img_size, app.texture_atlas.data);
+}
+
+pub fn tick(
+    core: *mach.Core,
+    app: *App,
+    sprite: *gfx.Sprite,
+    sprite_mod: mach.Mod(gfx.Sprite),
+) !void {
+    const label = @tagName(mach_module) ++ ".tick";
+
     var direction = app.direction;
     var spawning = app.spawning;
     while (core.nextEvent()) |event| {
@@ -125,6 +215,7 @@ fn tick(
                     else => {},
                 }
             },
+            .window_open => |ev| try setupPipeline(core, app, sprite, ev.window_id),
             .close => core.exit(),
             else => {},
         }
@@ -132,9 +223,10 @@ fn tick(
     app.direction = direction;
     app.spawning = spawning;
 
-    var player_transform = sprite.get(app.player, .transform).?;
+    var player = sprite.sprites.getValue(app.player_id);
-    var player_pos = player_transform.translation();
+    defer sprite.sprites.setValue(app.player_id, player);
-    if (!spawning and app.spawn_timer.read() > 1.0 / 60.0) {
+    var player_pos = player.transform.translation();
+    if (spawning and app.spawn_timer.read() > 1.0 / 60.0) {
         // Spawn new entities
         _ = app.spawn_timer.lap();
         for (0..50) |_| {
@@ -142,14 +234,15 @@ fn tick(
             new_pos.v[0] += app.rand.random().floatNorm(f32) * 25;
             new_pos.v[1] += app.rand.random().floatNorm(f32) * 25;
 
-            const rand_index = app.rand.random().intRangeAtMost(usize, 0, glyphs.state().regions.count() - 1);
+            const rand_index = app.rand.random().intRangeAtMost(usize, 0, app.regions.count() - 1);
-            const r = glyphs.state().regions.entries.get(rand_index).value;
+            const r = app.regions.entries.get(rand_index).value;
 
-            const new_entity = try entities.new();
+            const new_sprite_id = try sprite.sprites.new(.{
-            try sprite.set(new_entity, .transform, Mat4x4.translate(new_pos).mul(&Mat4x4.scaleScalar(0.3)));
+                .transform = Mat4x4.translate(new_pos).mul(&Mat4x4.scaleScalar(0.3)),
-            try sprite.set(new_entity, .size, vec2(@floatFromInt(r.width), @floatFromInt(r.height)));
+                .size = vec2(@floatFromInt(r.width), @floatFromInt(r.height)),
-            try sprite.set(new_entity, .uv_transform, Mat3x3.translate(vec2(@floatFromInt(r.x), @floatFromInt(r.y))));
+                .uv_transform = Mat3x3.translate(vec2(@floatFromInt(r.x), @floatFromInt(r.y))),
-            try sprite.set(new_entity, .pipeline, app.pipeline);
+            });
+            try sprite.pipelines.setParent(new_sprite_id, app.pipeline_id);
             app.sprites += 1;
         }
     }
@@ -157,29 +250,31 @@ fn tick(
     // Multiply by delta_time to ensure that movement is the same speed regardless of the frame rate.
     const delta_time = app.timer.lap();
 
-    // Animate entities
+    const window = core.windows.getValue(app.window);
-    var q = try entities.query(.{
-        .ids = mach.Entities.Mod.read(.id),
-        .transforms = gfx.Sprite.Mod.write(.transform),
-    });
-    while (q.next()) |v| {
-        for (v.ids, v.transforms) |id, *entity_transform| {
-            var location = entity_transform.translation();
-            // TODO: formatting
-            // TODO(Core)
-            if (location.x() < -@as(f32, @floatFromInt(core.size().width)) / 1.5 or location.x() > @as(f32, @floatFromInt(core.size().width)) / 1.5 or location.y() < -@as(f32, @floatFromInt(core.size().height)) / 1.5 or location.y() > @as(f32, @floatFromInt(core.size().height)) / 1.5) {
-                try entities.remove(id);
-                app.sprites -= 1;
-                continue;
-            }
 
-            var transform = Mat4x4.ident;
+    // Rotate all sprites in the pipeline.
-            transform = transform.mul(&Mat4x4.scale(Vec3.splat(1.0 + (0.2 * delta_time))));
+    var pipeline_children = try sprite.pipelines.getChildren(app.pipeline_id);
-            transform = transform.mul(&Mat4x4.translate(location));
+    defer pipeline_children.deinit();
-            transform = transform.mul(&Mat4x4.rotateZ(2 * math.pi * app.time));
+    for (pipeline_children.items) |sprite_id| {
-            transform = transform.mul(&Mat4x4.scale(Vec3.splat(@max(math.cos(app.time / 2.0), 0.2))));
+        if (!sprite.sprites.is(sprite_id)) continue;
-            entity_transform.* = transform;
+        if (sprite_id == app.player_id) continue; // don't rotate the player
+        var s = sprite.sprites.getValue(sprite_id);
+        const location = s.transform.translation();
+
+        if (location.x() < -@as(f32, @floatFromInt(window.width)) / 1.5 or location.x() > @as(f32, @floatFromInt(window.width)) / 1.5 or location.y() < -@as(f32, @floatFromInt(window.height)) / 1.5 or location.y() > @as(f32, @floatFromInt(window.height)) / 1.5) {
+            try sprite.sprites.setParent(sprite_id, null);
+            sprite.sprites.delete(sprite_id);
+            app.sprites -= 1;
+            continue;
         }
+
+        var transform = Mat4x4.ident;
+        transform = transform.mul(&Mat4x4.scale(Vec3.splat(1.0 + (0.2 * delta_time))));
+        transform = transform.mul(&Mat4x4.translate(location));
+        transform = transform.mul(&Mat4x4.rotateZ(2 * math.pi * app.time));
+        transform = transform.mul(&Mat4x4.scale(Vec3.splat(@max(math.cos(app.time / 2.0), 0.2))));
+        s.transform = transform;
+        sprite.sprites.setValue(sprite_id, s);
     }
 
     // Calculate the player position, by moving in the direction the player wants to go
@@ -187,24 +282,17 @@ fn tick(
     const speed = 200.0;
     player_pos.v[0] += direction.x() * speed * delta_time;
     player_pos.v[1] += direction.y() * speed * delta_time;
-    player_transform = Mat4x4.translate(player_pos).mul(
+    player.transform = Mat4x4.translate(player_pos);
-        &Mat4x4.scale(Vec3.splat(1.0)),
-    );
-    try sprite.set(app.player, .transform, player_transform);
-    sprite.schedule(.update);
-
-    // Perform pre-render work
-    sprite_pipeline.schedule(.pre_render);
-
-    // Create a command encoder for this frame
-    const label = @tagName(mach_module) ++ ".tick";
-    app.frame_encoder = core.device.createCommandEncoder(&.{ .label = label });
 
     // Grab the back buffer of the swapchain
     // TODO(Core)
-    const back_buffer_view = core.swap_chain.getCurrentTextureView().?;
+    const back_buffer_view = window.swap_chain.getCurrentTextureView().?;
     defer back_buffer_view.release();
 
+    // Create a command encoder
+    const encoder = window.device.createCommandEncoder(&.{ .label = label });
+    defer encoder.release();
+
     // Begin render pass
     const sky_blue = gpu.Color{ .r = 0.776, .g = 0.988, .b = 1, .a = 1 };
     const color_attachments = [_]gpu.RenderPassColorAttachment{.{
@@ -213,41 +301,34 @@ fn tick(
         .load_op = .clear,
         .store_op = .store,
     }};
-    app.frame_render_pass = app.frame_encoder.beginRenderPass(&gpu.RenderPassDescriptor.init(.{
+    const render_pass = encoder.beginRenderPass(&gpu.RenderPassDescriptor.init(.{
         .label = label,
         .color_attachments = &color_attachments,
     }));
 
-    // Render our sprite batch
+    // Render sprites
-    sprite_pipeline.state().render_pass = app.frame_render_pass;
+    sprite.pipelines.set(app.pipeline_id, .render_pass, render_pass);
-    sprite_pipeline.schedule(.render);
+    sprite_mod.call(.tick);
 
-    // Finish the frame once rendering is done.
+    // Finish render pass
-    app.schedule(.end_frame);
+    render_pass.end();
+    var command = encoder.finish(&.{ .label = label });
+    window.queue.submit(&[_]*gpu.CommandBuffer{command});
+    command.release();
+    render_pass.release();
 
+    // TODO(object): window-title
+    // // Every second, update the window title with the FPS
+    // if (app.fps_timer.read() >= 1.0) {
+    //     try core.printTitle(
+    //         core.main_window,
+    //         "glyphs [ FPS: {d} ] [ Sprites: {d} ]",
+    //         .{ app.frame_count, app.sprites },
+    //     );
+    //     core.schedule(.update);
+    //     app.fps_timer.reset();
+    //     app.frame_count = 0;
+    // }
+    app.frame_count += 1;
     app.time += delta_time;
 }
-
-fn endFrame(app: *App, core: *mach.Core) !void {
-    // Finish render pass
-    app.frame_render_pass.end();
-    const label = @tagName(mach_module) ++ ".endFrame";
-    var command = app.frame_encoder.finish(&.{ .label = label });
-    core.queue.submit(&[_]*gpu.CommandBuffer{command});
-    command.release();
-    app.frame_encoder.release();
-    app.frame_render_pass.release();
-
-    // Every second, update the window title with the FPS
-    if (app.fps_timer.read() >= 1.0) {
-        try core.printTitle(
-            core.main_window,
-            "glyphs [ FPS: {d} ] [ Sprites: {d} ]",
-            .{ app.frame_count, app.sprites },
-        );
-        core.schedule(.update);
-        app.fps_timer.reset();
-        app.frame_count = 0;
-    }
-    app.frame_count += 1;
-}

examples/glyphs/Glyphs.zig

@@ -1,123 +0,0 @@
-const mach = @import("mach");
-const gpu = mach.gpu;
-const freetype = @import("freetype");
-const std = @import("std");
-const assets = @import("assets");
-
-pub const mach_module = .glyphs;
-
-pub const mach_systems = .{ .init, .deinit, .prepare };
-
-const RegionMap = std.AutoArrayHashMapUnmanaged(u21, mach.gfx.Atlas.Region);
-
-// TODO: banish global allocator
-var gpa = std.heap.GeneralPurposeAllocator(.{}){};
-
-texture_atlas: mach.gfx.Atlas,
-texture: *gpu.Texture,
-ft: freetype.Library,
-face: freetype.Face,
-regions: RegionMap = .{},
-allocator: std.mem.Allocator,
-
-fn deinit(glyphs: *Mod) !void {
-    const state = glyphs.state();
-    state.texture_atlas.deinit(glyphs.state().allocator);
-    state.texture.release();
-    state.face.deinit();
-    state.ft.deinit();
-    state.regions.deinit(state.allocator);
-}
-
-fn init(
-    core: *mach.Core,
-    glyphs: *Mod,
-) !void {
-    const device = core.device;
-    const allocator = gpa.allocator();
-
-    // rgba32_pixels
-    const img_size = gpu.Extent3D{ .width = 1024, .height = 1024 };
-
-    // Create a GPU texture
-    const label = @tagName(mach_module) ++ ".init";
-    const texture = device.createTexture(&.{
-        .label = label,
-        .size = img_size,
-        .format = .rgba8_unorm,
-        .usage = .{
-            .texture_binding = true,
-            .copy_dst = true,
-            .render_attachment = true,
-        },
-    });
-
-    const texture_atlas = try mach.gfx.Atlas.init(
-        allocator,
-        img_size.width,
-        .rgba,
-    );
-
-    const ft_lib = try freetype.Library.init();
-    const face = try ft_lib.createFaceMemory(assets.roboto_medium_ttf, 0);
-
-    glyphs.init(.{
-        .texture_atlas = texture_atlas,
-        .texture = texture,
-        .ft = ft_lib,
-        .face = face,
-        .allocator = allocator,
-    });
-}
-
-fn prepare(core: *mach.Core, glyphs: *Mod) !void {
-    var s = glyphs.state();
-
-    // Prepare which glyphs we will render
-    const codepoints: []const u21 = &[_]u21{ '?', '!', 'a', 'b', '#', '@', '%', '$', '&', '^', '*', '+', '=', '<', '>', '/', ':', ';', 'Q', '~' };
-    for (codepoints) |codepoint| {
-        const font_size = 48 * 1;
-        try s.face.setCharSize(font_size * 64, 0, 50, 0);
-        try s.face.loadChar(codepoint, .{ .render = true });
-        const glyph = s.face.glyph();
-        const metrics = glyph.metrics();
-
-        const glyph_bitmap = glyph.bitmap();
-        const glyph_width = glyph_bitmap.width();
-        const glyph_height = glyph_bitmap.rows();
-
-        // Add 1 pixel padding to texture to avoid bleeding over other textures
-        const margin = 1;
-        const glyph_data = try s.allocator.alloc([4]u8, (glyph_width + (margin * 2)) * (glyph_height + (margin * 2)));
-        defer s.allocator.free(glyph_data);
-        const glyph_buffer = glyph_bitmap.buffer().?;
-        for (glyph_data, 0..) |*data, i| {
-            const x = i % (glyph_width + (margin * 2));
-            const y = i / (glyph_width + (margin * 2));
-            if (x < margin or x > (glyph_width + margin) or y < margin or y > (glyph_height + margin)) {
-                data.* = [4]u8{ 0, 0, 0, 0 };
-            } else {
-                const alpha = glyph_buffer[((y - margin) * glyph_width + (x - margin)) % glyph_buffer.len];
-                data.* = [4]u8{ 0, 0, 0, alpha };
-            }
-        }
-        var glyph_atlas_region = try s.texture_atlas.reserve(s.allocator, glyph_width + (margin * 2), glyph_height + (margin * 2));
-        s.texture_atlas.set(glyph_atlas_region, @as([*]const u8, @ptrCast(glyph_data.ptr))[0 .. glyph_data.len * 4]);
-
-        glyph_atlas_region.x += margin;
-        glyph_atlas_region.y += margin;
-        glyph_atlas_region.width -= margin * 2;
-        glyph_atlas_region.height -= margin * 2;
-
-        try s.regions.put(s.allocator, codepoint, glyph_atlas_region);
-        _ = metrics;
-    }
-
-    // rgba32_pixels
-    const img_size = gpu.Extent3D{ .width = 1024, .height = 1024 };
-    const data_layout = gpu.Texture.DataLayout{
-        .bytes_per_row = @as(u32, @intCast(img_size.width * 4)),
-        .rows_per_image = @as(u32, @intCast(img_size.height)),
-    };
-    core.queue.writeTexture(&.{ .texture = s.texture }, &data_layout, &img_size, s.texture_atlas.data);
-}

examples/glyphs/main.zig

@@ -4,9 +4,8 @@ const mach = @import("mach");
 // The set of Mach modules our application may use.
 const Modules = mach.Modules(.{
     mach.Core,
-    mach.gfx.sprite_modules,
+    mach.gfx.Sprite,
     @import("App.zig"),
-    @import("Glyphs.zig"),
 });
 
 // TODO: move this to a mach "entrypoint" zig module which handles nuances like WASM requires.