Register static paths, add progress, MCP support

- Register separated/ and .separated/ as Gradio static paths for direct audio stem serving
- Update process_video_with_progress to yield progress and HTML using gr.Progress
- Add progress_callback to download_audio and separate_tracks
- Use AudioGallery._build_html and as_posix() for audio URLs
- Launch demo with mcp_server=True and allowed_paths for MCP integration
- Update docs and build instructions for new UI flow and server setup

CLAUDE.md

@@ -45,9 +45,11 @@ been indexed. Workflow:
 ```
 app.py
  ├── SEPARATED_DIR = Path("separated").resolve()
+ ├── gr.set_static_paths(paths=["separated/", ".separated/"])
  ├── _footer_html()               → modules/version_info.versions_html()
  ├── process_video(video_id)      → MCP-exposed tool (simple, no progress)
- ├── process_video_with_progress(video_id)  → UI handler (returns html, status)
+ ├── process_video_with_progress(video_id)  → UI handler (yields html, status)
+ │    ├── progress=gr.Progress(track_tqdm=True)
  │    ├── modules.yt_audio_get_tracks.download_audio(url, id, progress_callback)
  │    ├── modules.yt_audio_get_tracks.separate_tracks(wav, id, progress_callback)
  │    └── AudioGallery._build_html(audio_urls, labels, columns)
@@ -86,6 +88,9 @@ emitted by `modules/yt_audio_get_tracks.py`.
 
 Button triggers `process_video_with_progress` → outputs `[audio_output, progress_output]`.
 
+The app registers `separated/` and `.separated/` as Gradio static paths so the
+generated stem files can be served from the local output folder.
+
 ---
 
 ## Progress Callback Pattern

README.md

@@ -17,6 +17,9 @@ short_description: Separate tracks from a mixed audio
 
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
-# Track Separate
+# SeparateTracks
+
+Download audio from YouTube, separate it into instrument stems with Demucs,
+and view the results in a Gradio AudioGallery UI with MCP support.
 
 

specs/build.md

@@ -121,11 +121,12 @@ CMD ["python", "app.py"]
   - `process_video(video_id)` — simple, MCP-exposed tool (returns HTML only)
   - `process_video_with_progress(video_id)` — UI handler (returns `(html, status_text)`)
 - UI: Video ID input + button → Progress textbox (6 lines) → AudioGallery HTML → footer
+- UI handler uses `progress=gr.Progress(track_tqdm=True)` for interactive progress
 - Button wired to `process_video_with_progress` → `[audio_output, progress_output]`
 - `demo.launch(mcp_server=True, allowed_paths=[str(SEPARATED_DIR)])`
-- Audio URLs: `/file={Path(p).resolve()}` format for Gradio file serving
-- Progress support can use `progress=gr.Progress(track_tqdm=True)` so the
-  handler can surface interactive progress while the stem pipeline runs.
+- Audio URLs: `/file={Path(p).as_posix()}` format for Gradio file serving
+- `gr.set_static_paths(paths=["separated/", ".separated/"])` registers local
+  output folders for direct Gradio serving
 
 ---
 
@@ -142,6 +143,9 @@ CMD ["python", "app.py"]
 - `data-initialized="false"` guard prevents double event binding on Gradio re-renders
 - Called in `app.py` via `AudioGallery._build_html(...)` directly (not full instantiation)
 
+> Note: the time display is client-side and comes from the `<audio>` element's
+> metadata/runtime duration, not from the URL string.
+
 Also created: `modules/AudioGallery.pyi` — type stub
 
 ---