[oden] Finish colors and cleanup

game/actor.ts

@@ -1,7 +1,7 @@
 import { load_texture } from "./assets";
 import { btn, Button } from "./input";
 import { Vec2, new_v2, vadd, vsub, vnorm, vmul } from "./vector";
-import { spr, circle, use_texture, Texture } from "./graphics";
+import { spr, use_texture, Texture } from "./graphics";
 import { has_collision, Level } from "./level";
 
 export interface ActorProps {
@@ -191,7 +191,10 @@ export class Robo extends Actor {
 
       const frame = (anim.start + ((clock / anim.speed) % anim.length)) >> 0;
       spr(x, y, w, h, frame * w, 0, 32, 32);
-      circle(this.props.position.x, this.props.position.y, 16, 1);
+
+      // color(0, 0, 0, 0);
+      // stroke(0, 0, 0, 1);
+      // circle(this.props.position.x, this.props.position.y, 8, 1);
     }
   }
 }

src/circle_shader.wgsl

@@ -8,11 +8,11 @@ struct VertexInput {
 };
 
 struct InstanceInput {
-  @location(4) center: vec2<f32>,
-  @location(5) radius: f32,
-  @location(6) stroke_width: f32,
-  @location(7) stroke_color: vec4<f32>,
-  @location(8) fill_color: vec4<f32>,
+  @location(5) center: vec2<f32>,
+  @location(6) radius: f32,
+  @location(7) stroke_width: f32,
+  @location(8) stroke_color: vec4<f32>,
+  @location(9) fill_color: vec4<f32>,
 };
 
 struct VertexOutput {

src/graphics.ts

@@ -11,6 +11,31 @@ export function cls(r: number, g: number, b: number) {
   core.cls(r, g, b);
 }
 
+/**
+ * Set the current drawing color. This is the fill color for shapes that have
+ * both stroke and fill.
+ *
+ * @param r - The red component of the color, from 0 to 1.
+ * @param g - The green component of the color, from 0 to 1.
+ * @param b - The blue component of the color, from 0 to 1.
+ * @param a - The alpha (transparency) of the color, from 0 (transparent) to 1 (opaque)
+ */
+export function color(r: number, g: number, b: number, a: number = 1) {
+  core.color(r, g, b, a);
+}
+
+/**
+ * Set the current stroke color, for shapes that have a stroke.
+ *
+ * @param r - The red component of the color, from 0 to 1.
+ * @param g - The green component of the color, from 0 to 1.
+ * @param b - The blue component of the color, from 0 to 1.
+ * @param a - The alpha (transparency) of the color, from 0 (transparent) to 1 (opaque)
+ */
+export function stroke(r: number, g: number, b: number, a: number = 1) {
+  core.stroke(r, g, b, a);
+}
+
 /**
  * Print a message to the console.
  *

src/lib.rs

@@ -26,7 +26,7 @@ struct Vertex {
 impl Vertex {
     fn desc() -> wgpu::VertexBufferLayout<'static> {
         wgpu::VertexBufferLayout {
-            array_stride: std::mem::size_of::<Vertex>() as wgpu::BufferAddress,
+            array_stride: std::mem::size_of::<Self>() as wgpu::BufferAddress,
             step_mode: wgpu::VertexStepMode::Vertex,
             attributes: &[
                 wgpu::VertexAttribute {
@@ -57,7 +57,7 @@ pub struct SpriteInstance {
 impl SpriteInstance {
     fn desc() -> wgpu::VertexBufferLayout<'static> {
         wgpu::VertexBufferLayout {
-            array_stride: std::mem::size_of::<SpriteInstance>() as wgpu::BufferAddress,
+            array_stride: std::mem::size_of::<Self>() as wgpu::BufferAddress,
             step_mode: wgpu::VertexStepMode::Instance,
             attributes: &[
                 wgpu::VertexAttribute {
@@ -98,40 +98,45 @@ pub struct CircleInstance {
 impl CircleInstance {
     fn desc() -> wgpu::VertexBufferLayout<'static> {
         wgpu::VertexBufferLayout {
-            array_stride: std::mem::size_of::<SpriteInstance>() as wgpu::BufferAddress,
+            array_stride: std::mem::size_of::<Self>() as wgpu::BufferAddress,
             step_mode: wgpu::VertexStepMode::Instance,
             attributes: &[
                 wgpu::VertexAttribute {
+                    // center
                     offset: 0,
-                    shader_location: 4,
+                    shader_location: 5,
                     format: wgpu::VertexFormat::Float32x2,
                 },
                 wgpu::VertexAttribute {
+                    // radius
                     offset: std::mem::size_of::<[f32; 2]>() as wgpu::BufferAddress,
-                    shader_location: 5,
-                    format: wgpu::VertexFormat::Float32,
-                },
-                wgpu::VertexAttribute {
-                    offset: (std::mem::size_of::<[f32; 2]>() + std::mem::size_of::<f32>())
-                        as wgpu::BufferAddress,
                     shader_location: 6,
                     format: wgpu::VertexFormat::Float32,
                 },
                 wgpu::VertexAttribute {
+                    // stroke_width
+                    offset: (std::mem::size_of::<[f32; 2]>() + std::mem::size_of::<f32>())
+                        as wgpu::BufferAddress,
+                    shader_location: 7,
+                    format: wgpu::VertexFormat::Float32,
+                },
+                wgpu::VertexAttribute {
+                    // stroke_color
                     offset: (std::mem::size_of::<[f32; 2]>()
                         + std::mem::size_of::<f32>()
                         + std::mem::size_of::<f32>())
                         as wgpu::BufferAddress,
-                    shader_location: 7,
+                    shader_location: 8,
                     format: wgpu::VertexFormat::Float32x4,
                 },
                 wgpu::VertexAttribute {
+                    // fill_color
                     offset: (std::mem::size_of::<[f32; 2]>()
                         + std::mem::size_of::<f32>()
                         + std::mem::size_of::<f32>()
                         + std::mem::size_of::<[f32; 4]>())
                         as wgpu::BufferAddress,
-                    shader_location: 8,
+                    shader_location: 9,
                     format: wgpu::VertexFormat::Float32x4,
                 },
             ],
@@ -489,7 +494,7 @@ impl State {
 
         let circle_pipeline_layout =
             device.create_pipeline_layout(&wgpu::PipelineLayoutDescriptor {
-                label: Some("Sprite Pipeline Layout"),
+                label: Some("Circle Pipeline Layout"),
                 bind_group_layouts: &[&screen_uniform_bind_group_layout],
                 push_constant_ranges: &[],
             });
@@ -809,7 +814,7 @@ impl<'a> FrameBuilder<'a> {
 
             mode: DrawMode::Sprites,
             stroke_color: [0.0, 0.0, 0.0, 1.0],
-            fill_color: [0.0, 0.0, 1.0, 1.0],
+            fill_color: [1.0, 1.0, 1.0, 1.0],
             target: last_view,
             color: None,
             draw_calls: Vec::new(),
@@ -984,7 +989,7 @@ impl<'a> FrameBuilder<'a> {
             radius: cc.radius,
             stroke_width: cc.stroke_width,
             stroke_color,
-            fill_color: [1.0, 1.0, 1.0, 1.0],
+            fill_color,
         });
     }