naomiaro / waveform-playlist
Multitrack Web Audio editor and player with canvas waveform preview. Set cues, fades and shift multiple tracks in time. Record audio tracks or provide audio annotations. Export your mix to AudioBuffer or WAV! Add effects from Tone.js. Project inspired by Audacity.
View on GitHubAI Architecture Analysis
This repository is indexed by RepoMind. By analyzing naomiaro/waveform-playlist in our AI interface, you can instantly generate complete architecture diagrams, visualize control flows, and perform automated security audits across the entire codebase.
Our Agentic Context Augmented Generation (Agentic CAG) engine loads full source files into context on-demand, avoiding the fragmentation of traditional RAG systems. Ask questions about the architecture, dependencies, or specific features to see it in action.
Embed this Badge
Showcase RepoMind's analysis directly in your repository's README.
Repository Overview (README excerpt)
Crawler viewWaveform Playlist A multi-track audio editor and player built with React, Tone.js, and the Web Audio API. Features canvas-based waveform visualization, drag-and-drop clip editing, and professional audio effects. Features • **Multi-track editing** - Multiple clips per track with drag-to-move and trim • **Waveform visualization** - Canvas-based rendering with zoom controls • **20+ audio effects** - Reverb, delay, filters, distortion, and more via Tone.js • **Recording** - AudioWorklet-based recording with live waveform preview • **Export** - WAV export with effects, individual tracks or full mix • **Annotations** - Time-synced text annotations with keyboard navigation • **Theming** - Full theme customization with dark/light mode support • **MIDI playback** - MIDI file parsing with piano roll visualization and SoundFont sample playback • **TypeScript** - Full type definitions included Quick Start > **Note**: and are peer dependencies and must be installed separately. and are transitive dependencies of . Documentation • **Live Examples** - Interactive demos • **Getting Started** - Installation and basic usage • **Guides** - In-depth tutorials • **API Reference** - Component and hook documentation Examples | Example | Description | |---------|-------------| | Stem Tracks | Multi-track playback with mute/solo/volume controls | | Effects | 20 Tone.js effects with real-time parameter control | | Recording | Live recording with VU meter and waveform preview | | Multi-Clip | Drag-and-drop clip editing with trim handles | | Annotations | Time-synced text with keyboard navigation | | Waveform Data | Pre-computed peaks for fast loading | | MIDI | MIDI file playback with piano roll and SoundFont samples | Packages | Package | Description | |---------|-------------| | | Main React components, hooks, and context | | | Types, utilities, and clip/track creation | | | Framework-agnostic timeline engine with pure operations | | | Styled UI components (buttons, sliders, etc.) | | | Tone.js audio engine | | | Peak extraction from AudioBuffer or sample arrays | | | Audio loaders | **Optional packages:** | Package | Description | |---------|-------------| | | MIDI file parsing, piano roll visualization, and SoundFont playback | | | Time-synced text annotations with drag editing | | | AudioWorklet recording with live waveform preview (requires setup) | | | Shared AudioWorklet processors for metering and recording (auto-installed with recording) | | | Spectrogram visualization with FFT worker | | | HTMLMediaElement-based playout with pitch-preserving playback rate | Web Components (Experimental) provides framework-agnostic Web Components for multi-track audio editing — no React required. Built with Lit, wrapping the same engine and Tone.js adapter. Run the examples locally: Then open — example pages: • — Basic playback with timescale and file drop • — Multi-clip editing with move, trim, and split • — Recording with overdub Key Hooks Browser Support Requires Web Audio API support: Chrome, Firefox, Safari, Edge (modern versions). See Can I Use: Web Audio API Development Visit http://localhost:3000/waveform-playlist to see the examples. Books Currently writing: Mastering Tone.js Credits Originally created for the Airtime project at Sourcefabric. License MIT License Sponsors Become a sponsor