Studio — Scores

Web app for bands and musicians: browse songs, open sheet music (MusicXML), work with TAB, attach recordings, use a calendar and setlists, and use lightweight rehearsal tools (metronome, sections, teleprompter-style lyrics).

Scores render with OpenSheetMusicDisplay. Reference audio uses WaveSurfer.js. During playback, the score cursor follows the waveform with a simple linear mapping over cursor steps.

The UI is available in English and Spanish when the language selector is enabled.

Features

• Repertoire and song profiles
  • Song catalog with search and quick actions.
  • Song profile with lyrics, metadata, publishing status, relations (setlists/events/albums), and history.
  • Recording management with typed recordings: take, rehearsal, reference, master.
• Score and TAB workflow
  • MusicXML score rendering with zoom, cursor, section navigation, and rehearsal transport.
  • TAB support with visual grid editing, section-aware workflow, and score/TAB conversion.
  • Instrument-aware handling (guitar, bass, drums, keyboard) and lightweight simulation tools.
• Teleprompter and performance mode
  • Full-screen teleprompter for rehearsal/stage with section structure and readability controls.
  • Setlist stage mode with next/previous flow, transition notes, and performance-friendly navigation.
  • Lyrics formatting supports repeated sections for realistic live flow.
• Audio and playback
  • Song audio playback from uploads and linked YouTube URLs.
  • Persistent mini-player dock across SPA navigation.
  • Large audio upload path using multipart handling in the API.
• Calendar and planning
  • Monthly calendar with event types, schedule hints, iCal/webcal subscription, and setlist linking.
  • Advanced recurrence for event creation (daily/weekly/monthly, interval, count/until).
  • Series management including bulk edit and "from this event onward" updates.
• Albums and sessions
  • Album management with ordering, cover handling, and publish state.
  • Photo sessions module for visual material management.
• Members and permissions
  • Member management with role-aware permissions.
  • Multi-instrument member assignment and member-centric rehearsal behavior.
  • Optional Cloudflare Access integration for user provisioning and policy sync.
• Branding, social and media surfaces
  • Runtime branding/theme settings (name, title, theme, favicon, extended branding options).
  • Social page with embeddable Instagram viewer URL configurable from settings.
  • Videoclips page with local video uploads and linked YouTube viewers.
• Deployment and operations
  • Self-hosted Docker deployment assets and runtime configuration support.
  • Built-in docs for deployment, runbook, and release guidance.

Quick start

Requirements: Node.js 20 or newer. For persisted data (songs, calendar, setlists, etc.) you also need the Studio API (Flask, SQLite) under backend/—typically deployed behind the same origin as the SPA in production.

cp .env.example .env
# Edit .env: branding, VITE_PUBLIC_BASE / routes, VITE_API_BASE as needed.

npm install
npm run dev

• Production build: npm run build → static assets in dist/.
• Docker (full stack): from deploy/, copy deploy/.env.example to deploy/.env, then docker compose up -d --build. See docs/DOCKER.md.
• Static-only preview: use npm run preview for a quick local build preview.

Configuration variables are documented in .env.example and consumed in src/config.ts.

Access and Members

When Cloudflare Access integration is enabled in the API container (CF_ACCESS_*):

• Members can create users in Cloudflare Access (/access/users).
• Members can also synchronize the managed Access application policy allow-list (studio-members-managed by default).
• In practice, application access is governed by Access policy, not only by directory user creation.

If Cloudflare list/search endpoints are inconsistent in a tenant, use successful create responses (201) plus policy sync status in API responses (cf_policy_sync) as the source of truth.

Documentation

Resource	Contents
docs/README.md	Documentation index and scope.
docs/STACK.md	Frontend stack summary.
docs/DOCKER.md	Self-hosted Docker Compose.

License

This project is distributed under the PolyForm Noncommercial License 1.0.0. In short: recipients may use and modify the code for noncommercial purposes under those terms. Copyright holders of their own deployments or forks retain their commercialization rights for their own product; PolyForm restrictions apply to parties receiving the software under that license.

Community

Topic	Link
License	PolyForm Noncommercial 1.0.0
Issues/changes	Open a PR in this repository

This repository uses Dependabot for npm and Python dependency updates.

Treat .env and any API tokens as secrets: do not commit them. If something sensitive was ever pushed, rotate it and clean history before publishing a fork or mirror.