Rename example names

example/public/index.html

@@ -36,16 +36,13 @@
 		</a>
 
 		<nav class="examples">
+			<h4 style="margin-bottom: 0.5rem;">Examples:</h4>
 			<ul>
-				<li>
-					<a href="#2d">Example 2D</a>
-				</li>
-				<li>
-					<a href="#3d">Example 3D</a>
-				</li>
+				<li><a href="#rectangle">Rectangle</a></li>
+				<li><a href="#pyramid">Pyramid</a></li>
 			</ul>
 		</nav>
 
-		<script type="module" src="index.js"></script>
+		<script type="module" src="setup.js"></script>
 	</body>
 </html>

example/example_3d.odin → example/pyramid.odin

@@ -5,17 +5,6 @@ import glm "core:math/linalg/glsl"
 
 import gl "../wasm/webgl"
 
-example_3d_state: struct {
-	rotation_y:       f32,
-	rotation_x:       f32,
-	a_position:       i32,
-	a_color:          i32,
-	u_matrix:         i32,
-	positions_buffer: gl.Buffer,
-	colors_buffer:    gl.Buffer,
-	vao:              gl.VertexArrayObject,
-}
-
 @(private="file") TRIANGLES :: 4
 @(private="file") VERTICES  :: TRIANGLES * 3
 @(private="file") SIDE      :: 200
@@ -56,9 +45,19 @@ example_3d_state: struct {
 	 0,      0,   SIDE/2,
 }
 
+@(private="file") state: struct {
+	rotation_y:       f32,
+	rotation_x:       f32,
+	a_position:       i32,
+	a_color:          i32,
+	u_matrix:         i32,
+	positions_buffer: gl.Buffer,
+	colors_buffer:    gl.Buffer,
+	vao:              gl.VertexArrayObject,
+}
 
