Support inline images in the timeline

Change-Id: I4af76058b400e9a0bf7c10e4ad98b7c7fb5015c1

FEATURES.md

@@ -29,6 +29,7 @@ Here you can find some extra features and changes compared to Element Android (w
 - Compose area: emoji button on the left, attachments button on the right (flipped compared to Element, but what most other messengers do, thus more familiar to most users)
 - Setting to re-alert for new messages even if there's still an old notification for that room
 - Setting to hide start call buttons from the room's toolbar
+- Render inline images / custom emojis in the timeline
 
 - Branding (name, app icon, links)
 - Show a toast instead of a snackbar after copying text, in order to not block the input area right after copying

dependencies.gradle

@@ -98,6 +98,7 @@ ext.libs = [
         markwon     : [
                 'core'                   : "io.noties.markwon:core:$markwon",
                 'extLatex'               : "io.noties.markwon:ext-latex:$markwon",
+                'imageGlide'             : "io.noties.markwon:image-glide:$markwon",
                 'inlineParser'           : "io.noties.markwon:inline-parser:$markwon",
                 'html'                   : "io.noties.markwon:html:$markwon"
         ],

vector/build.gradle

@@ -412,6 +412,7 @@ dependencies {
     implementation 'me.gujun.android:span:1.7'
     implementation libs.markwon.core
     implementation libs.markwon.extLatex
+    implementation libs.markwon.imageGlide
     implementation libs.markwon.inlineParser
     implementation libs.markwon.html
     implementation 'com.googlecode.htmlcompressor:htmlcompressor:1.5.2'

vector/src/main/java/im/vector/app/features/html/EventHtmlRenderer.kt

@@ -18,9 +18,14 @@ package im.vector.app.features.html
 
 import android.content.Context
 import android.content.res.Resources
+import android.graphics.drawable.Drawable
 import android.text.Spannable
 import androidx.core.text.toSpannable
+import com.bumptech.glide.Glide
+import com.bumptech.glide.RequestBuilder
+import com.bumptech.glide.request.target.Target
 import im.vector.app.R
+import im.vector.app.core.di.ActiveSessionHolder
 import im.vector.app.core.resources.ColorProvider
 import im.vector.app.core.utils.DimensionConverter
 import im.vector.app.features.settings.VectorPreferences
@@ -33,6 +38,8 @@ import io.noties.markwon.PrecomputedFutureTextSetterCompat
 import io.noties.markwon.ext.latex.JLatexMathPlugin
 import io.noties.markwon.ext.latex.JLatexMathTheme
 import io.noties.markwon.html.HtmlPlugin
+import io.noties.markwon.image.AsyncDrawable
+import io.noties.markwon.image.glide.GlideImagesPlugin
 import io.noties.markwon.inlineparser.MarkwonInlineParserPlugin
 import org.commonmark.node.Node
 import timber.log.Timber
@@ -43,6 +50,7 @@ import javax.inject.Singleton
 class EventHtmlRenderer @Inject constructor(
         private val htmlConfigure: MatrixHtmlPluginConfigure,
         private val context: Context,
+        private val activeSessionHolder: ActiveSessionHolder,
         private val vectorPreferences: VectorPreferences
 ) {
 
@@ -68,7 +76,23 @@ class EventHtmlRenderer @Inject constructor(
                                     .codeBackgroundColor(codeBlockBackground)
                                     .blockQuoteColor(quoteBarColor)
                         }
+                    },
+                    GlideImagesPlugin.create(object: GlideImagesPlugin.GlideStore {
+                        override fun load(drawable: AsyncDrawable): RequestBuilder<Drawable> {
+                            val url = drawable.destination
+                            if (url.startsWith("mxc://")) {
+                                val contentUrlResolver = activeSessionHolder.getActiveSession().contentUrlResolver()
+                                val imageUrl = contentUrlResolver.resolveFullSize(url)
+                                return Glide.with(context).load(imageUrl)
                             }
+                            // We don't want to support other url schemes here, so just return a request for null
+                            return Glide.with(context).load(null as String?)
+                        }
+
+                        override fun cancel(target: Target<*>) {
+                            Glide.with(context).clear(target)
+                        }
+                    })
             ))
             .apply {
                 if (vectorPreferences.latexMathsIsEnabled()) {