Commit 951f2570 authored by Shpuld Shpludson's avatar Shpuld Shpludson

Merge branch '572-multiple-file-drag-and-drop' into 'develop'

MediaUpload: Allow drag-and-drop of multiple files at once

Closes #572

See merge request pleroma/pleroma-fe!1135
parents acbef1eb d8211392
......@@ -25,6 +25,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
- Cropped images look correct in Chrome
- Newlines in the muted words settings work again
- Clicking on non-latin hashtags won't open a new window
- Uploading and drag-dropping multiple files works correctly now.
## [2.0.3] - 2020-05-02
### Fixed
......
......@@ -5,10 +5,15 @@ import fileSizeFormatService from '../../services/file_size_format/file_size_for
const mediaUpload = {
data () {
return {
uploading: false,
uploadCount: 0,
uploadReady: true
}
},
computed: {
uploading () {
return this.uploadCount > 0
}
},
methods: {
uploadFile (file) {
const self = this
......@@ -23,21 +28,27 @@ const mediaUpload = {
formData.append('file', file)
self.$emit('uploading')
self.uploading = true
self.uploadCount++
statusPosterService.uploadMedia({ store, formData })
.then((fileData) => {
self.$emit('uploaded', fileData)
self.uploading = false
self.decreaseUploadCount()
}, (error) => { // eslint-disable-line handle-callback-err
self.$emit('upload-failed', 'default')
self.uploading = false
self.decreaseUploadCount()
})
},
decreaseUploadCount () {
this.uploadCount--
if (this.uploadCount === 0) {
this.$emit('all-uploaded')
}
},
fileDrop (e) {
if (e.dataTransfer.files.length > 0) {
e.preventDefault() // allow dropping text like before
this.uploadFile(e.dataTransfer.files[0])
this.multiUpload(e.dataTransfer.files)
}
},
fileDrag (e) {
......@@ -54,11 +65,13 @@ const mediaUpload = {
this.uploadReady = true
})
},
change ({ target }) {
for (var i = 0; i < target.files.length; i++) {
let file = target.files[i]
multiUpload (files) {
for (const file of files) {
this.uploadFile(file)
}
},
change ({ target }) {
this.multiUpload(target.files)
}
},
props: [
......@@ -67,7 +80,7 @@ const mediaUpload = {
watch: {
'dropFiles': function (fileInfos) {
if (!this.uploading) {
this.uploadFile(fileInfos[0])
this.multiUpload(fileInfos)
}
}
}
......
......@@ -218,7 +218,6 @@ const PostStatusForm = {
},
addMediaFile (fileInfo) {
this.newStatus.files.push(fileInfo)
this.enableSubmit()
},
removeMediaFile (fileInfo) {
let index = this.newStatus.files.indexOf(fileInfo)
......@@ -227,7 +226,6 @@ const PostStatusForm = {
uploadFailed (errString, templateArgs) {
templateArgs = templateArgs || {}
this.error = this.$t('upload.error.base') + ' ' + this.$t('upload.error.' + errString, templateArgs)
this.enableSubmit()
},
disableSubmit () {
this.submitDisabled = true
......
......@@ -172,6 +172,7 @@
@uploading="disableSubmit"
@uploaded="addMediaFile"
@upload-failed="uploadFailed"
@all-uploaded="enableSubmit"
/>
<div
class="emoji-icon"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment