feat(theater): full-screen detail body, eased content collapse, playing-release scoping
Detail bodies fill 100vh below the nav so the visualizer reads full-screen; Theater toggle eases page content and the player-bar now-showing panel in/out instead of popping (reduced-motion honored); Theater only applies to the currently-playing release.
This commit is contained in:
@@ -37,6 +37,10 @@ else
|
||||
var hasYear = release.ReleaseDate is not null;
|
||||
var firstTrack = ViewModel.Tracks.Count > 0 ? ViewModel.Tracks[0] : null;
|
||||
|
||||
@* Full-screen content body (Phase 20 Wave 2 §1): the scaffold has no Class param, so a thin wrapper
|
||||
carries the min-height. dd-detail-fill keeps the body >= viewport height (below the nav) so the
|
||||
ambient visualizer reads full-screen and the site footer is pushed below the fold. *@
|
||||
<div class="dd-detail-fill">
|
||||
<ReleaseDetailScaffold Title="@release.Title"
|
||||
Artist="@release.Artist"
|
||||
Track="@firstTrack"
|
||||
@@ -58,17 +62,19 @@ else
|
||||
controls over the experience, not release content, so both stay in Theater Mode (§4/OQ4).
|
||||
Wrapped so they cluster on the right rather than spreading across the SpaceBetween row. *@
|
||||
<div class="dd-detail-top-actions">
|
||||
<TheaterModeToggle />
|
||||
@* Theater toggle only appears when this Cut is the currently-playing release (Phase 20
|
||||
Wave 2 §3). ShowTheaterToggle folds in the subsystem gate + the release-playing check. *@
|
||||
<TheaterModeToggle Available="ShowTheaterToggle" />
|
||||
@* Lava-lamp icon → popover panel (full parity, §3d-revised). Sits top-right across from the
|
||||
back link, clear of the header's own Play/Share affordances below. *@
|
||||
<WaveformVisualizerControlPopover />
|
||||
</div>
|
||||
</TopRightAction>
|
||||
<Header>
|
||||
@* Theater Mode (Phase 20 §4): the release content is removed from the render — not
|
||||
CSS-hidden — so the visualizer fills the surface. OFF restores it byte-for-byte. *@
|
||||
@if (!VisualizerControlState.TheaterMode)
|
||||
{
|
||||
@* Theater Mode (Phase 20 §4, Wave 2 §2): the release content stays mounted and eases out via
|
||||
a collapsing wrapper so it does not pop — IsContentHidden collapses it to zero height when
|
||||
Theater is on AND this Cut is the playing release. OFF eases it back to its normal layout. *@
|
||||
<div class="dd-theater-collapsible @(IsContentHidden ? "dd-theater-collapsed" : null)">
|
||||
@* Header split: meta + Play/Share on the LEFT, bordered cover on the RIGHT (spec §3.1). *@
|
||||
<div class="cut-detail-header">
|
||||
<div class="cut-detail-meta">
|
||||
@@ -127,11 +133,11 @@ else
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</Header>
|
||||
<BodyContent>
|
||||
@if (!VisualizerControlState.TheaterMode)
|
||||
{
|
||||
@* Theater Mode (Wave 2 §2): eased collapse, mirroring the Header region. *@
|
||||
<div class="dd-theater-collapsible @(IsContentHidden ? "dd-theater-collapsed" : null)">
|
||||
@* Blurb sits between the header and the track-list divider. *@
|
||||
<ReleaseDescription Description="@release.Description" />
|
||||
<MudDivider Class="cut-detail-divider" />
|
||||
@@ -162,13 +168,14 @@ else
|
||||
}
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</BodyContent>
|
||||
</ReleaseDetailScaffold>
|
||||
</div>
|
||||
}
|
||||
|
||||
@code {
|
||||
[CascadingParameter] public IStreamingPlayerService? PlayerService { get; set; }
|
||||
// PlayerService is cascaded by CutDetailBase (used there for the Theater release-playing predicate).
|
||||
[CascadingParameter] public IQueueService? Queue { get; set; }
|
||||
|
||||
// Header Play: load the full album into the queue starting at track 0.
|
||||
|
||||
Reference in New Issue
Block a user