Use cube and pyramid primitives

src/main.zig

@@ -8,6 +8,10 @@ const zm = @import("zmath");
 const vec = zm.f32x4;
 const Mat = zm.Mat;
 
+const primitives = @import("./primitives.zig");
+const VertexData = primitives.VertexData;
+const PrimitiveData = primitives.PrimitiveData;
+
 /// Holds information about how a perticular scene should be rendered.
 const SceneUniformBuffer = struct {
     view_proj_matrix: zm.Mat,
@@ -25,30 +29,8 @@ const ObjectData = struct {
     uniform_buffer: *gpu.Buffer,
     /// Bind group used to associate the buffer to the `object` shader parameter.
     uniform_bind_group: *gpu.BindGroup,
-    /// Index into `primitives` to specify which primitive to render.
+    /// Reference to the primitive (shape or model) to render for this object.
-    primitive_index: usize,
+    primitive: *PrimitiveData,
-};
-
-/// Describes the layout of each vertex that a primitive is made of.
-const VertexData = struct {
-    position: [3]f32,
-};
-
-/// Contains the data to render a primitive (3D shape or model).
-const PrimitiveData = struct {
-    /// Vertices describe the "points" that a primitive is made out of.
-    /// This buffer is of type `[]VertexData`.
-    vertex_buffer: *gpu.Buffer,
-    vertex_count: u32,
-
-    /// Indices describe what vertices make up the triangles in a primitive.
-    /// This buffer is of type `[]u32`.
-    index_buffer: *gpu.Buffer,
-    index_count: u32,
-
-    // For example, `vertex_buffer` may have 4 points defining a square, but
-    // since it needs to be rendered using 2 triangles, `index_buffer` will
-    // contain 6 entries, `0, 1, 2` and `3, 2, 1` making up one triangle each.
 };
 
 pub const App = @This();
@@ -65,7 +47,7 @@ depth_texture_view: *gpu.TextureView,
 pipeline: *gpu.RenderPipeline,
 scene_uniform_buffer: *gpu.Buffer,
 scene_uniform_bind_group: *gpu.BindGroup,
-primitives: []PrimitiveData,
+primitive_data: []PrimitiveData,
 object_data: []ObjectData,
 
 pub fn init(app: *App) !void {
@@ -146,48 +128,15 @@ pub fn init(app: *App) !void {
     }
 
     // Set up the primitives we want to render.
-    app.primitives = try app.allocator.alloc(PrimitiveData, 2);
+    // Using `dupe` to allocate a slice here allows easily adjusting the
-    // Triangle
+    // primitives to use, without changing the type of `primitive_data`.
-    app.primitives[0] = createPrimitive(
+    app.primitive_data = try app.allocator.dupe(PrimitiveData, &.{
-        &.{
+        // primitives.createTrianglePrimitive(1.0),
-            // zig fmt: off
+        // primitives.createSquarePrimitive(0.8),
-            .{ .position = .{  0.0,  0.5, 0.0 } },
+        // primitives.createCirclePrimitive(0.5, 24),
-            .{ .position = .{  0.5, -0.5, 0.0 } },
+        primitives.createCubePrimitive(0.65),
-            .{ .position = .{ -0.5, -0.5, 0.0 } },
+        primitives.createPyramidPrimitive(0.75),
-            // zig fmt: on
+    });
-        },
-        // Note that the back faces of triangles are "culled", and thus not visible.
-        // We need to take care to specify the vertices in counter-clock orientation.
-        &.{
-            0, 1, 2,
-        },
-    );
-    // Square
-    app.primitives[1] = createPrimitive(
-        // A square is made up of 4 vertices.
-        //   0--2
-        //   |  |
-        //   |  |
-        //   1--3
-        &.{
-            // zig fmt: off
-            .{ .position = .{ -0.5, -0.5, 0.0 } },
-            .{ .position = .{ -0.5,  0.5, 0.0 } },
-            .{ .position = .{  0.5, -0.5, 0.0 } },
-            .{ .position = .{  0.5,  0.5, 0.0 } },
-            // zig fmt: on
-        },
-        // But it has to be split up into 2 triangles,
-        // specified in a counter-clockwise orientation.
-        //   0--2  4
-        //   | /  /|
-        //   |/  / |
-        //   1  5--3
-        &.{
-            0, 1, 2,
-            3, 2, 1,
-        },
-    );
 
     // Set up object related uniform buffers and bind groups.
     // This uploads data to the GPU about all the object we
@@ -230,12 +179,16 @@ pub fn init(app: *App) !void {
                 },
             );
 
+            // Pick a "random" primitive to use for this object.
+            const primitive_index = app.random.int(usize) % app.primitive_data.len;
+            const primitive = &app.primitive_data[primitive_index];
+
             // The `*object` syntax gets us a pointer to each element in the
             // `object_data` slice, allowing us to override it within the loop.
             object.* = .{
                 .uniform_buffer = result.buffer,
                 .uniform_bind_group = result.bind_group,
-                .primitive_index = app.random.int(usize) % app.primitives.len,
+                .primitive = primitive,
             };
         }
     }
