Redo everything in the MR

src/components/media_modal/media_modal.js

@@ -1,9 +1,11 @@
 import StillImage from '../still-image/still-image.vue'
+import VideoAttachment from '../video_attachment/video_attachment.vue'
 import fileTypeService from '../../services/file_type/file_type.service.js'
 
 const MediaModal = {
   components: {
-    StillImage
+    StillImage,
+    VideoAttachment
   },
   computed: {
     showing () {
@@ -17,9 +19,6 @@ const MediaModal = {
     },
     type () {
       return this.currentMedia ? fileTypeService.fileType(this.currentMedia.mimetype) : null
-    },
-    loopVideo () {
-      return this.$store.state.config.loopVideo
     }
   },
   created () {

src/components/media_modal/media_modal.vue

@@ -1,14 +1,13 @@
 <template>
   <div class="modal-view" v-if="showing" @click.prevent="hide">
     <img class="modal-image" v-if="type === 'image'" :src="currentMedia.url"></img>
-    <video
+    <VideoAttachment
       class="modal-image"
       v-if="type === 'video'"
-      :src="currentMedia.url"
-      @click.stop=""
-      controls autoplay
-      :loop="loopVideo">
-    </video>
+      :attachment="currentMedia"
+      :controls="true"
+      @click.stop.native="">
+    </VideoAttachment>
   </div>
 </template>
 
@@ -18,7 +17,7 @@
 @import '../../_variables.scss';
 
 .modal-view {
-  z-index: 1005;
+  z-index: 1000;
   position: fixed;
   width: 100vw;
   height: 100vh;