Fix animated webp playback (#8120)

* fix: add webp as playable image type

* fix: make glide transformations optional to prevent rendering webp throwing exception

* fix: stop marking webp as playable by default

* fix: play animated Webp in attachment view

* feat: autoplay webp if autoplay is enabled

---------

Signed-off-by: Alex Maras <dev@alexmaras.com>
Co-authored-by: Jorge Martín <jorgem@element.io>

changelog.d/8120.feature

@@ -0,0 +1 @@
+Marks WebP files as Animated and allows them to play

matrix-sdk-android/src/main/java/org/matrix/android/sdk/api/util/MimeTypes.kt

@@ -30,6 +30,7 @@ object MimeTypes {
     const val BadJpg = "image/jpg"
     const val Jpeg = "image/jpeg"
     const val Gif = "image/gif"
+    const val Webp = "image/webp"
 
     const val Ogg = "audio/ogg"
 

vector/src/main/java/im/vector/app/features/home/room/detail/timeline/factory/MessageItemFactory.kt

@@ -528,6 +528,8 @@ class MessageItemFactory @Inject constructor(
         )
 
         val playable = messageContent.mimeType == MimeTypes.Gif
+        // don't show play button because detecting animated webp isn't possible via mimetype
+        val playableIfAutoplay = playable || messageContent.mimeType == MimeTypes.Webp
 
         return MessageImageVideoItem_()
                 .attributes(attributes)
@@ -549,7 +551,7 @@ class MessageItemFactory @Inject constructor(
                         }
                     }
                 }.apply {
-                    if (playable && vectorPreferences.autoplayAnimatedImages()) {
+                    if (playableIfAutoplay && vectorPreferences.autoplayAnimatedImages()) {
                         mode(ImageContentRenderer.Mode.ANIMATED_THUMBNAIL)
                     }
                 }

vector/src/main/java/im/vector/app/features/media/DataAttachmentRoomProvider.kt

@@ -49,7 +49,7 @@ class DataAttachmentRoomProvider(
         return getItem(position).let {
             when (it) {
                 is ImageContentRenderer.Data -> {
-                    if (it.mimeType == MimeTypes.Gif) {
+                    if (it.mimeType == MimeTypes.Gif || it.mimeType == MimeTypes.Webp) {
                         AttachmentInfo.AnimatedImage(
                                 uid = it.eventId,
                                 url = it.url ?: "",

vector/src/main/java/im/vector/app/features/media/ImageContentRenderer.kt

@@ -135,7 +135,7 @@ class ImageContentRenderer @Inject constructor(
                     if (mode == Mode.ANIMATED_THUMBNAIL) it
                     else it.dontAnimate()
                 }
-                .transform(cornerTransformation)
+                .optionalTransform(cornerTransformation)
                 .into(imageView)
     }
 
@@ -167,7 +167,7 @@ class ImageContentRenderer @Inject constructor(
         }
 
         req
-                .fitCenter()
+                .optionalFitCenter()
                 .into(target)
     }
 
@@ -211,7 +211,7 @@ class ImageContentRenderer @Inject constructor(
                 return false
             }
         })
-                .fitCenter()
+                .optionalFitCenter()
                 .into(imageView)
     }
 

vector/src/main/java/im/vector/app/features/media/RoomEventsAttachmentProvider.kt

@@ -71,7 +71,7 @@ class RoomEventsAttachmentProvider(
                         allowNonMxcUrls = it.root.sendState.isSending()
 
                 )
-                if (content.mimeType == MimeTypes.Gif) {
+                if (content.mimeType == MimeTypes.Gif || content.mimeType == MimeTypes.Webp) {
                     AttachmentInfo.AnimatedImage(
                             uid = it.eventId,
                             url = content.url ?: "",