Allow async loading of images

src/dom_components/model/ComponentImage.js

@@ -12,7 +12,10 @@ module.exports = Component.extend(
       editable: 1,
       highlightable: 0,
       resizable: 1,
-      traits: ['alt']
+      traits: ['alt'],
+
+      // File to load asynchronously once the model is rendered
+      file: ''
     },
 
     initialize(o, opt) {

src/dom_components/view/ComponentImageView.js

@@ -18,6 +18,27 @@ module.exports = ComponentView.extend({
     const config = this.config;
     config.modal && (this.modal = config.modal);
     config.am && (this.am = config.am);
+    this.uploadFile();
+  },
+
+  uploadFile() {
+    const model = this.model;
+    const file = model.get('file');
+
+    if (file) {
+      const fu = this.em.get('AssetManager').FileUploader();
+      fu.uploadFile(
+        {
+          dataTransfer: { files: [file] }
+        },
+        res => {
+          const obj = res && res.data && res.data[0];
+          const src = obj && obj.src;
+          src && model.set({ src });
+        }
+      );
+      model.set('file', '');
+    }
   },
 
   /**