zig-bloxel-game/src/main.zig

const std = @import("std");
const core = @import("mach-core");
const gpu = core.gpu;

const zm = @import("zmath");
const vec = zm.f32x4;
const Mat = zm.Mat;

const VertexData = struct {
    position: [3]f32,
};

const SceneUniformBuffer = struct {
    view_proj_matrix: zm.Mat,
};

const ModelUniformBuffer = struct {
    matrix: zm.Mat,
    color: [3]f32,
};

pub const App = @This();

app_timer: core.Timer,
title_timer: core.Timer,

pipeline: *gpu.RenderPipeline,
scene_uniform_buffer: *gpu.Buffer,
scene_bind_group: *gpu.BindGroup,
model_uniform_buffers: [3]*gpu.Buffer,
model_bind_groups: [3]*gpu.BindGroup,
vertex_count: u32,
vertex_buffer: *gpu.Buffer,

pub fn init(app: *App) !void {
    try core.init(.{});

    app.app_timer = try core.Timer.start();
    app.title_timer = try core.Timer.start();

    const shader_module = core.device.createShaderModuleWGSL("shader.wgsl", @embedFile("shader.wgsl"));
    defer shader_module.release();

    // Set up rendering pipeline.
    app.pipeline = core.device.createRenderPipeline(&.{
        .vertex = gpu.VertexState.init(.{
            .module = shader_module,
            .entry_point = "vertex_main",
            .buffers = &.{
                gpu.VertexBufferLayout.init(.{
                    .array_stride = @sizeOf(VertexData),
                    .step_mode = .vertex,
                    .attributes = &.{
                        .{ .format = .float32x3, .shader_location = 0, .offset = @offsetOf(VertexData, "position") },
                    },
                }),
            },
        }),
        .fragment = &gpu.FragmentState.init(.{
            .module = shader_module,
            .entry_point = "frag_main",
            .targets = &.{.{ .format = core.descriptor.format }},
        }),
    });

    // Set up uniform buffers and bind groups.

    // The "scene" uniform contains information for each rendered scene.
    app.scene_uniform_buffer = core.device.createBuffer(&.{
        .usage = .{ .copy_dst = true, .uniform = true },
        .size = @sizeOf(SceneUniformBuffer),
        .mapped_at_creation = .false,
    });
    app.scene_bind_group = core.device.createBindGroup(
        &gpu.BindGroup.Descriptor.init(.{
            .layout = app.pipeline.getBindGroupLayout(0),
            .entries = &.{
                gpu.BindGroup.Entry.buffer(0, app.scene_uniform_buffer, 0, @sizeOf(SceneUniformBuffer)),
            },
        }),
    );

    // The "model" uniforms contain information about how to render each model.
    for (0..3) |i| {
        app.model_uniform_buffers[i] = core.device.createBuffer(&.{
            .usage = .{ .copy_dst = true, .uniform = true },
            .size = @sizeOf(ModelUniformBuffer),
            .mapped_at_creation = .false,
        });
        app.model_bind_groups[i] = core.device.createBindGroup(
            &gpu.BindGroup.Descriptor.init(.{
                .layout = app.pipeline.getBindGroupLayout(1),
                .entries = &.{
                    gpu.BindGroup.Entry.buffer(0, app.model_uniform_buffers[i], 0, @sizeOf(ModelUniformBuffer)),
                },
            }),
        );
    }
    // Upload model render information (matrix + color) to the GPU.
    core.queue.writeBuffer(app.model_uniform_buffers[0], 0, &[_]ModelUniformBuffer{.{
        .matrix = zm.transpose(zm.translation(-1.0, 0.25, 0.0)),
        .color = .{ 1.0, 0.0, 0.0 },
    }});
    core.queue.writeBuffer(app.model_uniform_buffers[1], 0, &[_]ModelUniformBuffer{.{
        .matrix = zm.transpose(zm.translation(0.0, -0.25, 0.0)),
        .color = .{ 0.0, 1.0, 0.0 },
    }});
    core.queue.writeBuffer(app.model_uniform_buffers[2], 0, &[_]ModelUniformBuffer{.{
        .matrix = zm.transpose(zm.translation(1.0, 0.0, 0.0)),
        .color = .{ 0.0, 0.0, 1.0 },
    }});

    // Set up vertex buffer, containing the vertex data we want to draw.
    const vertices = [_]VertexData{
        .{ .position = .{ 0.0, 0.5, 0.0 } },
        .{ .position = .{ -0.5, -0.5, 0.0 } },
        .{ .position = .{ 0.5, -0.5, 0.0 } },
    };
    app.vertex_count = vertices.len;
    app.vertex_buffer = core.device.createBuffer(&.{
        .size = app.vertex_count * @sizeOf(VertexData),
        .usage = .{ .vertex = true, .copy_dst = true },
        .mapped_at_creation = .false,
    });
    // Upload vertex buffer to the GPU.
    core.queue.writeBuffer(app.vertex_buffer, 0, &vertices);
}

pub fn deinit(app: *App) void {
    // Using `defer` here, so we can specify them
    // in the order they were created in `init`.
    defer core.deinit();
    defer app.pipeline.release();
    defer app.scene_uniform_buffer.release();
    defer app.scene_bind_group.release();
    defer for (app.model_uniform_buffers) |b| b.release();
    defer for (app.model_bind_groups) |g| g.release();
    defer app.vertex_buffer.release();
}

pub fn update(app: *App) !bool {
    var iter = core.pollEvents();
    while (iter.next()) |event| {
        switch (event) {
            .close => return true,
            else => {},
        }
    }

    // Set up a view matrix from the camera transform.
    // This moves everything to be relative to the camera.
    // TODO: Actually implement camera transform instead of hardcoding a look-at matrix.
    // const view_matrix = zm.inverse(app.camera_transform);
    const time = app.app_timer.read();
    const x = @cos(time * std.math.tau / 10);
    const y = @sin(time * std.math.tau / 10);
    const view_matrix = zm.lookAtLh(vec(x, y, -2, 1), vec(0, 0, 0, 1), vec(0, 1, 0, 1));

    // Set up a projection matrix using the size of the window.
    // The perspective projection will make things further away appear smaller.
    const width: f32 = @floatFromInt(core.descriptor.width);
    const height: f32 = @floatFromInt(core.descriptor.height);
    const field_of_view = std.math.degreesToRadians(f32, 45.0);
    const proj_matrix = zm.perspectiveFovLh(field_of_view, width / height, 0.1, 10);

    const view_proj_matrix = zm.mul(view_matrix, proj_matrix);

    // Get back buffer texture to render to.
    const back_buffer_view = core.swap_chain.getCurrentTextureView().?;
    defer back_buffer_view.release();
    // Once rendering is done (hence `defer`), swap back buffer to the front to display.
    defer core.swap_chain.present();

    const render_pass_info = gpu.RenderPassDescriptor.init(.{
        .color_attachments = &.{.{
            .view = back_buffer_view,
            .clear_value = std.mem.zeroes(gpu.Color),
            .load_op = .clear,
            .store_op = .store,
        }},
    });

    // Create a `WGPUCommandEncoder` which provides an interface for recording GPU commands.
    const encoder = core.device.createCommandEncoder(null);
    defer encoder.release();

    // Write to the scene uniform buffer for this set of commands.
    encoder.writeBuffer(app.scene_uniform_buffer, 0, &[_]SceneUniformBuffer{.{
        // All matrices the GPU has to work with need to be transposed,
        // because WebGPU uses column-major matrices while zmath is row-major.
        .view_proj_matrix = zm.transpose(view_proj_matrix),
    }});

    {
        const pass = encoder.beginRenderPass(&render_pass_info);
        defer pass.release();
        defer pass.end();

        pass.setPipeline(app.pipeline);
        pass.setBindGroup(0, app.scene_bind_group, &.{});
        pass.setVertexBuffer(0, app.vertex_buffer, 0, app.vertex_count * @sizeOf(VertexData));

        for (app.model_bind_groups) |model_bind_group| {
            // Set the model bind group for a specific model we want to render.
            pass.setBindGroup(1, model_bind_group, &.{});
            // Draw the vertices in `vertex_buffer`.
            pass.draw(app.vertex_count, 1, 0, 0);
        }
    }

    // Finish recording commands, creating a `WGPUCommandBuffer`.
    var command = encoder.finish(null);
    defer command.release();

    // Submit the command(s) to the GPU.
    core.queue.submit(&.{command});

    // Update the window title to show FPS and input frequency.
    if (app.title_timer.read() >= 1.0) {
        app.title_timer.reset();
        try core.printTitle("Triangle [ {d}fps ] [ Input {d}hz ]", .{ core.frameRate(), core.inputRate() });
    }

    return false;
}