-example_3d_start :: proc(program: gl.Program) {
-	using example_3d_state
+pyramid_start :: proc(program: gl.Program) {
+	using state
 
 	vao = gl.CreateVertexArray()
 	gl.BindVertexArray(vao)
@@ -79,17 +78,17 @@ example_3d_start :: proc(program: gl.Program) {
 	gl.BindBuffer(gl.ARRAY_BUFFER, positions_buffer)
 	gl.BufferDataSlice(gl.ARRAY_BUFFER, positions[:], gl.STATIC_DRAW)
 	gl.VertexAttribPointer(a_position, 3, gl.FLOAT, false, 0, 0)
-
+	
 	gl.BindBuffer(gl.ARRAY_BUFFER, colors_buffer)
 	gl.BufferDataSlice(gl.ARRAY_BUFFER, colors[:], gl.STATIC_DRAW)
 	gl.VertexAttribPointer(a_color, 4, gl.UNSIGNED_BYTE, true, 0, 0)
 }
 
-example_3d_frame :: proc(delta: f32) {
-	using example_3d_state
-
+pyramid_frame :: proc(delta: f32) {
+	using state
+	
 	gl.BindVertexArray(vao)
-
+	
 	gl.Viewport(0, 0, canvas_res.x, canvas_res.y)
 	gl.ClearColor(0, 0.01, 0.02, 0)
 	// Clear the canvas AND the depth buffer.

example/example_2d.odin → example/rectangle.odin

@@ -2,15 +2,6 @@ package example
 
 import gl "../wasm/webgl"
 
-example_2d_state: struct {
-	rotation:         f32,
-	a_position:       i32,
-	a_color:          i32,
-	u_matrix:         i32,
-	positions_buffer: gl.Buffer,
-	colors_buffer:    gl.Buffer,
-	vao:              gl.VertexArrayObject,
-}
 
 @(private="file") TRIANGLES :: 2
 @(private="file") VERTICES  :: TRIANGLES * 3
@@ -37,9 +28,18 @@ example_2d_state: struct {
 	0,     BOX_H,
 }
 
+@(private="file") state: struct {
+	rotation:         f32,
+	a_position:       i32,
+	a_color:          i32,
+	u_matrix:         i32,
+	positions_buffer: gl.Buffer,
+	colors_buffer:    gl.Buffer,
+	vao:              gl.VertexArrayObject,
+}
 
-example_2d_start :: proc(program: gl.Program) {
-	using example_2d_state
+rectangle_start :: proc(program: gl.Program) {
+	using state
 
 	/*
 	Position and color buffers are static,
@@ -68,8 +68,8 @@ example_2d_start :: proc(program: gl.Program) {
 	gl.VertexAttribPointer(a_color, 4, gl.UNSIGNED_BYTE, true, 0, 0)
 }
 
-example_2d_frame :: proc(delta: f32) {
-	using example_2d_state
+rectangle_frame :: proc(delta: f32) {
+	using state
 
 	gl.BindVertexArray(vao)
 

example/shader_fragment_2d.glsl → example/rectangle_fs.glsl

@@ -10,5 +10,5 @@ in vec4 v_color;
 out vec4 out_color;
 
 void main() {
-	out_color = v_color;
+	out_color =  v_color;
 }

example/index.js → example/setup.js

@@ -28,13 +28,13 @@ if (IS_DEV) {
 Example selection
 */
 
-/** @type {Record<string, t.Example_Type | undefined>} */
+/** @type {Record<string, t.Example_Kind | undefined>} */
 const example_hash_map = {
-	"#2d": t.Example_Type.D2,
-	"#3d": t.Example_Type.D3,
+	"#rectangle": t.Example_Kind.Rectangle,
+	"#pyramid":   t.Example_Kind.Pyramid,
 }
-/** @type {t.Example_Type} */
-const example = example_hash_map[location.hash] ?? t.Example_Type.D3
+/** @type {t.Example_Kind} */
+const example = example_hash_map[location.hash] ?? t.Example_Kind.Pyramid
 
 for (const hash in example_hash_map) {
 	const anchor = document.querySelector(`a[href="${hash}"]`)

example/main.odin → example/setup.odin

@@ -7,28 +7,28 @@ import "core:runtime"
 import "../wasm/dom"
 import gl "../wasm/webgl"
 
-shader_fragment_2d := #load("shader_fragment_2d.glsl", string)
-shader_vertex_2d := #load("shader_vertex_2d.glsl", string)
+rectangle_fs := #load("./rectangle_fs.glsl", string)
+rectangle_vs := #load("./rectangle_vs.glsl", string)
 
-shader_fragment_3d := #load("shader_fragment_3d.glsl", string)
-shader_vertex_3d := #load("shader_vertex_3d.glsl", string)
+pyramid_fs := #load("./pyramid_fs.glsl", string)
+pyramid_vs := #load("./pyramid_vs.glsl", string)
 
 dpr: f32
-canvas_res: [2]i32
-canvas_pos: [2]f32
+canvas_res:  [2]i32
+canvas_pos:  [2]f32
 canvas_size: [2]f32
 window_size: [2]f32
-mouse_pos: [2]f32
+mouse_pos:   [2]f32
 
 scale: f32 = 1
 scale_min: f32 = 0.25
 scale_max: f32 = 3
 
-Example_Type :: enum {
-	D2,
-	D3,
+Example_Kind :: enum {
+	Rectangle,
+	Pyramid,
 }
-example: Example_Type
+example: Example_Kind
 
 frame_arena_buffer: [1024]byte
 frame_arena: mem.Arena = {
@@ -55,27 +55,26 @@ main :: proc() {
 @(export)
 start_example :: proc "contextless" (
 	ctx: ^runtime.Context,
-	example_type: Example_Type,
+	example_kind: Example_Kind,
 ) -> (ok: bool) {
 	context = ctx^
-	example = example_type
+	example = example_kind
 
 	// Make sure that this matches the id of your canvas.
 	if ok := gl.SetCurrentContextById("canvas"); !ok {
 		fmt.eprintln("Failed to set current context!")
 		return false
 	}
 
-	vs_sources: []string
-	fs_sources: []string
+	vs_sources, fs_sources: []string
 
 	switch example {
-	case .D2:
-		vs_sources = {shader_vertex_2d}
-		fs_sources = {shader_fragment_2d}
-	case .D3:
-		vs_sources = {shader_vertex_3d}
-		fs_sources = {shader_fragment_3d}
+	case .Rectangle:
+		vs_sources = {rectangle_vs}
+		fs_sources = {rectangle_fs}
+	case .Pyramid:
+		vs_sources = {pyramid_vs}
+		fs_sources = {pyramid_fs}
 	}
 
 	program, program_ok := gl.CreateProgramFromStrings(vs_sources, fs_sources)
@@ -87,8 +86,8 @@ start_example :: proc "contextless" (
 	gl.UseProgram(program)
 
 	switch example {
-	case .D2: example_2d_start(program)
-	case .D3: example_3d_start(program)
+	case .Rectangle: rectangle_start(program)
+	case .Pyramid  : pyramid_start(program)
 	}
 
 	if err := gl.GetError(); err != gl.NO_ERROR {
@@ -126,7 +125,7 @@ frame :: proc "contextless" (ctx: ^runtime.Context, delta: f32) {
 	}
 
 	switch example {
-	case .D2: example_2d_frame(delta)
-	case .D3: example_3d_frame(delta)
+	case .Rectangle: rectangle_frame(delta)
+	case .Pyramid  : pyramid_frame(delta)
 	}
 }

example/types.d.ts

@@ -1,13 +1,13 @@
 import * as wasm from "../wasm/runtime.js"
 
-export type Example_Type = (typeof Example_Type)[keyof typeof Example_Type]
-declare const Example_Type: {
-	D2: 0
-	D3: 1
+export type Example_Kind = (typeof Example_Kind)[keyof typeof Example_Kind]
+declare const Example_Kind: {
+	Rectangle: 0
+	Pyramid  : 1
 }
 
 export interface WasmExports extends wasm.OdinExports {
-	start_example: (ctx_ptr: wasm.rawptr, example_type: Example_Type) => wasm.bool
+	start_example: (ctx_ptr: wasm.rawptr, example_type: Example_Kind) => wasm.bool
 	frame: (ctx_ptr: wasm.rawptr, delta: wasm.f32) => void
 	on_window_resize: (
 		window_w: wasm.f32,

example/types.js

@@ -1,5 +1,5 @@
-/** @type {typeof import("./types.js").Example_Type} */
-export const Example_Type = {
-	D2: 0,
-	D3: 1,
+/** @type {typeof import("./types.js").Example_Kind} */
+export const Example_Kind = {
+	Rectangle: 0,
+	Pyramid: 1,
 }

example/lib.odin → example/utils.odin

@@ -3,17 +3,15 @@ package example
 import "core:intrinsics"
 import glm "core:math/linalg/glsl"
 
-cast_vec2 :: #force_inline proc "contextless" (
-	$D: typeid,
-	v: [2]$S,
-) -> [2]D where intrinsics.type_is_numeric(S) &&
-	intrinsics.type_is_numeric(D) {return {D(v.x), D(v.y)}}
+cast_vec2 :: #force_inline proc "contextless" ($D: typeid, v: [2]$S) -> [2]D
+	where intrinsics.type_is_numeric(S) && intrinsics.type_is_numeric(D) {
+	return {D(v.x), D(v.y)}
+}
 
 vec2_to_vec3 :: #force_inline proc "contextless" (v: $T/[2]f32, z: f32 = 0) -> glm.vec3 {
 	return {v.x, v.y, z}
 }
 
-// odinfmt: disable
 @(require_results)
 mat3_translate :: proc "contextless" (v: [2]f32) -> glm.mat3 {
 	return {
@@ -85,5 +83,3 @@ mat4_rotate_z :: proc "contextless" (radians: f32) -> glm.mat4 {
 		0,  0, 0, 1,
 	}
 }
-
-// odinfmt: enable

main.js

@@ -175,7 +175,7 @@ const command_handlers = {
 		await buildConfig(false)
 
 		const bundle_res = await unsafePromiseToError(
-			rollup.rollup({input: path.join(playground_path, "index.js")}),
+			rollup.rollup({input: path.join(playground_path, "setup.js")}),
 		)
 		if (bundle_res instanceof Error) panic("Failed to bundle, error:", bundle_res)