From d6eb80d7485623e128361f942a8a7530e42abb22 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 28 Mar 2022 09:58:26 +0100 Subject: [PATCH 1/2] Allow sending and thumbnailing AVIF images --- src/utils/Image.ts | 3 ++- src/utils/blobs.ts | 1 + 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/utils/Image.ts b/src/utils/Image.ts index 57ed3eefa69..66d43b1ca48 100644 --- a/src/utils/Image.ts +++ b/src/utils/Image.ts @@ -17,7 +17,8 @@ import { arrayHasDiff } from "./arrays"; export function mayBeAnimated(mimeType: string): boolean { - return ["image/gif", "image/webp", "image/png", "image/apng"].includes(mimeType); + // AVIF animation support at the time of writing is only available in Chrome hence not having `blobIsAnimated` check + return ["image/gif", "image/webp", "image/png", "image/apng", "image/avif"].includes(mimeType); } function arrayBufferRead(arr: ArrayBuffer, start: number, len: number): Uint8Array { diff --git a/src/utils/blobs.ts b/src/utils/blobs.ts index 892920d51f7..9dea3d226c7 100644 --- a/src/utils/blobs.ts +++ b/src/utils/blobs.ts @@ -54,6 +54,7 @@ const ALLOWED_BLOB_MIMETYPES = [ 'image/png', 'image/apng', 'image/webp', + 'image/avif', 'video/mp4', 'video/webm', From dce405482773319072a15c9d1400d3dc8cba0b48 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 28 Mar 2022 10:12:57 +0100 Subject: [PATCH 2/2] Always include thumbnail for more esoteric image formats --- src/ContentMessages.ts | 23 ++++++++++++++--------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/src/ContentMessages.ts b/src/ContentMessages.ts index babe4563f73..e64d88120b6 100644 --- a/src/ContentMessages.ts +++ b/src/ContentMessages.ts @@ -249,15 +249,20 @@ async function infoForImageFile(matrixClient: MatrixClient, roomId: string, imag const result = await createThumbnail(imageElement.img, imageElement.width, imageElement.height, thumbnailType); const imageInfo = result.info; - // we do all sizing checks here because we still rely on thumbnail generation for making a blurhash from. - const sizeDifference = imageFile.size - imageInfo.thumbnail_info.size; - if ( - imageFile.size <= IMAGE_SIZE_THRESHOLD_THUMBNAIL || // image is small enough already - (sizeDifference <= IMAGE_THUMBNAIL_MIN_REDUCTION_SIZE && // thumbnail is not sufficiently smaller than original - sizeDifference <= (imageFile.size * IMAGE_THUMBNAIL_MIN_REDUCTION_PERCENT)) - ) { - delete imageInfo["thumbnail_info"]; - return imageInfo; + // For lesser supported image types, always include the thumbnail even if it is larger + if (!["image/avif", "image/webp"].includes(imageFile.type)) { + // we do all sizing checks here because we still rely on thumbnail generation for making a blurhash from. + const sizeDifference = imageFile.size - imageInfo.thumbnail_info.size; + if ( + // image is small enough already + imageFile.size <= IMAGE_SIZE_THRESHOLD_THUMBNAIL || + // thumbnail is not sufficiently smaller than original + (sizeDifference <= IMAGE_THUMBNAIL_MIN_REDUCTION_SIZE && + sizeDifference <= (imageFile.size * IMAGE_THUMBNAIL_MIN_REDUCTION_PERCENT)) + ) { + delete imageInfo["thumbnail_info"]; + return imageInfo; + } } const uploadResult = await uploadFile(matrixClient, roomId, result.thumbnail);