Music Trainer is a web-based practice workspace with synchronized documents, media/web references, and structured audio practice tools.
Version: V9.0.0
Features include:
- V2 UI: Side-rail navigation with overlay drawer for library and media controls
- Document Viewer for PDF and ABC notation files with filetype badges
- ABC rendering and playback controls for notation practice (notation and playback transpose)
- Media drawer with dedicated panels for Visual (video/image/web) and Audio playback
- Advanced A/B Loop System: set loop points, save labeled loops per audio file, adjustable gap time
- Audio Player with native HTML5 controls, speed adjustment, and transport controls
- Visual media support: images, native HTML5 video, YouTube embeds, Spotify embeds
- Practice timers: session timer and multiple lesson timers with draggable panels
- ARIA-compliant navigation with proper screen reader support
- Focus-trapped modal dialogs for improved accessibility
- Smart file explorer: auto-opens when needed with contextual filtering
- Keyboard navigation support across panes and file lists
- Data-driven top menu and lesson/resource linking
Music Trainer is a focused, musician-first practice environment built on Hugo and modern browser media tools.
New in V9.0.0
- Accessibility Improvements
- Complete ARIA compliance: all menu items now have proper
role="menuitem" for screen reader support - Focus trap added to About dialog for true modal behavior
- Library drawer now correctly marked as
aria-modal="true" matching its focus-trap behavior - Initialization guard prevents duplicate About dialog setup
- Enhanced File Explorer UX
- Auto-opens when media drawer opened without content loaded
- Automatically filters to relevant files (audio/visual) based on drawer type
- Smart triggering: only on initial open or mode change, not on toggles
- Code Quality
- Removed dead CSS selectors improving maintainability
- Improved code organization across templates and scripts
Current Feature Set
- V2 UI Architecture: Side-rail navigation with overlay drawers for clean, focused practice workspace
- Document Viewer: Load PDFs and ABC notation files with automatic filetype detection and badges
- ABC Notation: Render and play ABC files with notation transpose, playback transpose, tempo control, and loop
- Media Drawer: Dedicated panels for Visual (video/image/web) and Audio with context-specific controls
- Advanced Audio Practice: Native HTML5 audio with A/B loops, labeled loop library, gap timing, speed control
- Visual Media: Support for images, native HTML5 video, YouTube embeds, and Spotify embeds
- Practice Timers: Session timer and draggable lesson timers to track focused practice time
- MIDI Playback: Conditional vendor loading for MIDI file support
- Data-Driven Organization: Menu configuration and resource catalogs for structured lesson navigation
- Keyboard Navigation: Efficient keyboard controls across panes and file lists