Skip to content

A browser (and react) & native way to make synthesizers in javascript using an audio context.

Notifications You must be signed in to change notification settings

konsumer/crossaudio

Repository files navigation

crossaudio

A browser (and react) & native way to make synthesizers in javascript using an an audio context.

WIP

This is a work-in-progress. It's getting close to "ready for use", but there still might be some rough edges. Check back to see how it fills in.

motivation

I wanted a frontend & backend library I can use to run an "instrument" written in javascript or wasm, so I could make custom headless (or hardware UI, like LCD and rotary-encoders attached to a pi) synths, and also make a web-based emulator that will run them. It takes some inspiration from react & elementary. At it's core, it uses web-audio-engine, so it uses a fairly simple and unmodified web audio API. In the browser, it uses the regular audio context, elsewhere, it uses native audio.

getting started

There are READMEs in all the sub-projects:

See Getting Started to quickly get up to speed.

The quick gist:

npm init crossaudio myproject
cd myproject
npm start

development

If you are developing on crossaudio packages, it is managed with lerna.

git clone [email protected]:konsumer/crossaudio.git
cd crossaudio
npm i

I have ./node_modules/.bin/ in my path, so local commands work, but you might have to globally install lerne, or reference the full path.

You can add new dependencies to one or all packages:

lerna add PACKAGE
lerna add PACKAGE --scope @crossaudio/core

You can publish all packages with lerna publish

I made a couple of shortcuts for messing with the doc-site:

# run a watching local dev-server
npm start

# build & deploy the doc-site
npm run deploy

TODO

  • write more instruments
  • make a rust wasm instrument
  • get audio-input working: use a start sort of function on audio-context to start listening
  • get offline rendering working
  • write viz for webgl to use in plain threejs, react-three-fiber and node-webgl. this looks like a cool demo to play with
  • write some sort of CLI viz
  • finish emulator for pi hardware
  • flesh out docs, completely
  • add more codecs to native (only supports wav)
  • use webmidi to normalize midi on local/browser
  • autopublish everything via github actions (build & publish page, all npm module, etc)
  • Confirm making current dir a project in create and add --yes option to not prompt
  • WAX has good ideas about UI, but I'd rather just use web nodes (instead of wrapped plugins and stuff)
  • it would be cool to have seperate ready-made react & web-component controls that work easily to make a UI (name and it figures out range and hooks to it.) Publish them on webcomponents.org
  • better packaging setup (JSX should be available, things properly inlined, etc)
  • merge demos on front-page better
  • typescript definitions

About

A browser (and react) & native way to make synthesizers in javascript using an audio context.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published