@@ -6,17 +6,24 @@ const jpegThumbnail = dataUrl => new Promise((resolve, reject) => {
6
6
7
7
const maxDimension = 96 ; // 3x the maximum displayed size of 32px
8
8
9
- if ( image . height > image . width ) {
10
- canvas . height = maxDimension ;
11
- canvas . width = ( maxDimension / image . height ) * image . width ;
9
+ if ( image . height < 1 || image . width < 1 ) {
10
+ canvas . width = canvas . height = maxDimension ;
11
+ // drawImage can fail if image height/width is less than 1
12
+ // Use blank image; the costume is too small to render anyway
13
+ ctx . fillStyle = 'white' ; // Create white background, since jpeg doesn't have transparency
14
+ ctx . fillRect ( 0 , 0 , maxDimension , maxDimension ) ;
12
15
} else {
13
- canvas . width = maxDimension ;
14
- canvas . height = ( maxDimension / image . width ) * image . height ;
16
+ if ( image . height > image . width ) {
17
+ canvas . height = maxDimension ;
18
+ canvas . width = ( maxDimension / image . height ) * image . width ;
19
+ } else {
20
+ canvas . width = maxDimension ;
21
+ canvas . height = ( maxDimension / image . width ) * image . height ;
22
+ }
23
+ ctx . fillStyle = 'white' ;
24
+ ctx . fillRect ( 0 , 0 , canvas . width , canvas . height ) ;
25
+ ctx . drawImage ( image , 0 , 0 , canvas . width , canvas . height ) ;
15
26
}
16
-
17
- ctx . fillStyle = 'white' ; // Create white background, since jpeg doesn't have transparency
18
- ctx . fillRect ( 0 , 0 , canvas . width , canvas . height ) ;
19
- ctx . drawImage ( image , 0 , 0 , canvas . width , canvas . height ) ;
20
27
resolve ( canvas . toDataURL ( 'image/jpeg' , 0.92 /* quality */ ) ) ; // Default quality is 0.92
21
28
} ;
22
29
image . onerror = err => {
0 commit comments