From 4c32aaf1b5ceb16ca2524a0b8b42cf5a795d1d53 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rn-Michael=20Miehe?= <jmm@yavook.de>
Date: Wed, 15 May 2019 02:05:53 +0200
Subject: [PATCH] Card Image lazy load

---
 frontend/src/components/Card.vue | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/Card.vue b/frontend/src/components/Card.vue
index 17f8be1..0674b74 100644
--- a/frontend/src/components/Card.vue
+++ b/frontend/src/components/Card.vue
@@ -1,6 +1,6 @@
 <template>
   <v-list-tile avatar>
-    <v-tooltip bottom>
+    <v-tooltip @input="booted = true" bottom>
       <template v-slot:activator="{ on }">
         <v-list-tile-avatar :color="color" v-on="on">
           <span class="headline font-weight-bold white--text">
@@ -8,7 +8,13 @@
           </span>
         </v-list-tile-avatar>
       </template>
-      <v-img :src="ffiurl" :height="300" :width="0.715 * 300" contain />
+      <v-img
+        v-if="booted"
+        :src="ffiurl"
+        :height="300"
+        :width="0.715 * 300"
+        contain
+      />
     </v-tooltip>
 
     <v-list-tile-content>
@@ -32,6 +38,10 @@ export default {
     dbentry: Object
   },
 
+  data: () => ({
+    booted: false
+  }),
+
   computed: {
     color() {
       switch (this.dbentry.element.toLowerCase()) {