This is an experiment in sending musical data directly from browser to browser using the excellent p2p APIs available in Agregore Browser
I made this as a demo to show at the 2022 Wizard Amigos Code Camp... video coming soon!
- data gets broadcast to peers by
POSTing it via thefetchinterface to a givenpubsub://URL - listening happens via an
EventSourceset up for the same URL - events from the
EventSourceinterface get turned into @most/core streams - @most/core streams and stram transformations are used to glue the application together and modify/select/filter musical data in various ways
- webmidi.js is used to simplify WebMIDI setup
- the all-around-keyboard web component is used for feedback and as a musical interface
> npm install
> npm run dev
First ensure that you've set up the hyp CLI and have created a hyperdrive:
> hyp daemon start
> hyp create hyperdrive
This will give you a hyper:// URL for the new hyperdrive. Modify the script in package.json to use your new hyperdrive URL.
In one terminal start the build in watch mode:
> npm start build:watch
In another terminal start syncing in watch mode:
> npm start hyp:sync
Now whenever you make changes, vite will build to ./dist and hyp will sync the changes to your hyperdrive.
- @most/core
- awesome reactive programming
- I built a browser-based music/sfx/audio engine for the game Wilderplace:
- uses @most/core in the AudioWorklet thread for time accurate, dynamic, reactive sequencing
- synthesis is all done with the Yamaha DX7 emulator webdx7 (web demo here!)
- there are tons of publicl domain, vintage DX7 presets on the world wide web
- learn about the audio system from a talk I shared at the 2022 Web Audio Conference
- and last but not least, find the game on Steam!
- I'm Micah (@micahscopes), a creative and curious web hacker!
- Find me on twitter
- See me around on numerous Discord channels!
- Check out my website wondering.xyz
- Learn about my creative hacking dreams and support my work on GitHub Sponsors!