From: Dessalines Date: Fri, 5 Jun 2020 01:40:57 +0000 (-0400) Subject: Fixing webp issue for safari. X-Git-Url: http://these/git/%7B%60https:/%7B%60css/themes/%22https:/nerdica.net/%7BdocsUrl%7D?a=commitdiff_plain;h=ee32072489bd818294a8b300f8ca2beaf23640bc;p=lemmy.git Fixing webp issue for safari. --- diff --git a/ui/src/utils.ts b/ui/src/utils.ts index 190fcf57..cb56ba58 100644 --- a/ui/src/utils.ts +++ b/ui/src/utils.ts @@ -423,7 +423,7 @@ export function objectFlip(obj: any) { export function pictshareAvatarThumbnail(src: string): string { // sample url: http://localhost:8535/pictshare/gs7xuu.jpg let split = src.split('pictshare'); - let out = `${split[0]}pictshare/webp/96${split[1]}`; + let out = `${split[0]}pictshare/${canUseWebP() ? 'webp/' : ''}96${split[1]}`; return out; } @@ -448,7 +448,9 @@ export function pictshareImage( hash = split[1]; } - let out = `${root}/webp/${thumbnail ? '192/' : ''}${hash}`; + let out = `${root}/${canUseWebP() ? 'webp/' : ''}${ + thumbnail ? '192/' : '' + }${hash}`; return out; } @@ -859,3 +861,18 @@ export function previewLines(text: string, lines: number = 3): string { .slice(0, lines * 2) .join('\n'); } + +function canUseWebP() { + var elem = document.createElement('canvas'); + + if (!!(elem.getContext && elem.getContext('2d'))) { + var testString = !(window.mozInnerScreenX == null) ? 'png' : 'webp'; + // was able or not to get WebP representation + return ( + elem.toDataURL('image/webp').startsWith('data:image/' + testString) + ); + } + + // very old browser like IE 8, canvas not supported + return false; +}