@namespace DeepDrftPublic.Client.Controls

@* Full-page background waveform for a Mix release. Deliberately NOT the player-bar peak-bar idiom
   (SpectrumVisualizer / LevelMeterFab own that): this renders a single continuous mirrored
   silhouette filling the viewport behind the detail content. Fetches its own datum from
   api/release/{id}/mix/waveform. The played portion is washed with the progress overlay driven by
   PlaybackPosition; the click-to-seek seam (OnSeek + bindable PlaybackPosition) is wired here for a
   future wave even though click handling does not ship yet. *@

<div class="mix-waveform-bg @(_profile is null ? "mix-waveform-bg--empty" : null)">
    @if (_profile is not null)
    {
        <svg class="mix-waveform-svg"
             viewBox="0 0 @ViewBoxWidth 100"
             preserveAspectRatio="none"
             role="img"
             aria-label="Waveform">
            <defs>
                <clipPath id="@_clipId">
                    <path d="@_silhouettePath" />
                </clipPath>
            </defs>

            @* Base silhouette. *@
            <path d="@_silhouettePath" class="mix-waveform-fill" />

            @* Played-portion wash: a full-height rect clipped to the silhouette, width tracking
               PlaybackPosition. Clamped to [0, 1]. *@
            <rect x="0" y="0"
                  width="@(ClampedPosition * ViewBoxWidth)" height="100"
                  class="mix-waveform-played"
                  clip-path="url(#@_clipId)" />
        </svg>
    }
</div>