Function updateLoopRegionVisual

static/js/transport.js:146–167

()

}

export function updateLoopRegionVisual() {
  const regionItem = document.getElementById("t-export-region");
  const hasRegion = loopEnabled && totalDuration > 0 && loopEnd > loopStart;
  if (regionItem) regionItem.setAttribute("aria-disabled", String(!hasRegion));
  // Keep the engine's loop bounds in sync with every loop change (toggle/drag);
  // the engine wraps playback itself off these values. No-op on streaming path.
  audioEngine?.setLoop(loopEnabled, loopStart, loopEnd);
  if (!loopEnabled || !totalDuration) {
    loopRegionEl.classList.add("hidden");
    return;
  }
  ensureLoopRegionParent();
  // Keep the loop overlay in the same normalized timeline coordinate
  // system as the ruler ticks. Percentages avoid CSS zoom mismatch:
  // pointer coordinates and getBoundingClientRect() are visual pixels,
  // but style.left/style.width in px are unzoomed layout pixels.
  const startPct = Math.max(0, Math.min(100, (loopStart / totalDuration) * 100));
  const endPct = Math.max(0, Math.min(100, (loopEnd / totalDuration) * 100));
  loopRegionEl.style.left = `${startPct}%`;
  loopRegionEl.style.width = `${Math.max(0, endPct - startPct)}%`;
  loopRegionEl.classList.remove("hidden");
}

// Standard DAW transport state machine:
//   [stopped]  (paused at start)  ─Play→  [playing]