TheoryTracker

🎼 Try it right now on your browser!

This is a multi-track piano-roll-style song editor app with an emphasis on music theory, where notes and chords are color-coded according to the key, and some editing tools work diatonically.

The app can currently import .mid and its own .ttproj project files, which are in plain JSON format. It can currently export .ttproj files and render .wav files.

Several soundfonts are readily available from an online repository.

How to use

General usage:

• Use the middle or right mouse buttons to pan.

• Hold A to draw elements with the mouse.

• Right-click on an element to change its properties.

  • Do a long right-click for a context menu with more commands.

• Double-click on a note block to edit its notes.

  • Click on "Project Root" on the breadcrumb bar to exit note editing mode.

• Press Space to toggle playback starting from the cursor.

• Press Esc to rewind.

• Use Backspace to delete incrementally.

• Use Ctrl + Z to undo, and Ctrl + Y or Ctrl + Shift + Z to redo.

• Also use 1234567 to create notes and chords.

When elements are selected:

• Use ←→ to move.

  • Combine with Ctrl for faster movement.

• Use ↑↓ to change the pitch of notes, and the root of chords.

  • Combine with Ctrl to change pitch by octaves.
  • Combine with Shift to change pitch chromatically.

• Also use ,. to change pitch chromatically.

• Use Shift + ←→ to stretch.

• Hold Alt then drag with the mouse to duplicate.

• Press Enter to unselect all.

• Press Delete to delete.

• Use Ctrl + X, C, or V for the usual cut/copy/paste commands.

Building from source

Install npm dependencies with npm install, then perform a build with npm run build. You can also run npm run watch to work locally.

Then, run npm start or any other simple HTTP web server from the repository folder, and navigate to http://127.0.0.1.