Build initial web port of trio

Build initial web port of trio

task id: demo-trio-web

2024-07-29 15:17: Begin initial web port #demo-trio-web

2024-07-29 15:20: Writing out boilerplate HTML/js #demo-trio-web #timelog:00:36:46

Doing this by hand, as a learning experience. Poke used as reference.

I am using "modules" now to help me better break up my code ahead of time.

2024-07-29 16:07: initial webaudio scaffolding #demo-trio-web #timelog:00:38:01

2024-07-29 16:31: What's a good way to get sound/visuals to talk? #demo-trio-web

Trying to do this the mildly correct way.

I'm making a new class off of p5, adding my own data to it.

2024-07-29 16:41: Adding intial processor code #demo-trio-web

No WASM bits yet, though there should be placeholder

2024-07-29 16:45: That's all we have time for. #demo-trio-web

Wrapping up this session.

2024-07-29 19:07: More web porting #demo-trio-web #timelog:01:51:28

2024-07-29 19:09: I'm turning this into a typescript project. #demo-trio-web

Using this guide: <</digitalocean_typescript_new_project>>.

npm -i typescript --save-dev



2024-07-29 19:17: I am fighting the code formatter #demo-trio-web



npm i gts --save-dev

npx gts init

This seems to solve the formatter

npx tsc

2024-07-29 19:32: you know what on second thought, just keep on doing JS I'm tired #demo-trio-web

2024-07-29 19:49: I just lost my main work. This sucks. #demo-trio-web

Accidentally deleted sketch.js.

Might as well try typescript again.

2024-07-29 20:20: p5 does not want to play nice with typescript #demo-trio-web

2024-07-29 20:28: great, now I'm looking at the p5 codebase #demo-trio-web

2024-07-29 20:50: "npm test" generates the p5.min.js file great #demo-trio-web

There is literally one line that is the issue. I am going to attempt to patch this on my end.

2024-07-29 21:08: let the record show: we tried to get p5 working. #demo-trio-web

2024-07-30 08:01: Just do the graphics in canvas instead of p5? #demo-trio-web

R mentioned this, and it's been a sentiment that others have mentioned as well. p5 just makes canvas calls anyways.

2024-07-30 08:07: Get something working using canvas API #demo-trio-web #timelog:01:34:07

2024-07-30 08:56: Trying to get pointer logic working. #demo-trio-web

Following <<webdev/using_pointer_events>>.

Issue was a chrome mobile related issue. Had to use CSS to set touch-actions to be none.

2024-07-30 09:35: Setting up dynamic lines layout #demo-trio-web

2024-07-30 09:43: Okay visuals are off to a good start now. #demo-trio-web

2024-07-30 09:48: Begin work making audioworklet stuff #demo-trio-web #timelog:01:02:25

Once again...

2024-07-30 09:50: turning things into a module #demo-trio-web

Interesting, the parser becomes stricter. I need to formally declare "i" in my for loop. All done by simply add "type=module" to my HTML script element.

2024-07-30 10:13: click to start mechanics not behaving for some reason #demo-trio-web

Figured it out: it was the callback mechanics of requestAnimationFrame.

2024-07-30 10:16: adding "TAP TO BEGIN" text. #demo-trio-web

2024-07-30 10:27: setting up message passing to worklet #demo-trio-web

2024-07-30 10:30: first getting the input events to the node #demo-trio-web

2024-07-30 10:38: startAudio returns a promise I guess? #demo-trio-web

Solution: encapsulate in then.

2024-07-30 10:43: move message works! #demo-trio-web

2024-07-30 10:47: send to processor via messages now #demo-trio-web

2024-07-30 10:51: initial message passing implemented #demo-trio-web

I'll have to do the rest later.

2024-07-30 13:17: More audioworklet stuff #demo-trio-web #timelog:02:51:07

2024-07-30 13:21: Why is gate not being read in chromium #demo-trio-web

I'm mouse events are happening either way

Logic bug. And should have been an or. Struggled to clear cache on Chromium too.

2024-07-30 13:27: Get wasm stuff working #demo-trio-web

2024-07-30 13:29: My println stuff is causing issues I think. #demo-trio-web

I'm not going to do macros, I'm just going to comment things out.

2024-07-30 13:37: Huh. it's not generating a wasm at all actually, even though there is no error. #demo-trio-web

Had to generate cdylib.

2024-07-30 13:43: More unknown opcodes in wasm-gc. I wonder if there's a way to get more info on that #demo-trio-web

It went from unknown opcode 192 to 193, after I commented out all the panics.

2024-07-30 13:50: broke the tests last night with more notes I think #demo-trio-web

Nope, that wasn't it. Sigh. Gotta bisect.

Bisect tracked down the quick bugfix I made that checked for valid lower/upper values.

2024-07-30 14:21: A messy fix for now, but things don't panic and tests pass #demo-trio-web

2024-07-30 14:27: A very odd opcode was generated in wasm #demo-trio-web

Opcode 193 is something that extends a signed opcode, which caused wasm-gc to panic. The lines that do that are in the measure_movement function. It was quick to find because it's the only time I deliberately cast from unsigned to signed. I happened to use i16 which caused the panic to happen. However, changing to i32 made things work just fine.

2024-07-30 14:31: right. Now I need to get the wasm in. #demo-trio-web

The exports and the interface are already there from the C prototype. It should mostly drop right in.

2024-07-30 15:00: There should be sound. But there is no sound. #demo-trio-web

2024-07-30 15:25: Still not sure where there isn't sound. #demo-trio-web

2024-07-30 15:28: I forgot to return true, but there still ain't any sound. #demo-trio-web

2024-07-30 15:46: Okay, now there's sound. #demo-trio-web

I wasn't passing in the dsp parameter.

2024-07-30 15:47: Attempting to run on phone. #demo-trio-web

2024-07-30 16:11: Good enough. Taking a break. #demo-trio-web