@@ -244,7 +197,7 @@ pub fn init(app: *App) !void {
 /// Creates a buffer on the GPU to store uniform parameter information as
 /// well as a bind group with the specified layout pointing to that buffer.
 /// Additionally, immediately fills the buffer with the provided data.
-fn createAndWriteUniformBuffer(
+pub fn createAndWriteUniformBuffer(
     layout: *gpu.BindGroupLayout,
     data: anytype,
 ) struct {
@@ -267,7 +220,7 @@ fn createAndWriteUniformBuffer(
 
 /// Creates a buffer on the GPU with the specified usage
 /// flags and immediately fills it with the provided data.
-fn createAndWriteBuffer(
+pub fn createAndWriteBuffer(
     comptime T: type,
     data: []const T,
     usage: gpu.Buffer.UsageFlags,
@@ -281,20 +234,6 @@ fn createAndWriteBuffer(
     return buffer;
 }
 
-/// Creates a primitive from the provided vertices and indices,
-/// and uploads the buffers necessary to render it to the GPU.
-fn createPrimitive(
-    vertices: []const VertexData,
-    indices: []const u32,
-) PrimitiveData {
-    return .{
-        .vertex_buffer = createAndWriteBuffer(VertexData, vertices, .{ .vertex = true, .copy_dst = true }),
-        .vertex_count = @intCast(vertices.len),
-        .index_buffer = createAndWriteBuffer(u32, indices, .{ .index = true, .copy_dst = true }),
-        .index_count = @intCast(indices.len),
-    };
-}
-
 pub fn deinit(app: *App) void {
     // Using `defer` here, so we can specify them
     // in the order they were created in `init`.
@@ -305,8 +244,8 @@ pub fn deinit(app: *App) void {
     defer app.pipeline.release();
     defer app.scene_uniform_buffer.release();
     defer app.scene_uniform_bind_group.release();
-    defer app.allocator.free(app.primitives);
+    defer app.allocator.free(app.primitive_data);
-    defer for (app.primitives) |p| {
+    defer for (app.primitive_data) |p| {
         p.vertex_buffer.release();
         p.index_buffer.release();
     };
@@ -389,16 +328,15 @@ pub fn update(app: *App) !bool {
         for (app.object_data) |object| {
             // Set the vertex and index buffer used to render this object
             // to the primitive it wants to use (either triangle or square).
-            const primitive_index = object.primitive_index;
+            const prim = object.primitive;
-            const primitive = app.primitives[primitive_index];
+            pass.setVertexBuffer(0, prim.vertex_buffer, 0, prim.vertex_count * @sizeOf(VertexData));
-            pass.setVertexBuffer(0, primitive.vertex_buffer, 0, primitive.vertex_count * @sizeOf(VertexData));
+            pass.setIndexBuffer(prim.index_buffer, .uint32, 0, prim.index_count * @sizeOf(u32));
-            pass.setIndexBuffer(primitive.index_buffer, .uint32, 0, primitive.index_count * @sizeOf(u32));
 
             // Set the bind group for an object we want to render.
             pass.setBindGroup(1, object.uniform_bind_group, &.{});
 
             // Draw a number of triangles as specified in the index buffer.
-            pass.drawIndexed(primitive.index_count, 1, 0, 0, 0);
+            pass.drawIndexed(prim.index_count, 1, 0, 0, 0);
         }
     }
 

src/primitives.zig

@@ -0,0 +1,209 @@
+const std = @import("std");
+
+const core = @import("mach-core");
+const gpu = core.gpu;
+
+const main = @import("./main.zig");
+const createAndWriteBuffer = main.createAndWriteBuffer;
+
+/// Describes the layout of each vertex that a primitive is made of.
+pub const VertexData = struct {
+    position: [3]f32,
+};
+
+/// Contains the data to render a primitive (3D shape or model).
+pub const PrimitiveData = struct {
+    /// Vertices describe the "points" that a primitive is made out of.
+    /// This buffer is of type `[]VertexData`.
+    vertex_buffer: *gpu.Buffer,
+    vertex_count: u32,
+
+    /// Indices describe what vertices make up the triangles in a primitive.
+    /// This buffer is of type `[]u32`.
+    index_buffer: *gpu.Buffer,
+    index_count: u32,
+
+    // For example, `vertex_buffer` may have 4 points defining a square, but
+    // since it needs to be rendered using 2 triangles, `index_buffer` will
+    // contain 6 entries, `0, 1, 2` and `3, 2, 1` making up one triangle each.
+};
+
+/// Creates a primitive from the provided vertices and indices,
+/// and uploads the buffers necessary to render it to the GPU.
+pub fn createPrimitive(
+    vertices: []const VertexData,
+    indices: []const u32,
+) PrimitiveData {
+    return .{
+        .vertex_buffer = createAndWriteBuffer(VertexData, vertices, .{ .vertex = true, .copy_dst = true }),
+        .vertex_count = @intCast(vertices.len),
+        .index_buffer = createAndWriteBuffer(u32, indices, .{ .index = true, .copy_dst = true }),
+        .index_count = @intCast(indices.len),
+    };
+}
+
+fn vert(x: f32, y: f32, z: f32) VertexData {
+    return .{ .position = .{ x, y, z } };
+}
+
+pub fn createTrianglePrimitive(length: f32) PrimitiveData {
+    const radius = length / @sqrt(3.0);
+    const a0 = 0.0;
+    const a1 = std.math.tau / 3.0;
+    const a2 = std.math.tau / 3.0 * 2.0;
+    return createPrimitive(
+        // A triangle is made up of 3 vertices.
+        //
+        //        0
+        //       / \
+        //      /   \
+        //     1-----2
+        &.{
+            vert(@sin(a0) * radius, @cos(a0) * radius, 0.0),
+            vert(@sin(a1) * radius, @cos(a1) * radius, 0.0),
+            vert(@sin(a2) * radius, @cos(a2) * radius, 0.0),
+        },
+        // Vertices have to be specified in counter-clockwise,
+        // so the "front" of the triangle is facing the right way.
+        &.{
+            0, 1, 2,
+        },
+    );
+}
+
+pub fn createSquarePrimitive(width: f32) PrimitiveData {
+    const half_width = width / 2.0;
+    return createPrimitive(
+        // A square is made up of 4 vertices, ...
+        //
+        //     0---2
+        //     |   |
+        //     |   |
+        //     1---3
+        &.{
+            // zig fmt: off
+            vert(-half_width, -half_width, 0.0),
+            vert(-half_width,  half_width, 0.0),
+            vert( half_width, -half_width, 0.0),
+            vert( half_width,  half_width, 0.0),
+            // zig fmt: on
+        },
+        // ... but it has to be split up into 2 triangles.
+        //
+        //     0--2  4
+        //     | /  /|
+        //     |/  / |
+        //     1  5--3
+        &.{
+            0, 1, 2,
+            3, 2, 1,
+        },
+    );
+}
+
+pub fn createCirclePrimitive(radius: f32, comptime sides: usize) PrimitiveData {
+    if (sides < 3) @compileError("sides must be at least 3");
+
+    var vertices: [sides]VertexData = undefined;
+    for (&vertices, 0..) |*vertex, i| {
+        const angle = std.math.tau / @as(f32, @floatFromInt(sides)) * @as(f32, @floatFromInt(i));
+        vertex.* = vert(@sin(angle) * radius, @cos(angle) * radius, 0.0);
+    }
+
+    var indices: [(sides - 2) * 3]u32 = undefined;
+    for (0..(sides - 2)) |i| {
+        indices[i * 3 + 0] = 0;
+        indices[i * 3 + 1] = @as(u32, @intCast(i)) + 1;
+        indices[i * 3 + 2] = @as(u32, @intCast(i)) + 2;
+    }
+
+    return createPrimitive(&vertices, &indices);
+}
+
+pub fn createCubePrimitive(width: f32) PrimitiveData {
+    const half_width = width / 2.0;
+    return createPrimitive(
+        // zig fmt: off
+        &.{
+            // Right (+X)
+            vert( half_width,  half_width, -half_width),
+            vert( half_width, -half_width, -half_width),
+            vert( half_width,  half_width,  half_width),
+            vert( half_width, -half_width,  half_width),
+            // Left (-X)
+            vert(-half_width,  half_width,  half_width),
+            vert(-half_width, -half_width,  half_width),
+            vert(-half_width,  half_width, -half_width),
+            vert(-half_width, -half_width, -half_width),
+            // Top (+Y)
+            vert( half_width,  half_width, -half_width),
+            vert( half_width,  half_width,  half_width),
+            vert(-half_width,  half_width, -half_width),
+            vert(-half_width,  half_width,  half_width),
+            // Bottom (-Y)
+            vert(-half_width, -half_width, -half_width),
+            vert(-half_width, -half_width,  half_width),
+            vert( half_width, -half_width, -half_width),
+            vert( half_width, -half_width,  half_width),
+            // Front (+Z)
+            vert( half_width,  half_width,  half_width),
+            vert( half_width, -half_width,  half_width),
+            vert(-half_width,  half_width,  half_width),
+            vert(-half_width, -half_width,  half_width),
+            // Back (-Z)
+            vert(-half_width,  half_width, -half_width),
+            vert(-half_width, -half_width, -half_width),
+            vert( half_width,  half_width, -half_width),
+            vert( half_width, -half_width, -half_width),
+        },
+        &.{
+             0,  1,  2,    3,  2,  1, // Right
+             4,  5,  6,    7,  6,  5, // Left
+             8,  9, 10,   11, 10,  9, // Top
+            12, 13, 14,   15, 14, 13, // Bottom
+            16, 17, 18,   19, 18, 17, // Front
+            20, 21, 22,   23, 22, 21, // Back
+        },
+        // zig fmt: on
+    );
+}
+
+pub fn createPyramidPrimitive(width: f32) PrimitiveData {
+    const half_width = width / 2.0;
+    return createPrimitive(
+        // zig fmt: off
+        &.{
+            // Right
+            vert(        0.0,  half_width,         0.0),
+            vert( half_width, -half_width, -half_width),
+            vert( half_width, -half_width,  half_width),
+            // Left
+            vert(        0.0,  half_width,         0.0),
+            vert(-half_width, -half_width,  half_width),
+            vert(-half_width, -half_width, -half_width),
+            // Front
+            vert(        0.0,  half_width,         0.0),
+            vert( half_width, -half_width,  half_width),
+            vert(-half_width, -half_width,  half_width),
+            // Back
+            vert(        0.0,  half_width,         0.0),
+            vert(-half_width, -half_width, -half_width),
+            vert( half_width, -half_width, -half_width),
+            // Bottom
+            vert(-half_width, -half_width, -half_width),
+            vert(-half_width, -half_width,  half_width),
+            vert( half_width, -half_width, -half_width),
+            vert( half_width, -half_width,  half_width),
+        },
+        &.{
+             0,  1,  2, // Right
+             3,  4,  5, // Left
+             6,  7,  8, // Front
+             9, 10, 11, // Back
+            // Bottom
+            12, 13, 14,
+            15, 14, 13,
+        },
+        // zig fmt: on
+    );
+}