WaveRoll Solo

A lightweight VS Code extension for viewing and playing MIDI files with an interactive piano roll visualization.

Built on top of WaveRoll - an interactive JavaScript library for MIDI piano roll visualization.

Features

• Piano Roll Visualization: View MIDI files as an interactive piano roll display powered by the wave-roll library
• Audio Playback: Play MIDI files directly in VS Code using Tone.js synthesis
• Tempo Control: Adjust playback tempo with an interactive tempo control
• MIDI Export: Export MIDI files with modified tempo settings
• Format Support: Supports .mid and .midi file extensions

Installation

1. Open VS Code or supported IDEs that support VS Code extensions (e.g. Cursor, etc.)
2. Go to Extensions
3. Search for "WaveRoll Solo"
4. Click Install

Or install directly from the VS Code Marketplace. or Open VSX

Usage

1. Open any .mid or .midi file in VS Code
2. The file will automatically open in the WaveRoll Solo viewer
3. Use the player controls to interact with the MIDI file

Controls

• Play/Pause: Start or pause MIDI playback
• Stop: Stop playback and reset to beginning
• Tempo: Click the BPM badge to adjust playback tempo
• Export: Export MIDI with the current tempo setting

Related Projects

• WaveRoll Library: GitHub | NPM
• Web Demo: https://crescent-stdio.github.io/wave-roll/
• Standalone Demo: https://crescent-stdio.github.io/wave-roll/standalone.html

Tech Stack

• wave-roll: Interactive piano roll rendering engine for comparative MIDI visualization
• Tone.js: Web Audio synthesis framework
• @tonejs/midi: MIDI file parsing
• esbuild: Fast JavaScript bundler

License

MIT