Add card placeholder images
This commit is contained in:
parent
b3d95f765c
commit
1f232fa4da
5 changed files with 15 additions and 5 deletions
|
@ -636,7 +636,11 @@ const normalizeAlbum = (item: JFAlbum, server: ServerListItem, imageSize?: numbe
|
||||||
duration: item.RunTimeTicks / 10000000,
|
duration: item.RunTimeTicks / 10000000,
|
||||||
genres: item.GenreItems?.map((entry) => ({ id: entry.Id, name: entry.Name })),
|
genres: item.GenreItems?.map((entry) => ({ id: entry.Id, name: entry.Name })),
|
||||||
id: item.Id,
|
id: item.Id,
|
||||||
imagePlaceholderUrl: null,
|
imagePlaceholderUrl: getAlbumCoverArtUrl({
|
||||||
|
baseUrl: server.url,
|
||||||
|
item,
|
||||||
|
size: 1,
|
||||||
|
}),
|
||||||
imageUrl: getAlbumCoverArtUrl({
|
imageUrl: getAlbumCoverArtUrl({
|
||||||
baseUrl: server.url,
|
baseUrl: server.url,
|
||||||
item,
|
item,
|
||||||
|
|
|
@ -466,7 +466,13 @@ const normalizeAlbum = (item: NDAlbum, server: ServerListItem, imageSize?: numbe
|
||||||
size: imageSize || 300,
|
size: imageSize || 300,
|
||||||
});
|
});
|
||||||
|
|
||||||
const imagePlaceholderUrl = imageUrl?.replace(/size=\d+/, 'size=50') || null;
|
const imagePlaceholderUrl = getCoverArtUrl({
|
||||||
|
baseUrl: server.url,
|
||||||
|
coverArtId: item.coverArtId,
|
||||||
|
credential: server.credential,
|
||||||
|
size: 1,
|
||||||
|
});
|
||||||
|
|
||||||
const imageBackdropUrl = imageUrl?.replace(/size=\d+/, 'size=1000') || null;
|
const imageBackdropUrl = imageUrl?.replace(/size=\d+/, 'size=1000') || null;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -151,7 +151,7 @@ export const AlbumCard = ({
|
||||||
animationDuration={0.3}
|
animationDuration={0.3}
|
||||||
height={size}
|
height={size}
|
||||||
imgStyle={{ objectFit: 'cover' }}
|
imgStyle={{ objectFit: 'cover' }}
|
||||||
placeholder="var(--card-default-bg)"
|
placeholder={data?.imagePlaceholderUrl || 'var(--card-default-bg)'}
|
||||||
src={data?.imageUrl}
|
src={data?.imageUrl}
|
||||||
width={size}
|
width={size}
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -158,7 +158,7 @@ export const DefaultCard = ({
|
||||||
animationDuration={0.3}
|
animationDuration={0.3}
|
||||||
height={cardSize}
|
height={cardSize}
|
||||||
imgStyle={{ objectFit: 'cover' }}
|
imgStyle={{ objectFit: 'cover' }}
|
||||||
placeholder="var(--card-default-bg)"
|
placeholder={data?.imagePlaceholderUrl || 'var(--card-default-bg)'}
|
||||||
src={data?.imageUrl}
|
src={data?.imageUrl}
|
||||||
width={cardSize}
|
width={cardSize}
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -153,7 +153,7 @@ export const PosterCard = ({
|
||||||
animationDuration={0.3}
|
animationDuration={0.3}
|
||||||
height={sizes.itemWidth}
|
height={sizes.itemWidth}
|
||||||
importance="auto"
|
importance="auto"
|
||||||
placeholder="var(--card-default-bg)"
|
placeholder={data?.imagePlaceholderUrl || 'var(--card-default-bg)'}
|
||||||
src={data?.imageUrl}
|
src={data?.imageUrl}
|
||||||
width={sizes.itemWidth}
|
width={sizes.itemWidth}
|
||||||
/>
|
/>
|
||||||
|
|
Reference in a new issue