add demo preset system with sample track

- backend/routers/presets.py: new endpoints GET /api/presets and POST /api/preset/{name}
- loads stems + MIDI from backend/presets/{name}/ into a session (no upload needed)
- .gitignore exception + LFS tracking for preset WAV files
- frontend dropdown on upload screen to select and load a demo preset

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

.gitattributes

@@ -33,3 +33,4 @@ saved_model/**/* filter=lfs diff=lfs merge=lfs -text
 *.zip filter=lfs diff=lfs merge=lfs -text
 *.zst filter=lfs diff=lfs merge=lfs -text
 *tfevents* filter=lfs diff=lfs merge=lfs -text
+backend/presets/**/*.wav filter=lfs diff=lfs merge=lfs -text

.gitignore

@@ -37,6 +37,9 @@ frontend/build/
 *.mp3
 *.flac
 
+# Exception: preset demo files should be committed (via LFS)
+!backend/presets/**/*.wav
+
 # Testing
 .pytest_cache/
 .coverage

backend/main.py

@@ -8,7 +8,7 @@ from fastapi import FastAPI
 from fastapi.middleware.cors import CORSMiddleware
 from fastapi.staticfiles import StaticFiles
 
-from .routers import upload_router, detection_router, processing_router, stems_router, generation_router
+from .routers import upload_router, detection_router, processing_router, stems_router, generation_router, presets_router
 from .models.session import cleanup_old_sessions
 
 
@@ -62,6 +62,7 @@ app.include_router(detection_router, prefix="/api", tags=["detection"])
 app.include_router(processing_router, prefix="/api", tags=["processing"])
 app.include_router(stems_router, prefix="/api", tags=["stems"])
 app.include_router(generation_router, prefix="/api", tags=["generation"])
+app.include_router(presets_router, prefix="/api", tags=["presets"])
 
 
 # Health check endpoint

backend/presets/sample-track/bass.wav

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:34d0bf1999390c1846ec635d7d13f719f12235dd0c3b43aff37c978defd20166
+size 70893820

backend/presets/sample-track/click_record.wav

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:436b475a472014349fe08f7acee5916bf17d1ff475471b6f04b45e1cf3f67233
+size 70893820

backend/presets/sample-track/drums.wav

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:536d1b91df21e93ca9f1f1352da5b70f64e6b0b8ac884e7ef794122f63183cfd
+size 70893820

backend/presets/sample-track/guitar.wav

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:8ed112603fd68bed8a61c290b9ca36fcecee998b085eb283a21e127df0b2bc9e
+size 70893820

backend/presets/sample-track/synth.wav

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:ba8a34d85b65a69e09ba0a319136bba8c9d92a6e0fa10e9dc3770d6e26d25a49
+size 70893820

backend/routers/__init__.py

@@ -5,6 +5,7 @@ from .detection import router as detection_router
 from .processing import router as processing_router
 from .stems import router as stems_router
 from .generation import router as generation_router
