Skip to content

🎹 The easiest way to record MIDI. No install. Automatically recording.

License

Notifications You must be signed in to change notification settings

codingscode/midi-recorder

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

The simplest way to record MIDI.

  • Records right away, no install or setup required. Automatically connects to new MIDI devices.
  • Visualizes notes, pitch bends, and instrument changes, as you play, so you know its recording.
  • Records while you play, so if you close the tab by accident, or refresh the page, or your browser crashes, or there's a power outage, you can recover the recording.

If you've got a MIDI keyboard, plug in and try it out.

Built with SimpleMidiInput.js and MidiFile.js

License

MIT-licensed. See LICENSE.md

Development Setup

  • Install Git and Node.js if you don't already have them installed.
  • Clone the repository.
  • Open a terminal in the project directory.
  • Run npm i to install dependencies.
  • Run npm start to start a live server and automatically recompile coffeescript on changes.

TODO

  • Improve layout on mobile / small viewport size

  • Fade out overlay when playing (unless viz is disabled), with a button to show info again?

    • But there's a fullscreen button now (for the viz), is that good enough?
  • Stress test the length of recording

  • Record + show aftertouch pressure

    • I don't have a keyboard that supports this.
  • Support Pitch Bend Range selection

    • How often is this sent? Probably only when you change it, if at all.
    • Might have to be a manual setting.
  • Record miscellaneous MIDI events, maybe even SysEx (optionally)?

    • It'd be nice if I could just take a MIDI stream and append it to a header to get a MIDI file, but it's probably a lot more complicated.
    • Probably want to drop SimpleMIDIInput to do this... altho if it gives the raw data for all events, maybe I don't need to.
  • Maybe allow scrolling back (pausing automatically (not pausing recording, just the view))

    • But the UI can also scroll, so how should you indicate to scroll the visualization versus the UI?
  • Color notes by channel or instrument?

    • Doesn't matter much with a single keyboard
  • Offline support with a service worker

    • Service workers are a serious footgun.
  • (Little visual bug: if zoomed out, opening recovery modal has a bad transition, the whole overlay flickers out for a bit)

About

🎹 The easiest way to record MIDI. No install. Automatically recording.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 65.7%
  • CoffeeScript 18.4%
  • HTML 11.9%
  • CSS 4.0%