From 6d03d7828cd908fa8b9f3e65e8aed75aaf50ddbd Mon Sep 17 00:00:00 2001
From: lesion <lesion@autistici.org>
Date: Thu, 28 Apr 2022 23:28:54 +0200
Subject: [PATCH] hasMedia  / mediaPreview webp

---
 pages/add/MediaInput.vue | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/pages/add/MediaInput.vue b/pages/add/MediaInput.vue
index 1489ee66..825430c4 100644
--- a/pages/add/MediaInput.vue
+++ b/pages/add/MediaInput.vue
@@ -11,12 +11,15 @@
                 @mouseup='handleStop' @touchend='handleStop'
               )
               div.focalPoint(:style="{ top, left }")
-              img(v-if='mediaPreview' :src='mediaPreview')
+              picture(v-if='hasMedia')
+                source(:srcset='mediaPreview("webp")')
+                img(:src='mediaPreview("jpg")')
 
             v-col.col-12.col-sm-4
               p {{$t('event.choose_focal_point')}}
-              img.mediaPreview.d-none.d-sm-block(v-if='mediaPreview'
-                :src='mediaPreview' :style="{ 'object-position': position }")
+              picture(v-if='hasMedia')
+                source(:srcset='mediaPreview("webp")')
+                img.mediaPreview.d-none.d-sm-block(:src='mediaPreview("jpg")' :style="{ 'object-position': position }")              
 
               v-textarea.mt-4(type='text'
                 label='Alternative text'
@@ -29,12 +32,12 @@
                 v-btn(text @click='openMediaDetails=false' color='warning') Cancel
                 v-btn(text color='primary' @click='save') Save
 
-    h3.mb-3.font-weight-regular(v-if='mediaPreview') {{$t('common.media')}}
-    v-card-actions(v-if='mediaPreview')
+    h3.mb-3.font-weight-regular(v-if='hasMedia') {{$t('common.media')}}
+    v-card-actions(v-if='hasMedia')
       v-spacer
       v-btn(text color='primary' @click='openMediaDetails = true') {{$t('common.edit')}}
       v-btn(text color='error' @click='remove') {{$t('common.remove')}}
-    div.col-12.ml-3(v-if='mediaPreview')
+    div.col-12.ml-3(v-if='hasMedia')
       picture
         source(:srcset='mediaPreview("webp")')
         img.mediaPreview(:src='mediaPreview("jpg")' :style="{ 'object-position': savedPosition }")
@@ -67,6 +70,9 @@ export default {
     }
   },
   computed: {
+    hasMedia () {
+      return (this.value.url || this.value.image)
+    },
     top () {
       return ((this.focalpoint[1] + 1) * 50) + '%'
     },