]> BookStack Code Mirror - bookstack/blobdiff - resources/assets/js/vues/components/dropzone.js
Rolled tri-layout to page edit and book-create
[bookstack] / resources / assets / js / vues / components / dropzone.js
index 0f31bd5793363d4009b77d0fb1e5164671aa4e7d..587ec2030c0ac9c842f3c5a6531057c4245d8ca7 100644 (file)
@@ -1,4 +1,4 @@
-const DropZone = require("dropzone");
+import DropZone from "dropzone";
 
 const template = `
     <div class="dropzone-container">
@@ -12,7 +12,9 @@ const props = ['placeholder', 'uploadUrl', 'uploadedTo'];
 function mounted() {
    let container = this.$el;
    let _this = this;
-   new DropZone(container, {
+   this._dz = new DropZone(container, {
+       addRemoveLinks: true,
+       dictRemoveFile: trans('components.image_upload_remove'),
         url: function() {
             return _this.uploadUrl;
         },
@@ -35,26 +37,33 @@ function mounted() {
 
             dz.on('error', function (file, errorMessage, xhr) {
                 _this.$emit('error', {file, errorMessage, xhr});
-                console.log(errorMessage);
-                console.log(xhr);
+
                 function setMessage(message) {
                     $(file.previewElement).find('[data-dz-errormessage]').text(message);
                 }
 
-                if (xhr.status === 413) setMessage(trans('errors.server_upload_limit'));
-                if (errorMessage.file) setMessage(errorMessage.file[0]);
+                if (xhr && xhr.status === 413) setMessage(trans('errors.server_upload_limit'));
+                else if (errorMessage.file) setMessage(errorMessage.file);
+
             });
         }
    });
 }
 
 function data() {
-    return {}
+    return {};
 }
 
-module.exports = {
+const methods = {
+    onClose: function () {
+        this._dz.removeAllFiles(true);
+    }
+};
+
+export default {
     template,
     props,
     mounted,
     data,
-};
\ No newline at end of file
+    methods
+};