Fork me on GitHub
#clojurescript
<
2023-10-08
>
Chris McCormick08:10:12

Does anybody know of a simple way to consume typescript definitions from ClojureScript? My usecase is dynamically creating webaudio graphs of arbitrary shape at runtime, including a user driven UI for creating webaudio graphs, and also procedurally generated graphs (e.g. using genetic algorithms). There is a typescript definition for the WebAudio API here: https://github.com/stringparser/tonejs-typescript-definitions/blob/master/WebAudio.d.ts Thank you!

p-himik08:10:02

Why do you need that definition in the first place? It's just what your browser has already built into it as a plain JS API, which you can use from CLJS via interop.

Chris McCormick08:10:47

My program needs to know the names of the functions, what can be passed to them, and what they return.

Chris McCormick08:10:39

Imagine you have a node based editor like this: https://reactflow.dev/ The user can select from any AudioNode to place into this graph. I want to programmatically construct the available nodes which map 1-to-1 to the available webaudio nodes. I also want to programmatically create sub-UIs for e.g. AudioParams. I would like to avoid manually constructing a node type for each type of AudioNode.

p-himik08:10:31

Ah, gotcha. Didn't realize you wanted to create not only the graphs but also nodes themselves dynamically. I'd convert the types to JSON (e.g. via ts-json-schema-generator) and then use it from CLJS.

Chris McCormick08:10:29

Ah perfect, will investigate that command, thank you! 🙏

p-himik08:10:56

FWIW I have a suspicion that going that route is actually much more work than coding every node by hand. There are not that many nodes, and the API is relatively stable.

Chris McCormick08:10:02

Yes you may be right. I'll take a look and I can switch to doing it manually if it's too much trouble.

Chris McCormick08:10:44

Almost certainly I will have to add manual annotations in any case as things like domain of AudioParameters is not available (e.g. some are frequency in Hz, some are 0-1 etc.)

hifumi12323:10:08

You can look into tsickle for converting typescript declaration files into google closure externs. But I will warn you this is very much a Google-internal tool and they do not care about anyone outside of Google using this tool 😛

hifumi12323:10:32

Oh, I misread your requirement: you seem to want to parse typescript declarations to populate some fields in your UI. You may be able to use tools that convert TS types to JSON schema. cf. https://github.com/YousefED/typescript-json-schema

🙏 1
Chris McCormick02:10:00

For anybody finding this i n future, I managed to get reasonable results by using typescript's own internal definitions after pnpm install typescript and using typescript-json-schema and ignoring errors: npx typescript-json-schema node_modules/.pnpm/[email protected]/node_modules/typescript/lib/lib.dom.d.ts OscillatorNode --ignoreErrors npx typescript-json-schema node_modules/.pnpm/[email protected]/node_modules/typescript/lib/lib.dom.d.ts AudioContext --ignoreErrors etc.