ash/WebStudio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Split loaded track info out with separate selectors.

Browse source
This commit is contained in:
Matthew Stratford 2020-11-10 21:22:43 +00:00
parent e63535658b
commit 19ca99fbd2
No known key found for this signature in database
GPG key ID: 9E53C8B3F0B57395
1 changed files with 41 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
src/showplanner/Player.tsx
View file

@ -197,6 +197,46 @@ function TimingButtons({ id }: { id: number }) {
);
}
function LoadedTrackInfo({ id }: { id: number }) {
const dispatch = useDispatch();
const loadedItem = useSelector(
(state: RootState) => state.mixer.players[id].loadedItem
);
const loading = useSelector(
(state: RootState) => state.mixer.players[id].loading
);
const loadError = useSelector(
(state: RootState) => state.mixer.players[id].loadError
);
return (
<span className="card-title">
<strong>
{loadedItem !== null && loading === -1
? loadedItem.title
: loading !== -1
? `LOADING`
: loadError
? "LOAD FAILED"
: "No Media Selected"}
</strong>
<small
className={
"border rounded border-danger text-danger p-1 m-1" +
(loadedItem !== null &&
loading === -1 &&
"clean" in loadedItem &&
!loadedItem.clean
? ""
: " d-none")
}
>
Explicit
</small>
</span>
);
}
export function Player({ id }: { id: number }) {
// Define time remaining (secs) when the play icon should flash.
const SECS_REMAINING_WARNING = 20;
@ -307,30 +347,7 @@ export function Player({ id }: { id: number }) {
</div>
{proMode && <ProModeButtons channel={id} />}
<div className="card-body p-0">
<span className="card-title">
<strong>
{playerState.loadedItem !== null && playerState.loading === -1
? playerState.loadedItem.title
: playerState.loading !== -1
? `LOADING`
: playerState.loadError
? "LOAD FAILED"
: "No Media Selected"}
</strong>
<small
className={
"border rounded border-danger text-danger p-1 m-1" +
(playerState.loadedItem !== null &&
playerState.loading === -1 &&
"clean" in playerState.loadedItem &&
!playerState.loadedItem.clean
? ""
: " d-none")
}
>
Explicit
</small>
</span>
<LoadedTrackInfo id={id} />
<br />
<span className="text-muted">
{playerState.loadedItem !== null && playerState.loading === -1