Commit 886ccc7f authored by Matija Obreza's avatar Matija Obreza
Browse files

Merge branch '106-placeholder-photo' into 'master'

Resolve "Placeholder photo"

Closes #106

See merge request genesys-pgr/genesys-ui!98
parents e1da1b88 163581ae
......@@ -31,6 +31,7 @@ const style = (theme) => ({
mediaImage: {
// maxHeight: '100%',
minWidth: '100%',
maxWidth: '100%',
width: 'auto' as 'auto',
height: 'auto' as 'auto',
position: 'absolute' as 'absolute',
......@@ -46,12 +47,26 @@ const CropImage = ({classes, crop}: { classes: any, crop: CropDetails}) => {
// console.log(`renderImage`, crop);
const hasCover = crop.covers && crop.covers.length > 0;
const image = hasCover ? crop.covers[0] : null;
const thumbSizes: number[] = [ 200, 300, 600 ];
let x: string = '';
let sizes: string = '';
if (image) {
for (const size of thumbSizes) {
x += `/proxy/uploads/d/_thumbs${image.thumbnailPath}/${size}x${size}.png ${size}w, `;
}
sizes += `(max-width: 600px) 200px, `;
sizes += `(min-width: 1800px) 600px, `;
sizes += `300px`;
// x += `/proxy/uploads/d${image.storagePath} ${image.width}w`;
// sizes += `${image.width}px`;
}
return (
<div className={ classes.media }>
{ hasCover &&
<img className={ classes.mediaImage } srcSet={ `/proxy/uploads/d/_thumbs${image.thumbnailPath}/200x200.png 1x, /proxy/uploads/d${image.storagePath} 4x` }
src={ `/proxy/uploads/d${image.storagePath}` } alt={ crop.name } /> }
<img className={ classes.mediaImage } srcSet={ x } sizes={ sizes }
src={ `/proxy/uploads/d/_thumbs${image.thumbnailPath}/300x300.png` } alt={ crop.name } /> }
{ !hasCover &&
<img className={ classes.mediaImage } src={ `images/crop-placeholder.jpg` } alt={ crop.name } />
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment