can switch into drag-as-dockingframe using shift after drag starts. changed scrollbars globally .

4 files changed, 24 insertions, 24 deletions

diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index 0d76d2640..6b4b8ca57 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -2,6 +2,7 @@ import { DocumentDecorations } from "../views/DocumentDecorations";
 import { CollectionDockingView } from "../views/collections/CollectionDockingView";
 import { Document } from "../../fields/Document"
 import { action } from "mobx";
+import { DocumentView } from "../views/nodes/DocumentView";
 
 export function setupDrag(_reference: React.RefObject<HTMLDivElement>, docFunc: () => Document) {
     let onRowMove = action((e: PointerEvent): void => {
@@ -23,7 +24,6 @@ export function setupDrag(_reference: React.RefObject<HTMLDivElement>, docFunc:
             if (e.shiftKey) {
                 CollectionDockingView.Instance.StartOtherDrag(docFunc(), e);
             } else {
-                e.preventDefault();
                 document.addEventListener("pointermove", onRowMove);
                 document.addEventListener('pointerup', onRowUp);
             }
@@ -139,22 +139,32 @@ export namespace DragManager {
             e.preventDefault();
             x += e.movementX;
             y += e.movementY;
+            if (e.shiftKey) {
+                abortDrag();
+                const docView: DocumentView = dragData["documentView"];
+                const doc: Document = docView ? docView.props.Document : dragData["document"];
+                CollectionDockingView.Instance.StartOtherDrag(doc, { pageX: e.pageX, pageY: e.pageY, preventDefault: () => { }, button: 0 });
+            }
             dragElement.style.transform = `translate(${x}px, ${y}px) scale(${scaleX}, ${scaleY})`;
         };
-        const upHandler = (e: PointerEvent) => {
+
+        const abortDrag = () => {
             document.removeEventListener("pointermove", moveHandler, true);
             document.removeEventListener("pointerup", upHandler);
-            FinishDrag(dragElement, e, dragData, options);
+            dragDiv.removeChild(dragElement);
             if (hideSource && !wasHidden) {
                 ele.hidden = false;
             }
+        }
+        const upHandler = (e: PointerEvent) => {
+            abortDrag();
+            FinishDrag(dragElement, e, dragData, options);
         };
         document.addEventListener("pointermove", moveHandler, true);
         document.addEventListener("pointerup", upHandler);
     }
 
     function FinishDrag(dragEle: HTMLElement, e: PointerEvent, dragData: { [index: string]: any }, options?: DragOptions) {
-        dragDiv.removeChild(dragEle);
         const target = document.elementFromPoint(e.x, e.y);
         if (!target) {
             return;
diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss
index e73f62904..6540af5b2 100644
--- a/src/client/views/Main.scss
+++ b/src/client/views/Main.scss
@@ -28,4 +28,13 @@ h1 {
 p {
     margin: 0px;
     padding: 0px;
-}
\ No newline at end of file
+}
+::-webkit-scrollbar {
+    -webkit-appearance: none;
+    height:5px;
+    width:5px;
+}
+::-webkit-scrollbar-thumb {
+    border-radius: 2px;
+    background-color: rgba(0,0,0,.5);
+}
diff --git a/src/client/views/collections/CollectionFreeFormView.scss b/src/client/views/collections/CollectionFreeFormView.scss
index 737f28318..e86295c26 100644
--- a/src/client/views/collections/CollectionFreeFormView.scss
+++ b/src/client/views/collections/CollectionFreeFormView.scss
@@ -1,15 +1,5 @@
 .collectionfreeformview-container {
 
-    ::-webkit-scrollbar {
-        -webkit-appearance: none;
-        height:5px;
-        width:5px;
-    }
-    ::-webkit-scrollbar-thumb {
-        border-radius: 2px;
-        background-color: rgba(0,0,0,.5);
-    }
-    
     .collectionfreeformview > .jsx-parser{
         position:absolute;
         height: 100%;
diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss
index 995d60f74..d40e6d314 100644
--- a/src/client/views/collections/CollectionSchemaView.scss
+++ b/src/client/views/collections/CollectionSchemaView.scss
@@ -6,15 +6,6 @@
     position: absolute;
     width: 100%;
     height: 100%;
-    ::-webkit-scrollbar {
-        -webkit-appearance: none;
-        height:5px;
-        width:5px;
-    }
-    ::-webkit-scrollbar-thumb {
-        border-radius: 2px;
-        background-color: rgba(0,0,0,.5);
-    }
     .collectionSchemaView-previewRegion {
         position: relative; 
         background: black;