Function applyTrackInfoToPanel

static/js/catalog.js:400–479

(track)

}

function applyTrackInfoToPanel(track) {
  titleEl.textContent = track.title || "Untitled track";
  bpmChip.textContent = track.bpm ? `${track.bpm} BPM` : "— BPM";
  keyChip.textContent = track.key || "— —";
  updateFooterTrack({
    title: track.title,
    thumbnail: track.thumb,
    key: track.key,
    bpm: track.bpm,
    stemCount: (track.audioStems || track.stems || []).filter((s) => (s.name ?? s) !== "original").length || null,
  });
  applyStemPresenceCards(track.stemPresence);

  const summaryKey = document.getElementById("summary-key");
  const summaryBpm = document.getElementById("summary-bpm");
  const summaryScale = document.getElementById("summary-scale");
  const summaryScaleName = document.getElementById("summary-scale-name");
  const summaryConfidence = document.getElementById("summary-confidence");
  const summaryConfidenceLabel = document.getElementById("summary-confidence-label");
  const summaryLufs = document.getElementById("summary-lufs");
  const summaryPeak = document.getElementById("summary-peak");
  const summaryDuration = document.getElementById("summary-duration");

  if (summaryKey) summaryKey.textContent = track.key || "—";
  if (summaryBpm) summaryBpm.textContent = track.bpm ? String(track.bpm) : "—";
  if (summaryScale) summaryScale.textContent = track.scale || "";
  if (summaryScaleName) summaryScaleName.textContent = track.scale || "—";
  if (summaryLufs) summaryLufs.textContent = track.lufs != null ? Number(track.lufs).toFixed(1) : "—";
  if (summaryPeak) summaryPeak.textContent = track.peakDb != null ? `Peak ${Number(track.peakDb).toFixed(1)} dB` : "";
  if (summaryDuration) summaryDuration.textContent = track.duration ? fmtTime(track.duration) : "—";

  const trackExtracted = document.getElementById("track-extracted");
  const trackSource = document.getElementById("track-source");
  const trackQuality = document.getElementById("track-quality");
  const favBtn = document.getElementById("fav-btn");
  if (trackExtracted) trackExtracted.textContent = fmtExtracted(track.createdAt);
  if (trackSource) trackSource.textContent = deriveSource(track.sourceUrl);
  if (trackQuality) trackQuality.textContent = deriveQuality(track.sourceUrl);
  if (favBtn) {
    favBtn.classList.toggle("active", Boolean(track.favorite));
    favBtn.setAttribute("aria-pressed", String(Boolean(track.favorite)));
    favBtn.onclick = () => {
      if (!_currentTrackId) return;
      const t = tracks[_currentTrackId];
      if (!t) return;
      t.favorite = !t.favorite;
      favBtn.classList.toggle("active", t.favorite);
      favBtn.setAttribute("aria-pressed", String(t.favorite));
      saveState();
    };
  }

  const summaryDr = document.getElementById("summary-dr");
  const summaryDrLabel = document.getElementById("summary-dr-label");
  const summaryStability = document.getElementById("summary-stability");
  const summaryStabilityLabel = document.getElementById("summary-stability-label");
  if (summaryDr) summaryDr.textContent = track.dynamicRange != null ? String(track.dynamicRange) : "—";
  if (summaryDrLabel) summaryDrLabel.textContent = track.dynamicRange != null ? drLabel(track.dynamicRange) : "";