From a94c3ad29a0069cf0def0f041208536097c6c8ca Mon Sep 17 00:00:00 2001
From: Damian Tarnawski <gthetarnav@gmail.com>
Date: Sat, 6 Apr 2024 21:37:58 +0200
Subject: [PATCH] Draw pyramids

---
 example/look_at.odin | 68 +++++++++++++++++++++++++++++++-------------
 example/setup.js     |  5 +++-
 example/utils.odin   | 63 ++++++++++++++--------------------------
 3 files changed, 75 insertions(+), 61 deletions(-)

diff --git a/example/look_at.odin b/example/look_at.odin
index 525cf92..6e923c7 100644
--- a/example/look_at.odin
+++ b/example/look_at.odin
@@ -3,15 +3,42 @@ package example
 import glm "core:math/linalg/glsl"
 import gl  "../wasm/webgl"
 
-@(private="file") BOX_HEIGHT :: 60
+PYRAMID_TRIANGLES :: 6
+PYRAMID_VERTICES  :: PYRAMID_TRIANGLES * 3
+
+pyramid_colors: [PYRAMID_VERTICES]RGBA = {
+	BLUE,   BLUE,   BLUE,   // 0
+	BLUE,   BLUE,   BLUE,   // 1
+	YELLOW, YELLOW, YELLOW, // 2
+	PURPLE, PURPLE, PURPLE, // 3
+	RED,    RED,    RED,    // 4
+	ORANGE, ORANGE, ORANGE, // 5
+}
+
+write_pyramid_positions :: proc(dst: []Vec, x, y, z, h: f32) {
+	assert(len(dst) == PYRAMID_VERTICES)
+
+	positions: [PYRAMID_VERTICES]Vec = {
+		{x, y, z},   {x+h, y, z}, {x,   y, z+h},
+		{x, y, z+h}, {x+h, y, z}, {x+h, y, z+h},
+
+		{x,   y, z},   {x+h/2, y+h, z+h/2}, {x+h, y, z},
+		{x+h, y, z},   {x+h/2, y+h, z+h/2}, {x+h, y, z+h},
+		{x+h, y, z+h}, {x+h/2, y+h, z+h/2}, {x,   y, z+h},
+		{x,   y, z+h}, {x+h/2, y+h, z+h/2}, {x,   y, z},
+	}
+	for &vec in positions {
+		vec -= {0.5, 0.5, 0.5} * h
+	}
+	copy(dst, positions[:])
+}
 
-@(private="file") BOXES_ROWS   :: 3
-@(private="file") BOXES_AMOUNT :: BOXES_ROWS * BOXES_ROWS * BOXES_ROWS
+@(private="file") HEIGHT   :: 60
+@(private="file") AMOUNT   :: 10
+@(private="file") VERTICES :: AMOUNT * PYRAMID_VERTICES
 
 @(private="file") state: struct {
 	rotation:   [2]f32,
-	a_position: i32,
-	a_color:    i32,
 	u_matrix:   i32,
 	vao:        VAO,
 }
