Brian's HTMAA Diary 2024

Week 12: Interface & Application Programming

For Interface & Application Programming, I used the PCB I made for output weak as input for the interface.

I modified the arduino code so that it just serves as a controller for push buttons whereas previously it controlled servos.

              
                const int PushButton01 = 23;
                const int PushButton02 = 16;

                void setup() {
                  Serial.begin(9600);
                  pinMode(PushButton01, INPUT);
                  pinMode(PushButton02, INPUT);
                }


                void loop() {
                  int buttonState01 = digitalRead(PushButton01);
                  int buttonState02 = digitalRead(PushButton02);
                  if ( buttonState01 == HIGH ) {
                    Serial.println("1");
                    delay(20);
                    }
                  if ( buttonState02 == HIGH ) {
                    Serial.println("2");
                    delay(20);
                    }
                }
              
            

I first was thinking of making something with p5.js as I had experience with it before, but I decide to try something new and looked into WebGPU.

              
                import serial
                import pylinalg as la
                import pygfx as gfx
                import time
                from wgpu.gui.auto import WgpuCanvas


                ser = serial.Serial(
                    port='COM3',
                    baudrate=9600,
                    timeout=1,
                )

                canvas = WgpuCanvas(size=(720, 480), title = "Mobius Strip")

                scene = gfx.Scene()

                camera = gfx.cameras.PerspectiveCamera(50, 16/9)
                camera.local.position = (0, 50, 250)
                camera.look_at((0, 0, 0))



                obj = gfx.Mesh(
                    gfx.mobius_strip_geometry(50, 50, 128, stitch=False),
                    gfx.MeshPhongMaterial(color="#336699"),
                )

                scene.add(obj)
                scene.add(gfx.DirectionalLight())
                scene.add(camera.add(gfx.DirectionalLight()))

                def rotate():
                    rot = la.quat_from_euler((0, 0.03, 0))
                    obj.local.rotation = la.quat_mul(rot, obj.local.rotation)

                def controls():
                    if ser.in_waiting > 0:
                        data = ser.readline().decode('utf-8').strip()
                        if data == "1":
                            obj.world.x -= 2
                        if data == "2":
                            obj.world.x += 2


                if __name__ == "__main__":
                    gfx.show(scene,canvas=canvas, after_render=controls, before_render=rotate,camera=camera)