diff options
author | alaric <alaric@netmythos.org> | 2024-04-05 03:51:30 -0700 |
---|---|---|
committer | alaric <alaric@netmythos.org> | 2024-04-05 03:52:40 -0700 |
commit | 92b20e1bf706b62466f9952465011d6a91364805 (patch) | |
tree | 16fae5dc31483033384213263bddf33615582a7a | |
parent | 1df80599c7157db86925e7d4ade99544285dfd30 (diff) | |
download | menger-92b20e1bf706b62466f9952465011d6a91364805.tar.gz menger-92b20e1bf706b62466f9952465011d6a91364805.zip |
Wiggly cube with PERSPECTIVE
-rw-r--r-- | src/wasm_msponge.zig | 39 |
1 files changed, 26 insertions, 13 deletions
diff --git a/src/wasm_msponge.zig b/src/wasm_msponge.zig index bee8e8c..69cf211 100644 --- a/src/wasm_msponge.zig +++ b/src/wasm_msponge.zig @@ -34,8 +34,8 @@ export fn init() void { webgl.bindBuffer(.array_buffer, col_buffer); webgl.bufferData(.array_buffer, &col_data, .static_draw); - //webgl.enable(.cull_face); - //webgl.enable(.depth_test); + webgl.enable(.cull_face); + webgl.enable(.depth_test); } const col_data: [18 * 6]f32 = blk: { @@ -142,20 +142,16 @@ export fn update(delta_time: f32) void { prog.setUniform(.color, .{ 1, 1, 1 }); const screen_dims = webgl.getScreenSize(); - const proj = orthographicMatrix( - -screen_dims[0] / 2, - screen_dims[0] / 2, - -screen_dims[1] / 2, - screen_dims[1] / 2, - -400, - 400, - ); - const tlate = Mat4.translation(.{ @sin(timer * 4) * 100, 0, 0 }); + const aspect = screen_dims[0] / screen_dims[1]; + const proj = perspectiveMatrix(degToRad(60), aspect, 1, 2000); + const tlate = Mat4.translation(.{ @sin(timer * 4) * 100, 0, -200 }); const rot = Mat4.yRotation(timer).multiply(Mat4.xRotation(timer)); - const s = @sin(timer) * 2.0 + 2; + const s = (@sin(timer) * 0.5 + 0.5); const scale = Mat4.scale(.{ s, s, s }); - const model = scale.multiply(rot).multiply(tlate); + const model = scale.multiply(rot.multiply(tlate)); const final_mat = model.multiply(proj); + const m: matrix.Matrix(f32, 1, 4) = .{ .data = @bitCast([4]f32{ 0, 0, 0, 0 }) }; + wasm.print("{d}", .{m.multiply(final_mat).data}); prog.setUniform(.mat, final_mat); webgl.drawArrays(.triangles, 0, 36); prog.setUniform(.color, .{ 0.0, 0.0, 0.0 }); @@ -165,6 +161,10 @@ export fn update(delta_time: f32) void { } } +fn degToRad(deg: f32) f32 { + return deg * pi / 180; +} + fn orthographicMatrix( left: f32, right: f32, @@ -187,6 +187,19 @@ fn orthographicMatrix( return .{ .data = vals }; } +const pi = 3.1415926535; +fn perspectiveMatrix(fov: f32, aspect: f32, near: f32, far: f32) Mat4 { + const f = @tan(pi * 0.5 - 0.5 * fov); + const range_inv = 1.0 / (near - far); + const vals = [4][4]f32{ + .{ f / aspect, 0, 0, 0 }, + .{ 0, f, 0, 0 }, + .{ 0, 0, (near + far) * range_inv, -1 }, + .{ 0, 0, near * far * range_inv * 2, 0 }, + }; + return .{ .data = vals }; +} + fn projectionMatrix2D(width: f32, height: f32) Mat3 { const mat_vals = .{ .{ 2.0 / width, 0, 0 }, |