Function openTrack

static/mobile/app.js:207–284

(card, { autoplay = false } = {})

// Load a track: fetch detail, build lanes, spin up the Web Audio engine.
async function openTrack(card, { autoplay = false } = {}) {
  state.tab = "mixer";
  state.current = { ...card, detail: null, loading: true, error: null };
  state.playing = false;
  state.progress = 0;
  state.speed = 1.0;
  render();

  if (engine) { engine.destroy(); engine = null; engineTrackId = null; }
  engineReady = false;
  const token = ++engineToken;
  pendingPlay = autoplay;

  let detail;
  try {
    const res = await fetch(`/api/jobs/${card.id}`, { cache: "no-store" });
    if (!res.ok) throw new Error(`GET /api/jobs/${card.id} -> ${res.status}`);
    detail = await res.json();
  } catch (e) {
    if (token !== engineToken) return;
    console.warn("[mobile] track detail failed:", e);
    state.current.loading = false;
    state.current.error = "Couldn't load this track.";
    render();
    return;
  }
  if (token !== engineToken) return;

  // Use WAV stems with range-request chunking (chunkedAudioEngine.js): fetches
  // 10-second windows at a time, so the first audio starts after ~7 MB instead
  // of the full file, and peak RAM stays around 28 MB regardless of track length.
  const laneList = (detail.stems || [])
    .filter((s) => s && s.name !== "original" && s.url)
    .map((s, i) => ({ name: s.name, url: s.url, ...stemMeta(s.name, i) }));

  state.vols = {};
  state.muted = {};
  state.solo = {};
  for (const l of laneList) state.vols[l.name] = 1;

  state.current.detail = {
    duration: detail.duration || 0,
    lanes: laneList,
    hasVideo: !!detail.has_video,
    analysis: extractAnalysis(detail, laneList),
  };
  state.current.loading = false;
  state.current.stemCount = laneList.length;

  if (!laneList.length) {
    state.current.error = "This track has no playable stems yet.";
    render();
    return;
  }

  const engineOpts = {
    onTime: onEngineTime,
    onEnded: () => { state.playing = false; render(); },