@@ -22,9 +49,9 @@ look_at_start :: proc(program: gl.Program) {
 	vao = gl.CreateVertexArray()
 	gl.BindVertexArray(vao)
 
-	a_position = gl.GetAttribLocation (program, "a_position")
-	a_color    = gl.GetAttribLocation (program, "a_color")
-	u_matrix   = gl.GetUniformLocation(program, "u_matrix")
+	a_position := gl.GetAttribLocation (program, "a_position")
+	a_color    := gl.GetAttribLocation (program, "a_color")
+	u_matrix    = gl.GetUniformLocation(program, "u_matrix")
 
 	gl.EnableVertexAttribArray(a_position)
 	gl.EnableVertexAttribArray(a_color)
@@ -35,18 +62,21 @@ look_at_start :: proc(program: gl.Program) {
 	gl.Enable(gl.CULL_FACE) // don't draw back faces
 	gl.Enable(gl.DEPTH_TEST) // draw only closest faces
 
-	positions: [BOXES_AMOUNT * CUBE_VERTICES]Vec
-	colors   : [BOXES_AMOUNT * CUBE_VERTICES]RGBA
+	positions: [VERTICES]Vec
+	colors   : [VERTICES]RGBA
+
+	for i in 0..<AMOUNT {
+		angle := 2*PI * f32(i)/f32(AMOUNT)
 
-	for i in 0..<BOXES_AMOUNT {
-		write_cube_positions(
-			positions[i*CUBE_VERTICES:][:CUBE_VERTICES],
-			x = 100 * f32(i % BOXES_ROWS)              - 100,
-			y = 100 * f32(i / BOXES_ROWS % BOXES_ROWS) - 100,
-			z = 100 * f32(i / BOXES_ROWS / BOXES_ROWS) - 100,
-			h = BOX_HEIGHT,
+		write_pyramid_positions(
+			positions[i*PYRAMID_VERTICES:][:PYRAMID_VERTICES],
+			x = 300 * cos(angle),
+			y = 0,
+			z = 300 * sin(angle),
+			h = HEIGHT,
 		)
-		copy(colors[i*CUBE_VERTICES:][:CUBE_VERTICES], cube_colors[:])
+		
+		copy(colors[i*PYRAMID_VERTICES:][:PYRAMID_VERTICES], pyramid_colors[:])
 	}
 
 	gl.BindBuffer(gl.ARRAY_BUFFER, positions_buffer)
@@ -88,5 +118,5 @@ look_at_frame :: proc(delta: f32) {
 
 	gl.UniformMatrix4fv(u_matrix, mat)
 
-	gl.DrawArrays(gl.TRIANGLES, 0, CUBE_VERTICES * BOXES_AMOUNT)
+	gl.DrawArrays(gl.TRIANGLES, 0, VERTICES)
 }
diff --git a/example/setup.js b/example/setup.js
index 6abe86b..e017b13 100644
--- a/example/setup.js
+++ b/example/setup.js
@@ -48,6 +48,10 @@ const example_kind_href_hashes_entries = /** @type {*} */(Object.entries(example
 let example_kind = Example_Kind.Boxes
 
 for (const [kind, hash] of example_kind_href_hashes_entries) {
+	if (location.hash === hash) {
+		example_kind = kind
+	}
+
 	const anchor = document.querySelector(`a[href="${hash}"]`)
 	if (!anchor) continue
 
@@ -59,7 +63,6 @@ for (const [kind, hash] of example_kind_href_hashes_entries) {
 
 	if (location.hash === hash) {
 		anchor.classList.add("active")
-		example_kind = kind
 	}
 }
 
diff --git a/example/utils.odin b/example/utils.odin
index 9cf00a8..07d9be2 100644
--- a/example/utils.odin
+++ b/example/utils.odin
@@ -4,6 +4,7 @@ import "core:intrinsics"
 import glm "core:math/linalg/glsl"
 import gl "../wasm/webgl"
 
+PI   :: glm.PI
 VAO  :: gl.VertexArrayObject
 Vec  :: glm.vec3
 Mat3 :: glm.mat3
@@ -11,6 +12,9 @@ Mat4 :: glm.mat4
 RGBA :: distinct [4]u8
 
 radians :: glm.radians_f32
+cos :: glm.cos
+sin :: glm.sin
+tan :: glm.tan
 
 cast_vec2 :: #force_inline proc "contextless" ($D: typeid, v: [2]$S) -> [2]D
 	where intrinsics.type_is_numeric(S) && intrinsics.type_is_numeric(D) {
@@ -109,52 +113,29 @@ mat4_perspective :: proc "contextless" (fov, aspect, near, far: f32) -> glm.mat4
 }
 
 
+GREEN : RGBA : {60, 210, 0, 255}
+YELLOW: RGBA : {210, 210, 0, 255}
+BLUE  : RGBA : {0, 80, 190, 255}
+RED   : RGBA : {230, 20, 0, 255}
+ORANGE: RGBA : {250, 160, 50, 255}
+PURPLE: RGBA : {160, 100, 200, 255}
 
 CUBE_TRIANGLES :: 6 * 2
 CUBE_VERTICES  :: CUBE_TRIANGLES * 3
 
 cube_colors: [CUBE_VERTICES]RGBA = {
-	{60, 210, 0, 255}, // 0
-	{60, 210, 0, 255}, // Green
-	{60, 210, 0, 255}, // 
-	{60, 210, 0, 255}, // 1
-	{60, 210, 0, 255}, // Green
-	{60, 210, 0, 255}, // 
-
-	{210, 210, 0, 255}, // 2
-	{210, 210, 0, 255}, // Yellow
-	{210, 210, 0, 255}, //
-	{210, 210, 0, 255}, // 3
-	{210, 210, 0, 255}, // Yellow
-	{210, 210, 0, 255}, //
-
-	{0, 80, 190, 255}, // 4
-	{0, 80, 190, 255}, // Blue
-	{0, 80, 190, 255}, //
-	{0, 80, 190, 255}, // 5
-	{0, 80, 190, 255}, // Blue
-	{0, 80, 190, 255}, //
-
-	{230, 20, 0, 255}, // 6 
-	{230, 20, 0, 255}, // Red
-	{230, 20, 0, 255}, //
-	{230, 20, 0, 255}, // 7
-	{230, 20, 0, 255}, // Red
-	{230, 20, 0, 255}, //
-
-	{250, 160, 50, 255}, // 8
-	{250, 160, 50, 255}, // Orange
-	{250, 160, 50, 255}, //
-	{250, 160, 50, 255}, // 9
-	{250, 160, 50, 255}, // Orange
-	{250, 160, 50, 255}, //
-
-	{160, 100, 200, 255}, // 10
-	{160, 100, 200, 255}, // Purple
-	{160, 100, 200, 255}, //
-	{160, 100, 200, 255}, // 11
-	{160, 100, 200, 255}, // Purple
-	{160, 100, 200, 255}, //
+	GREEN,  GREEN,  GREEN,  // 0
+	GREEN,  GREEN,  GREEN,  // 1
+	YELLOW, YELLOW, YELLOW, // 2
+	YELLOW, YELLOW, YELLOW, // 3
+	BLUE,   BLUE,   BLUE,   // 4
+	BLUE,   BLUE,   BLUE,   // 5
+	RED,    RED,    RED,    // 6
+	RED,    RED,    RED,    // 7
+	ORANGE, ORANGE, ORANGE, // 8
+	ORANGE, ORANGE, ORANGE, // 9
+	PURPLE, PURPLE, PURPLE, // 10
+	PURPLE, PURPLE, PURPLE, // 11
 }
 
 cube_positions: [CUBE_VERTICES]Vec = {