Function wireUpAudio

static/js/player.js:767–1127

(jobId, stems, duration, thumbnail, mixUrl = null, title = "", peaksPromise = null, hasVideo = false)

}

export function wireUpAudio(jobId, stems, duration, thumbnail, mixUrl = null, title = "", peaksPromise = null, hasVideo = false) {
  const app = document.querySelector(".app");
  app?.classList.remove("is-import");
  app?.classList.remove("no-track");
  setWaveformLoading(true);
  stopVuLoop();
  stopStemVuLoop();
  if (multitrack) {
    multitrack.destroy();
    setMultitrack(null);
  }
  playBtn.classList.remove("playing");
  stopBtn.classList.remove("stopped");
  visualRenderToken += 1;
  const token = visualRenderToken;
  window.setTimeout(() => {
    const el = document.getElementById("waveLoadingOverlay");
    if (token === visualRenderToken && el && !el.classList.contains("hidden")) {
      el.classList.add("stalled");
    }
  }, 20000);
  window.setTimeout(() => {
    if (token === visualRenderToken) setWaveformLoading(false);
  }, 60000);
  setCurrentJobId(jobId);
  setTotalDuration(duration || 0);
  refreshMixerVisuals();
  const mixReady = loadMixIntoState(jobId, stems.map((s) => s.name))
    .then(() => { if (currentJobId === jobId) refreshMixerVisuals(); })
    .catch((e) => { console.warn("[player] mix state load failed:", e); });
  setLaneControlsEnabled(true);
  setLoopEnabled(false);
  setLoopStart(0);
  setLoopEnd(0);
  loopBtn.classList.remove("active");
  loopRegionEl.classList.add("hidden");

  // User-selected stems only. Backend produced all 6, but the import-
  // page toggles tell us which ones the user actually wanted to see.
  // Filter early so multitrack, decoded-visuals, energy baseline, and
  // mini-waves all operate on the trimmed set. The synthetic "original"
  // track always passes the filter -- the user wants the full song
  // available alongside the isolated stems for A/B comparison. (When
  // the user selected all 6 stems, the backend doesn't produce
  // original.wav, so it's simply not in `stems` and the mixer/sidebar
  // rows for it stay hidden.)
  stems = stems.filter((s) => s.name === "original" || selectedStems.has(s.name));
  _currentStems = stems;
  _mixUrl = mixUrl || null;
  _currentTitle = title || "";
  _currentHasVideo = !!hasVideo;
  document.getElementById("footer-export-wrap")?.classList.toggle("has-video", !!hasVideo);
  applyStemSelectionFilter(new Set(stems.map((s) => s.name)));
  updateFooterTrack({ thumbnail, stemCount: stems.filter((s) => s.name !== "original").length });

  // Reset footer waveform state — will be re-populated below after peaks fetch.
  _footerWavePeaks = null;
  setFooterWaveDrawFn(null);