drag & drop notes from the tree into relation map

src/public/javascripts/services/drag_and_drop.js

@@ -8,11 +8,21 @@ const dragAndDropSetup = {
             return false;
         }
 
+        // this is for dragging notes into relation map
+        data.dataTransfer.setData("text", JSON.stringify({
+            noteId: node.data.noteId,
+            title: node.data.title
+        }));
+
         // This function MUST be defined to enable dragging for the tree.
         // Return false to cancel dragging of node.
         return true;
     },
-    dragEnter: (node, data) => true, // allow drop on any node
+    dragEnter: (node, data) => {
+        // we don't allow moving root to any other location in the tree
+        // we allow it to be placed on the relation map though, that's handled in a different drop handler
+        return node.data.noteId === 'root';
+    }, // allow drop on any node
     dragDrop: (node, data) => {
         // This function MUST be defined to enable dropping of items on the tree.
         // data.hitMode is 'before', 'after', or 'over'.

src/public/javascripts/services/note_detail_relation_map.js

@@ -456,10 +456,19 @@ function dragover_handler(ev) {
 
     console.log("DRAGOVER");
 }
+
 function drop_handler(ev) {
     ev.preventDefault();
 
-    console.log("DROP!", ev);
+    const note = JSON.parse(ev.originalEvent.dataTransfer.getData("text"));
+
+    let {x, y} = getMousePosition(ev);
+
+    // modifying position so that cursor is on the top-center of the box
+    x -= 80;
+    y -= 15;
+
+    createNoteBox(note.noteId, note.title, x, y);
 }
 
 function getMousePosition(evt) {