+from .presets import router as presets_router
 
 __all__ = [
     "upload_router",
@@ -12,4 +13,5 @@ __all__ = [
     "processing_router",
     "stems_router",
     "generation_router",
+    "presets_router",
 ]

backend/routers/presets.py

@@ -0,0 +1,99 @@
+"""Presets router — load pre-committed demo stems into a session."""
+
+from pathlib import Path
+
+import io
+import numpy as np
+import soundfile as sf
+import mido
+from fastapi import APIRouter, HTTPException
+
+from ..models.session import create_session, StemData
+from ..models.schemas import UploadResponse
+from ..utils.audio_utils import normalize
+
+router = APIRouter()
+
+PRESETS_DIR = Path(__file__).parent.parent / "presets"
+STEM_NAMES = ['guitar', 'drums', 'bass', 'synth', 'click_record']
+
+
+@router.get("/presets")
+async def list_presets():
+    """List available demo presets."""
+    if not PRESETS_DIR.exists():
+        return {"presets": []}
+    presets = sorted(d.name for d in PRESETS_DIR.iterdir() if d.is_dir())
+    return {"presets": presets}
+
+
+@router.post("/preset/{preset_name}", response_model=UploadResponse)
+async def load_preset(preset_name: str):
+    """Load a pre-committed preset into a session (no upload needed)."""
+    preset_dir = PRESETS_DIR / preset_name
+    if not preset_dir.exists():
+        raise HTTPException(status_code=404, detail=f"Preset '{preset_name}' not found")
+
+    stems = {}
+    sample_rates = []
+
+    for stem_name in STEM_NAMES:
+        wav_path = preset_dir / f"{stem_name}.wav"
+        if not wav_path.exists():
+            continue
+        audio, sr = sf.read(str(wav_path))
+        audio = audio.astype(np.float32)
+        if audio.ndim == 2:
+            audio = np.mean(audio, axis=1).astype(np.float32)
+        stems[stem_name] = StemData(name=stem_name, audio=audio, sample_rate=sr)
+        sample_rates.append(sr)
+
+    if not stems:
+        raise HTTPException(status_code=404, detail=f"No WAV stems found in preset '{preset_name}'")
+
+    # Load MIDI files from preset folder
+    midi_data = None
+    midi_files = sorted(preset_dir.glob("*.mid")) + sorted(preset_dir.glob("*.midi"))
+    if midi_files:
+        try:
+            if len(midi_files) == 1:
+                midi_data = mido.MidiFile(filename=str(midi_files[0]))
+            else:
+                midi_data = mido.MidiFile()
+                for midi_path in midi_files:
+                    temp = mido.MidiFile(filename=str(midi_path))
+                    for track in temp.tracks:
+                        midi_data.tracks.append(track)
+        except Exception as e:
+            print(f"Warning: could not load MIDI from preset '{preset_name}': {e}")
+
+    # Build session
+    session = create_session()
+    session.stems = stems
+    session.original_sr = sample_rates[0]
+    session.midi_data = midi_data
+
+    # Generate mix
+    max_length = max(len(s.audio) for s in stems.values())
+    mixed = np.zeros(max_length, dtype=np.float64)
+    for stem in stems.values():
+        audio = stem.audio
+        if len(audio) < max_length:
+            padded = np.zeros(max_length, dtype=np.float64)
+            padded[:len(audio)] = audio
+            mixed += padded
+        else:
+            mixed += audio
+    mixed = normalize(mixed.astype(np.float32), peak=0.95)
+    session.full_mix = StemData(name="generated_mix", audio=mixed, sample_rate=sample_rates[0])
+
+    duration_seconds = max_length / sample_rates[0]
+
+    return UploadResponse(
+        session_id=session.id,
+        stems=list(stems.keys()),
+        has_full_mix=False,
+        duration_seconds=round(duration_seconds, 2),
+        sample_rate=sample_rates[0],
+        has_midi=midi_data is not None
+    )

frontend/src/App.jsx

@@ -21,6 +21,7 @@ function App() {
     detect,
     process,
     generate,
+    loadPreset,
     clearError
   } = useSession()
 
@@ -166,6 +167,7 @@ function App() {
 
           <FileUpload
             onUpload={handleUpload}
+            onLoadPreset={loadPreset}
             loading={loading}
             error={error}
             onClearError={clearError}

frontend/src/components/FileUpload.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useCallback } from 'react'
+import React, { useState, useCallback, useEffect } from 'react'
 
 const STEM_TYPES = [
   { name: 'guitar', label: 'Guitar', icon: '🎸' },
@@ -8,7 +8,17 @@ const STEM_TYPES = [
   { name: 'click_record', label: 'Click Record', icon: '⏱️' }
 ]
 
-function FileUpload({ onUpload, loading, error, onClearError }) {
+function FileUpload({ onUpload, onLoadPreset, loading, error, onClearError }) {
+  const [presets, setPresets] = useState([])
+  const [selectedPreset, setSelectedPreset] = useState('')
+
+  useEffect(() => {
+    fetch('/api/presets')
+      .then(r => r.json())
+      .then(data => setPresets(data.presets || []))
+      .catch(() => {})
+  }, [])
+
   const [stems, setStems] = useState({
     guitar: null,
     drums: null,
@@ -85,6 +95,33 @@ function FileUpload({ onUpload, loading, error, onClearError }) {
     <div className="glass rounded-2xl p-6 animate-fade-in max-w-4xl mx-auto">
       <h2 className="text-xl font-semibold mb-6 text-center">Upload Your Stems</h2>
 
+      {/* Demo presets dropdown */}
+      {presets.length > 0 && (
+        <div className="mb-6 p-4 bg-gray-800/50 rounded-xl border border-gray-600">
+          <p className="text-sm text-gray-400 mb-3">Or try a demo track:</p>
+          <div className="flex gap-3">
+            <select
+              value={selectedPreset}
+              onChange={(e) => setSelectedPreset(e.target.value)}
+              disabled={loading}
+              className="flex-1 bg-gray-800 border border-gray-600 rounded-lg px-3 py-2 text-white text-sm focus:outline-none focus:border-primary-500"
+            >
+              <option value="">Select a demo...</option>
+              {presets.map(p => (
+                <option key={p} value={p}>{p}</option>
+              ))}
+            </select>
+            <button
+              onClick={() => selectedPreset && onLoadPreset(selectedPreset)}
+              disabled={loading || !selectedPreset}
+              className="px-4 py-2 rounded-lg text-sm font-medium transition-all disabled:bg-gray-700 disabled:text-gray-500 disabled:cursor-not-allowed bg-gradient-to-r from-primary-600 to-accent-600 hover:from-primary-500 hover:to-accent-500"
+            >
+              {loading ? 'Loading...' : 'Load'}
+            </button>
+          </div>
+        </div>
+      )}
+
       {/* Stem Upload Grid */}
       <div className="grid grid-cols-2 gap-4 mb-6">
         {STEM_TYPES.map(({ name, label, icon }) => (

frontend/src/hooks/useSession.js

@@ -147,6 +147,37 @@ export function useSession() {
     }
   }, [sessionId])
 
+  const loadPreset = useCallback(async (presetName) => {
+    setLoading(true)
+    setError(null)
+
+    try {
+      const uploadResponse = await fetch(`/api/preset/${presetName}`, { method: 'POST' })
+      if (!uploadResponse.ok) {
+        const data = await uploadResponse.json().catch(() => ({}))
+        throw new Error(data.detail || `Failed to load preset: ${uploadResponse.status}`)
+      }
+      const uploadData = await uploadResponse.json()
+      setSessionId(uploadData.session_id)
+      setStems(uploadData.stems)
+
+      const detectResponse = await fetch(`/api/detect/${uploadData.session_id}`, { method: 'POST' })
+      if (!detectResponse.ok) {
+        const data = await detectResponse.json().catch(() => ({}))
+        throw new Error(data.detail || `Detection failed: ${detectResponse.status}`)
+      }
+      const detectData = await detectResponse.json()
+      setDetection(detectData)
+
+      return { upload: uploadData, detection: detectData }
+    } catch (err) {
+      setError(err.message)
+      return null
+    } finally {
+      setLoading(false)
+    }
+  }, [])
+
   const generate = useCallback(async (regionStart, regionEnd, duration = 15.0, prompt = null) => {
     if (!sessionId) {
       setError('No session to generate')
@@ -196,6 +227,7 @@ export function useSession() {
     process,
     generate,
     getStems,
+    loadPreset,
     clearError
   }
 }