README

About

This is the official Wails Svelte-TS template.

Live Development

To run in live development mode, run wails dev in the project directory. This will run a Vite development

server that will provide very fast hot reload of your frontend changes. If you want to develop in a browser

and have access to your Go methods, there is also a dev server that runs on http://localhost:34115. Connect

to this in your browser, and you can call your Go code from devtools.

Building

To build a redistributable, production mode package, use wails build.

Features

• Metronome
  • 4/4 time signature - Time signature selector: dropdown or input fields (numerator/denominator)
  • 1/4, 1/8, 1/16, 1/32 note signatures - Note subdivision selector: dropdown or button group
  • BPM +/- - BPM control: numeric input/stepper or slider with +/- buttons, display current BPM
  • Alternative time signatures - Expanded time signature selector with common presets
  • Configurable sounds - Sound configuration: modal/panel with sound sample selector and volume control
  • Play/Pause button: toggle control to start/stop metronome
  • Visual beat indicator: flashing/pulsing element synchronized with clicks
• User profiles
  • Save settings per-profile - Settings panel: per-profile configuration options
  • Save configuration per-profile - Profile-specific settings storage
  • Profile switcher: dropdown in header/sidebar showing current profile
  • Profile management button: opens modal for create/edit/delete profiles
  • Profile creation form: input for profile name, optional avatar/icon
  • Profile list: shows all profiles with edit/delete actions
• Beats practice
  • Create new beats practice views
    • Upload a patterns PDF - Upload zone: drag-and-drop area for PDF patterns
    • Upload backing tracks - Backing track uploader: file picker with multi-file support
      • Define BPMs per track (auto-infer) - BPM auto-detection display: shows detected BPM with option to override
      • Play a sample of the uploaded track - Track list: table/cards with mini audio player for preview playback
    • Preview PDF being uploaded - PDF preview: embedded viewer showing uploaded pattern
    • Track list: shows uploaded tracks with track name, auto-detected BPM (editable), preview player, delete/edit buttons
    • Save/Create button: finalizes the practice view
  • Select from uploaded and available beat patterns - Pattern selector: grid/list of available beat patterns with thumbnails
  • Visualize PDF of the beat pattern(s) - PDF viewer: large embedded viewer for selected pattern
  • Set available BPMs for the track - BPM selector: dropdown or slider showing available BPMs for current track
  • Toggleable track and metronome - Audio controls: track on/off toggle, metronome on/off toggle
  • Play track and metronome beat - Audio controls: Play/Pause toggle, track volume slider, metronome volume slider
    • Configure metronome beat sound from metronome settings - Link to metronome sound configuration
  • Track progress and maintain a practice journal
    • Track BPM performed - Practice log form: modal/sidebar with BPM field (auto-filled from session)
    • Track time spent playing - Session timer: displays current practice session duration
    • Request input for beat pattern practiced (optional) - Practice log form: pattern selector and notes/comments textarea
    • Quick save button: one-click to log session
    • Session history list: chronological list of past sessions
  • Statistics
    • Time spent per beat - Time breakdown chart: bar/pie chart showing time per beat pattern
    • Total time spent practicing - Total practice time: large display widget (hours/minutes)
    • BPM progression graph: line chart showing BPM improvement over time per pattern
    • Date range selector: filter statistics by time period
    • Pattern performance cards: individual cards per pattern showing total time, BPM range, last practiced date, progress trend
• Global UI Elements
  • Main navigation: sidebar or top nav with sections for Metronome, Practice, Statistics, Profiles
  • Settings gear icon: access to global and profile-specific settings
  • Current profile indicator: always visible in header
  • Help/info tooltips: context-sensitive guidance for complex features