add file upload by dragging it into the editor

fixes #45

Changelog.md

@@ -4,8 +4,8 @@
 
 Features:
 
-- File upload via drag and drop into the folder view
-- Commits that are less than a minute ago are automatically ammended
+- File upload via drag and drop into the folder view or drag and drop into the editor. The latter will insert a reference to the file into the text.
+- Commits that are less than a minute ago are automatically amended.
 - Autosave in the web editor
 
 Fixed:

web/app/components/drop-area.js

@@ -32,7 +32,7 @@ export default Ember.Component.extend({
         return;
       }
       var files = e.dataTransfer.files;
-      this.sendAction('action', files);
+      this.sendAction('action', files, e.target);
     });
   },
 });

web/app/controllers/folder.js

@@ -38,8 +38,10 @@ export default Ember.Controller.extend({
           id: id,
           folder: folder,
         });
-        page.save();
-        page.sendData(file);
+        /* jshint -W083 */
+        page.save().then(function () {
+          page.sendData(file);
+        });
       }
     },
   },

web/app/controllers/page/edit.js

@@ -11,5 +11,32 @@ export default Ember.Controller.extend({
       this.get('model').save();
       this.transitionToRoute('page.show', this.get('model'));
     },
+
+    uploadAndLinkFile: function (fileList, textArea) {
+      var textToInsert = '';
+
+      var folder = this.get('page.folder');
+      for (var i = 0; i < fileList.length; i++) {
+        var file = fileList.item(i);
+        var id = folder.get('id') + '|' + file.name;
+        id = id.replace('||', '|');
+        var page = this.store.createRecord('page', {
+          id: id,
+          folder: folder,
+        });
+        /* jshint -W083 */
+        page.save().then(function () {
+          page.sendData(file);
+        });
+
+        textToInsert += '[[' + file.name + ']]';
+      }
+
+      var pos = textArea.selectionStart || 0;
+      var text = this.get('page.markdownSource');
+      this.set('page.markdownSource', text.substring(0, pos) + textToInsert + text.substring(pos));
+      textArea.selectionStart = pos + textToInsert.length;
+      textArea.selectionEnd = pos + textToInsert.length;
+    },
   },
 });

web/app/styles/app.scss

@@ -36,6 +36,10 @@ a:not([href]) {
   cursor: pointer;
 }
 
+.dragging {
+  box-shadow:  0px 0px 10px green;
+}
+
 // Folder list
 
 .nav-list {
@@ -51,10 +55,6 @@ a:not([href]) {
     border-color: lighten(#428bca, 20%);
     color: #fff;
   }
-
-  &.dragging {
-    box-shadow:  0px 0px 10px green;
-  }
 }
 
 .btn-new-file {

web/app/templates/page/edit.hbs

@@ -25,5 +25,7 @@
 </div>
 
 {{#if page.isMarkdown}}
-  {{textarea-autosize value=page.markdownSource class="markdown-edit" placeholder='Type markdown here'}}
+  {{#drop-area action='uploadAndLinkFile'}}
+    {{textarea-autosize value=page.markdownSource class="markdown-edit" placeholder='Type markdown here'}}
+  {{/drop-area}}
 {{/if}}