From 348d6664eb07d4854ad4266873ad423091658187 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Fri, 18 Oct 2019 07:05:01 -0400
Subject: refactor all kind of modals using the modal component

---
 src/components/media_modal/media_modal.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

(limited to 'src/components/media_modal/media_modal.js')

diff --git a/src/components/media_modal/media_modal.js b/src/components/media_modal/media_modal.js
index 992d7129..4832abda 100644
--- a/src/components/media_modal/media_modal.js
+++ b/src/components/media_modal/media_modal.js
@@ -1,11 +1,13 @@
 import StillImage from '../still-image/still-image.vue'
 import VideoAttachment from '../video_attachment/video_attachment.vue'
+import Modal from '../modal/modal.vue'
 import fileTypeService from '../../services/file_type/file_type.service.js'
 
 const MediaModal = {
   components: {
     StillImage,
-    VideoAttachment
+    VideoAttachment,
+    Modal
   },
   computed: {
     showing () {
-- 
cgit v1.2.3-70-g09d2


From f66026bf20638662ab50b3982337fe69a8171cf3 Mon Sep 17 00:00:00 2001
From: Wyatt Benno <wyattbenno@gmail.com>
Date: Fri, 8 Nov 2019 06:16:26 +0000
Subject: Lightbox/modal multi image improvements - #381

---
 src/components/media_modal/media_modal.js  | 21 +++++++++++++++++++++
 src/components/media_modal/media_modal.vue | 22 +++++++++++-----------
 2 files changed, 32 insertions(+), 11 deletions(-)

(limited to 'src/components/media_modal/media_modal.js')

diff --git a/src/components/media_modal/media_modal.js b/src/components/media_modal/media_modal.js
index 4832abda..abb18c7d 100644
--- a/src/components/media_modal/media_modal.js
+++ b/src/components/media_modal/media_modal.js
@@ -2,6 +2,7 @@ import StillImage from '../still-image/still-image.vue'
 import VideoAttachment from '../video_attachment/video_attachment.vue'
 import Modal from '../modal/modal.vue'
 import fileTypeService from '../../services/file_type/file_type.service.js'
+import GestureService from '../../services/gesture_service/gesture_service'
 
 const MediaModal = {
   components: {
@@ -29,7 +30,27 @@ const MediaModal = {
       return this.currentMedia ? fileTypeService.fileType(this.currentMedia.mimetype) : null
     }
   },
+  created () {
+    this.mediaSwipeGestureRight = GestureService.swipeGesture(
+      GestureService.DIRECTION_RIGHT,
+      this.goPrev,
+      50
+    )
+    this.mediaSwipeGestureLeft = GestureService.swipeGesture(
+      GestureService.DIRECTION_LEFT,
+      this.goNext,
+      50
+    )
+  },
   methods: {
+    mediaTouchStart (e) {
+      GestureService.beginSwipe(e, this.mediaSwipeGestureRight)
+      GestureService.beginSwipe(e, this.mediaSwipeGestureLeft)
+    },
+    mediaTouchMove (e) {
+      GestureService.updateSwipe(e, this.mediaSwipeGestureRight)
+      GestureService.updateSwipe(e, this.mediaSwipeGestureLeft)
+    },
     hide () {
       this.$store.dispatch('closeMediaViewer')
     },
diff --git a/src/components/media_modal/media_modal.vue b/src/components/media_modal/media_modal.vue
index 2597f4e3..49e3143e 100644
--- a/src/components/media_modal/media_modal.vue
+++ b/src/components/media_modal/media_modal.vue
@@ -8,6 +8,8 @@
       v-if="type === 'image'"
       class="modal-image"
       :src="currentMedia.url"
+      @touchstart.stop="mediaTouchStart"
+      @touchmove.stop="mediaTouchMove"
     >
     <VideoAttachment
       v-if="type === 'video'"
@@ -41,18 +43,16 @@
 .modal-view.media-modal-view {
   z-index: 1001;
 
-  &:hover {
-    .modal-view-button-arrow {
-      opacity: 0.75;
+  .modal-view-button-arrow {
+    opacity: 0.75;
 
-      &:focus,
-      &:hover {
-        outline: none;
-        box-shadow: none;
-      }
-      &:hover {
-        opacity: 1;
-      }
+    &:focus,
+    &:hover {
+      outline: none;
+      box-shadow: none;
+    }
+    &:hover {
+      opacity: 1;
     }
   }
 }
-- 
cgit v1.2.3-70-g09d2