Add genial.ly block to modal

client/src/components/FullscreenInfographic.vue

@@ -7,11 +7,13 @@
 <script>
   import Modal from '@/components/Modal';
   import InfogramBlock from '@/components/content-blocks/InfogramBlock';
+  import GeniallyBlock from '@/components/content-blocks/GeniallyBlock';
 
   export default {
     components: {
       Modal,
-      InfogramBlock
+      InfogramBlock,
+      GeniallyBlock
     },
 
     computed: {

client/src/components/content-blocks/GeniallyBlock.vue

@@ -12,6 +12,7 @@
               scrolling="yes"
               allownetworking="all"></iframe>
     </div>
+    <a class="genially-block__link" @click="openFullscreen">Fullscreen</a>
   </div>
 </template>
 
@@ -23,6 +24,15 @@
       src() {
         return `https://view.genial.ly/${this.value.id}`;
       }
+    },
+
+    methods: {
+      openFullscreen() {
+        this.$store.dispatch('showFullscreenInfographic', {
+          id: this.value.id,
+          type: 'genially-block'
+        });
+      }
     }
   }
 </script>
@@ -46,5 +56,9 @@
       width: 100%;
       height: 100%;
     }
+
+    &__link {
+      cursor: pointer;
+    }
   }
 </style>