diff options
| author | HJ <30-hj@users.noreply.git.pleroma.social> | 2022-02-20 15:11:33 +0000 |
|---|---|---|
| committer | HJ <30-hj@users.noreply.git.pleroma.social> | 2022-02-20 15:11:33 +0000 |
| commit | ddee8bb686fb18baf5212089653a8b4e40feedd6 (patch) | |
| tree | e200f269c3f8faca1f502cf416f0841126b52d9b /src/components/media_modal/media_modal.js | |
| parent | 56616787ec1b8373e5c160c6fe863694a66ca2db (diff) | |
| parent | befd4d5fc787d3f8287456dbf5d1a6c70419591f (diff) | |
Merge branch 'proper-attachments' into 'develop'
Attachment improvements
See merge request pleroma/pleroma-fe!1399
Diffstat (limited to 'src/components/media_modal/media_modal.js')
| -rw-r--r-- | src/components/media_modal/media_modal.js | 38 |
1 files changed, 32 insertions, 6 deletions
diff --git a/src/components/media_modal/media_modal.js b/src/components/media_modal/media_modal.js index e7384c93..b8bce730 100644 --- a/src/components/media_modal/media_modal.js +++ b/src/components/media_modal/media_modal.js @@ -3,22 +3,31 @@ 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' +import Flash from 'src/components/flash/flash.vue' import { library } from '@fortawesome/fontawesome-svg-core' import { faChevronLeft, - faChevronRight + faChevronRight, + faCircleNotch } from '@fortawesome/free-solid-svg-icons' library.add( faChevronLeft, - faChevronRight + faChevronRight, + faCircleNotch ) const MediaModal = { components: { StillImage, VideoAttachment, - Modal + Modal, + Flash + }, + data () { + return { + loading: false + } }, computed: { showing () { @@ -27,6 +36,9 @@ const MediaModal = { media () { return this.$store.state.mediaViewer.media }, + description () { + return this.currentMedia.description + }, currentIndex () { return this.$store.state.mediaViewer.currentIndex }, @@ -37,7 +49,7 @@ const MediaModal = { return this.media.length > 1 }, type () { - return this.currentMedia ? fileTypeService.fileType(this.currentMedia.mimetype) : null + return this.currentMedia ? this.getType(this.currentMedia) : null } }, created () { @@ -53,6 +65,9 @@ const MediaModal = { ) }, methods: { + getType (media) { + return fileTypeService.fileType(media.mimetype) + }, mediaTouchStart (e) { GestureService.beginSwipe(e, this.mediaSwipeGestureRight) GestureService.beginSwipe(e, this.mediaSwipeGestureLeft) @@ -67,15 +82,26 @@ const MediaModal = { goPrev () { if (this.canNavigate) { const prevIndex = this.currentIndex === 0 ? this.media.length - 1 : (this.currentIndex - 1) - this.$store.dispatch('setCurrent', this.media[prevIndex]) + const newMedia = this.media[prevIndex] + if (this.getType(newMedia) === 'image') { + this.loading = true + } + this.$store.dispatch('setCurrentMedia', newMedia) } }, goNext () { if (this.canNavigate) { const nextIndex = this.currentIndex === this.media.length - 1 ? 0 : (this.currentIndex + 1) - this.$store.dispatch('setCurrent', this.media[nextIndex]) + const newMedia = this.media[nextIndex] + if (this.getType(newMedia) === 'image') { + this.loading = true + } + this.$store.dispatch('setCurrentMedia', newMedia) } }, + onImageLoaded () { + this.loading = false + }, handleKeyupEvent (e) { if (this.showing && e.keyCode === 27) { // escape this.hide() |
