Move modal from container to the editor

index.html

@@ -868,7 +868,7 @@
       },
 
       assetManager: {
-        upload: 'https://grapedrop.dev/asset-upload/testpage',
+        upload: 'https://test.page',
         params: {
           _token: 'pCYrSwjuiV0t5NVtZpQDY41Gn5lNUwo3it1FIkAj',
         },

package.json

@@ -1,7 +1,7 @@
 {
   "name": "grapesjs",
   "description": "Free and Open Source Web Builder Framework",
-  "version": "0.9.26",
+  "version": "0.9.27",
   "author": "Artur Arseniev",
   "license": "BSD-3-Clause",
   "homepage": "http://grapesjs.com",
@@ -11,7 +11,6 @@
     "url": "https://github.com/artf/grapesjs.git"
   },
   "dependencies": {
-    "babel-preset-stage-3": "^6.24.1",
     "backbone": "^1.3.3",
     "backbone-undo": "^0.2.5",
     "codemirror": "^5.21.0",
@@ -56,7 +55,10 @@
     "editor"
   ],
   "babel": {
-    "presets": [ "es2015", "stage-3"]
+    "presets": [
+      "es2015",
+      "stage-3"
+    ]
   },
   "scripts": {
     "lint": "eslint src",

src/asset_manager/index.js

@@ -207,7 +207,7 @@ module.exports = () => {
     },
 
     postRender(editorView) {
-      fu.initDropzone(editorView);
+      c.dropzone && fu.initDropzone(editorView);
     },
 
     //-------

src/asset_manager/view/FileUploader.js

@@ -87,27 +87,29 @@ module.exports = Backbone.View.extend({
    * */
   uploadFile(e) {
     const files = e.dataTransfer ? e.dataTransfer.files : e.target.files;
-    const formData = new FormData();
+    const body = new FormData();
     const config = this.config;
     const params = config.params;
 
     for (let i = 0; i < files.length; i++) {
-      formData.append('files[]', files[i]);
+      body.append('files[]', files[i]);
     }
 
     for (let param in params) {
-      formData.append(param, params[param]);
+      body.append(param, params[param]);
     }
 
     var target = this.target;
     const url = config.upload;
+    const headers = config.headers;
+
     if (url) {
       this.onUploadStart();
       return fetch(url, {
         method: 'post',
         credentials: 'include',
-        headers: config.headers,
-        body: formData,
+        headers,
+        body,
       }).then(res => (res.status/200|0) == 1 ?
         res.text() : res.text().then((text) =>
           Promise.reject(text)
@@ -150,8 +152,9 @@ module.exports = Backbone.View.extend({
     const c = this.config;
     const em = ev.model;
     const edEl = ev.el;
-    const editor = em && em.get('Editor');
-    const frameEl = ev.model.get('Canvas').getBody();
+    const editor = em.get('Editor');
+    const container = em.get('Config').el;
+    const frameEl = em.get('Canvas').getBody();
     const ppfx = this.ppfx;
     const updatedCls = `${ppfx}dropzone-active`;
     const dropzoneCls = `${ppfx}dropzone`;
@@ -193,7 +196,7 @@ module.exports = Backbone.View.extend({
     ev.$el.append(`<div class="${dropzoneCls}">${c.dropzoneContent}</div>`);
     cleanEditorElCls();
 
-    if (c.dropzone && 'draggable' in edEl) {
+    if ('draggable' in edEl) {
       [edEl, frameEl].forEach((item) => {
         item.ondragover = onDragOver;
         item.ondragleave = onDragLeave;

src/modal_dialog/index.js

@@ -52,14 +52,14 @@ module.exports = () => {
         config: c,
       });
 
-      if(c.em)
-        c.em.on('loaded', function(){
-          this.render().appendTo(c.em.config.el || 'body');
-        }, this);
-
       return this;
     },
 
+    postRender(editorView) {
+      // c.em.config.el || 'body'
+      this.render().appendTo(editorView.el);
+    },
+
     /**
      * Open the modal window
      * @return {this}