Build initial web port of trio
task id: demo-trio-web2024-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
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
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
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.