From e70af1300aae26fa41c28d09150f9fcf797f492b Mon Sep 17 00:00:00 2001
From: azivner <adam.zivner@gmail.com>
Date: Wed, 23 Jan 2019 21:13:04 +0100
Subject: [PATCH] drag and drop moves multiple items only if CTRL is pressed,
 active note has now bold text for more differentiation from selected note

---
 src/public/javascripts/services/drag_and_drop.js |  8 ++++++++
 src/public/stylesheets/style.css                 | 12 +++++++++++-
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/src/public/javascripts/services/drag_and_drop.js b/src/public/javascripts/services/drag_and_drop.js
index f09a80249..53d637ad2 100644
--- a/src/public/javascripts/services/drag_and_drop.js
+++ b/src/public/javascripts/services/drag_and_drop.js
@@ -9,6 +9,14 @@ const dragAndDropSetup = {
             return false;
         }
 
+        if (!data.originalEvent.ctrlKey) {
+            // keep existing selection only if CTRL key is pressed
+            for (const selectedNode of treeService.getSelectedNodes()) {
+                selectedNode.setSelected(false);
+                selectedNode.renderTitle();
+            }
+        }
+
         node.setSelected(true);
 
         // this is for dragging notes into relation map
diff --git a/src/public/stylesheets/style.css b/src/public/stylesheets/style.css
index c2dc1fd11..c0b993df5 100644
--- a/src/public/stylesheets/style.css
+++ b/src/public/stylesheets/style.css
@@ -258,13 +258,23 @@ span.fancytree-active.fancytree-focused .fancytree-title {
     background-color: var(--active-item-background-color) !important;
     border-color: #ddd !important;
     border-radius: 3px;
+    font-weight: bold;
 }
 
-span.fancytree-active:not(.fancytree-focused) .fancytree-title, span.fancytree-selected .fancytree-title {
+span.fancytree-active:not(.fancytree-focused) .fancytree-title {
     color: var(--hover-item-text-color) !important;
     background-color: var(--hover-item-background-color) !important;
     border-color: #ddd !important;
     border-radius: 3px;
+    font-weight: bold;
+}
+
+span.fancytree-selected:not(.fancytree-active) .fancytree-title {
+    color: var(--hover-item-text-color) !important;
+    background-color: var(--hover-item-background-color) !important;
+    border-color: #ddd !important;
+    border-radius: 3px;
+    font-style: italic;
 }
 
 span.fancytree-node:not(.fancytree-active):hover span.fancytree-title {