diff options
| author | Roger Braun <roger@rogerbraun.net> | 2017-02-26 11:39:42 +0100 |
|---|---|---|
| committer | Roger Braun <roger@rogerbraun.net> | 2017-02-26 11:39:42 +0100 |
| commit | 290180a987ecb4949fc877c512f3cff120bcbc70 (patch) | |
| tree | 7217c877059e94bd9a435021b7e2cd42b66e24cb /src/components/media_upload/media_upload.js | |
| parent | 7661357cf669ef57bfdd3e39c0c5574094984de4 (diff) | |
| parent | bebd5c3328422aacf65996776e282d032347c5c9 (diff) | |
Merge branch 'develop' into feature/hash-routed
Diffstat (limited to 'src/components/media_upload/media_upload.js')
| -rw-r--r-- | src/components/media_upload/media_upload.js | 43 |
1 files changed, 36 insertions, 7 deletions
diff --git a/src/components/media_upload/media_upload.js b/src/components/media_upload/media_upload.js index 3f2e3964..8b4e7ad4 100644 --- a/src/components/media_upload/media_upload.js +++ b/src/components/media_upload/media_upload.js @@ -3,12 +3,22 @@ import statusPosterService from '../../services/status_poster/status_poster.serv const mediaUpload = { mounted () { - const store = this.$store const input = this.$el.querySelector('input') - const self = this input.addEventListener('change', ({target}) => { const file = target.files[0] + this.uploadFile(file) + }) + }, + data () { + return { + uploading: false + } + }, + methods: { + uploadFile (file) { + const self = this + const store = this.$store const formData = new FormData() formData.append('media', file) @@ -19,15 +29,34 @@ const mediaUpload = { .then((fileData) => { self.$emit('uploaded', fileData) self.uploading = false - }, (error) => { + }, (error) => { // eslint-disable-line handle-callback-err self.$emit('upload-failed') self.uploading = false }) - }) + }, + fileDrop (e) { + if (e.dataTransfer.files.length > 0) { + e.preventDefault() // allow dropping text like before + this.uploadFile(e.dataTransfer.files[0]) + } + }, + fileDrag (e) { + let types = e.dataTransfer.types + if (types.contains('Files')) { + e.dataTransfer.dropEffect = 'copy' + } else { + e.dataTransfer.dropEffect = 'none' + } + } }, - data () { - return { - uploading: false + props: [ + 'dropFiles' + ], + watch: { + 'dropFiles': function (fileInfos) { + if (!this.uploading) { + this.uploadFile(fileInfos[0]) + } } } } |
