Ref: Attachment upload handlers

client/components/cards/attachments.js

@@ -63,51 +63,29 @@ Template.previewAttachedImagePopup.events({
 Template.cardAttachmentsPopup.events({
   'change .js-attach-file'(event) {
     const card = this;
-    const processFile = f => {
-      Utils.processUploadedAttachment(card, f, attachment => {
-        if (attachment && attachment._id && attachment.isImage()) {
-          card.setCover(attachment._id);
+    if (event.currentTarget.files && event.currentTarget.files[0]) {
+      const uploader = Attachments.insert(
+        {
+          file: event.currentTarget.files[0],
+          streams: 'dynamic',
+          chunkSize: 'dynamic',
+        },
+        false,
+      );
+      uploader.on('uploaded', (error, fileObj) => {
+        if (!error) {
+          if (fileObj.isImage) {
+            card.setCover(fileObj._id);
           }
+          Utils.addCommonMetaToAttachment(card, fileObj);
+        }
+      });
+      uploader.on('end', (error, fileObj) => {
         Popup.back();
       });
-    };
-
-    FS.Utility.eachFile(event, f => {
-      if (
-        MAX_IMAGE_PIXEL > 0 &&
-        typeof f.type === 'string' &&
-        f.type.match(/^image/)
-      ) {
-        // is image
-        const reader = new FileReader();
-        reader.onload = function(e) {
-          const dataurl = e && e.target && e.target.result;
-          if (dataurl !== undefined) {
-            Utils.shrinkImage({
-              dataurl,
-              maxSize: MAX_IMAGE_PIXEL,
-              ratio: COMPRESS_RATIO,
-              toBlob: true,
-              callback(blob) {
-                if (blob === false) {
-                  processFile(f);
-                } else {
-                  blob.name = f.name;
-                  processFile(blob);
+      uploader.start();
     }
   },
-            });
-          } else {
-            // couldn't process it let other function handle it?
-            processFile(f);
-          }
-        };
-        reader.readAsDataURL(f);
-      } else {
-        processFile(f);
-      }
-    });
-  },
   'click .js-computer-upload'(event, templateInstance) {
     templateInstance.find('.js-attach-file').click();
     event.preventDefault();

client/components/main/editor.js

@@ -153,7 +153,6 @@ BlazeComponent.extendComponent({
                   });
                 }
               },
-
               onImageUpload(files) {
                 const $summernote = getSummernote(this);
                 if (files && files.length > 0) {
@@ -162,45 +161,31 @@ BlazeComponent.extendComponent({
                   const MAX_IMAGE_PIXEL = Utils.MAX_IMAGE_PIXEL;
                   const COMPRESS_RATIO = Utils.IMAGE_COMPRESS_RATIO;
                   const insertImage = src => {
-                    // process all image upload types to the description/comment window
                     const img = document.createElement('img');
                     img.src = src;
                     img.setAttribute('width', '100%');
                     $summernote.summernote('insertNode', img);
                   };
-                  const processData = function(fileObj) {
-                    Utils.processUploadedAttachment(
-                      currentCard,
-                      fileObj,
-                      attachment => {
-                        if (
-                          attachment &&
-                          attachment._id &&
-                          attachment.isImage()
-                        ) {
-                          attachment.one('uploaded', function() {
-                            const maxTry = 3;
-                            const checkItvl = 500;
-                            let retry = 0;
-                            const checkUrl = function() {
-                              // even though uploaded event fired, attachment.url() is still null somehow //TODO
-                              const url = attachment.url();
-                              if (url) {
-                                insertImage(
-                                  `${location.protocol}//${location.host}${url}`,
-                                );
-                              } else {
-                                retry++;
-                                if (retry < maxTry) {
-                                  setTimeout(checkUrl, checkItvl);
-                                }
-                              }
-                            };
-                            checkUrl();
-                          });
-                        }
+                  const processUpload = function(file) {
+                    const uploader = Attachments.insert(
+                      {
+                        file,
+                        streams: 'dynamic',
+                        chunkSize: 'dynamic',
                       },
+                      false,
                     );
+                    uploader.on('uploaded', (error, fileObj) => {
+                      if (!error) {
+                        if (fileObj.isImage) {
+                          insertImage(
+                            `${location.protocol}//${location.host}${fileObj.path}`,
+                          );
+                        }
+                        Utils.addCommonMetaToAttachment(currentCard, fileObj);
+                      }
+                    });
+                    uploader.start();
                   };
                   if (MAX_IMAGE_PIXEL) {
                     const reader = new FileReader();
@@ -216,7 +201,7 @@ BlazeComponent.extendComponent({
                           callback(blob) {
                             if (blob !== false) {
                               blob.name = image.name;
-                              processData(blob);
+                              processUpload(blob);
                             }
                           },
                         });
@@ -224,7 +209,7 @@ BlazeComponent.extendComponent({
                     };
                     reader.readAsDataURL(image);
                   } else {
-                    processData(image);
+                    processUpload(image);
                   }
                 }
               },

client/lib/utils.js

@@ -164,16 +164,7 @@ Utils = {
   },
   MAX_IMAGE_PIXEL: Meteor.settings.public.MAX_IMAGE_PIXEL,
   COMPRESS_RATIO: Meteor.settings.public.IMAGE_COMPRESS_RATIO,
-  processUploadedAttachment(card, fileObj, callback) {
-    const next = attachment => {
-      if (typeof callback === 'function') {
-        callback(attachment);
-      }
-    };
-    if (!card) {
-      return next();
-    }
-    const file = new FS.File(fileObj);
+  addCommonMetaToAttachment(card, file) {
     if (card.isLinkedCard()) {
       file.boardId = Cards.findOne(card.linkedId).boardId;
       file.cardId = card.linkedId;
@@ -185,9 +176,8 @@ Utils = {
     }
     file.userId = Meteor.userId();
     if (file.original) {
-      file.original.name = fileObj.name;
+      file.original.name = file.name;
     }
-    return next(Attachments.insert(file));
   },
   shrinkImage(options) {
     // shrink image to certain size