diff --git a/core/src/main/assets/web/export_template.html b/core/src/main/assets/web/export_template.html
index fe5b3c2c..79522c87 100644
--- a/core/src/main/assets/web/export_template.html
+++ b/core/src/main/assets/web/export_template.html
@@ -1,295 +1,362 @@
-
+
-
-
-
-
+
-
-
+ const imageTag = document.createElement("img")
+ imageTag.src = originalMediaUrl
+ imageTag.classList.add("chat_media")
+ mediaContainer.appendChild(imageTag)
+
+ imageTag.onerror = () => {
+ mediaContainer.removeChild(imageTag)
+ const mediaTag = document.createElement(message.type === "NOTE" ? "audio" : "video")
+ mediaTag.classList.add("chat_media")
+ mediaTag.src = originalMediaUrl
+ mediaTag.preload = "metadata"
+ mediaTag.controls = true
+ mediaContainer.appendChild(mediaTag)
+ }
+
+ const overlay = document.querySelector('.media-OVERLAY_' + mediaKey)
+ if (!overlay) {
+ return
+ }
+
+ const overlayImage = document.createElement("img")
+ overlayImage.src = decodeMedia(overlay)
+ overlayImage.classList.add("chat_media")
+ overlayImage.classList.add("overlay_media")
+ mediaContainer.appendChild(overlayImage)
+ })
+ })
+
+ let fetched = false
+
+ new IntersectionObserver(entries => {
+ if (!fetched && entries[0].isIntersecting === true) {
+ fetched = true
+ messageContainer.innerHTML = ""
+ observers.forEach(c => {
+ try {
+ c()
+ } catch (e) {
+ console.log(e)
+ }
+ })
+ }
+ }).observe(messageContainer)
+ }
+
+ return messageContainer
+ })(document.createElement("div")))
+
+ document.querySelector('main').appendChild(messageObject)
+ })
+ }
+
+ makeHeader()
+ makeMain()
+
+