pleroma-fe

commit: acb788d5756cbc0db3e57370cd2449a8c888c719
parent: 74cf60109417b7480f62010567d5aa8cbb797ef9
Author: Shpuld Shpludson <shp@cock.li>
Date:   Thu,  8 Aug 2019 10:10:58 +0000

Merge branch '631' into 'develop'

Hide image block in rich media preview in case of broken image

Closes #631

See merge request pleroma/pleroma-fe!902
Diffstat:
M
src/components/link-preview/link-preview.js
14
++++++++++++++
M
src/components/link-preview/link-preview.vue
2
+-

2 files changed, 15 insertions(+), 1 deletion(-)
diff --git a/src/components/link-preview/link-preview.js b/src/components/link-preview/link-preview.js
@@ -5,6 +5,11 @@ const LinkPreview = {
     'size',
     'nsfw'
   ],
+  data () {
+    return {
+      imageLoaded: false
+    }
+  },
   computed: {
     useImage () {
       // Currently BE shoudn't give cards if tagged NSFW, this is a bit paranoid
@@ -15,6 +20,15 @@ const LinkPreview = {
     useDescription () {
       return this.card.description && /\S/.test(this.card.description)
     }
+  },
+  created () {
+    if (this.useImage) {
+      const newImg = new Image()
+      newImg.onload = () => {
+        this.imageLoaded = true
+      }
+      newImg.src = this.card.image
+    }
   }
 }
 
diff --git a/src/components/link-preview/link-preview.vue b/src/components/link-preview/link-preview.vue
@@ -7,7 +7,7 @@
       rel="noopener"
     >
       <div
-        v-if="useImage"
+        v-if="useImage && imageLoaded"
         class="card-image"
         :class="{ 'small-image': size === 'small' }"
       >