aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/util/DragManager.ts8
-rw-r--r--src/client/views/Main.tsx33
-rw-r--r--src/client/views/collections/CollectionDockingView.tsx43
-rw-r--r--src/client/views/collections/CollectionSchemaView.tsx4
-rw-r--r--src/client/views/collections/CollectionTreeView.tsx2
-rw-r--r--src/client/views/nodes/DocumentView.tsx2
6 files changed, 21 insertions, 71 deletions
diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index 8adadee0f..0d76d2640 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -3,14 +3,14 @@ import { CollectionDockingView } from "../views/collections/CollectionDockingVie
import { Document } from "../../fields/Document"
import { action } from "mobx";
-export function setupDrag(_reference: React.RefObject<HTMLDivElement>, _dragDocument: Document) {
+export function setupDrag(_reference: React.RefObject<HTMLDivElement>, docFunc: () => Document) {
let onRowMove = action((e: PointerEvent): void => {
e.stopPropagation();
e.preventDefault();
document.removeEventListener("pointermove", onRowMove);
document.removeEventListener('pointerup', onRowUp);
- DragManager.StartDrag(_reference.current!, { document: _dragDocument });
+ DragManager.StartDrag(_reference.current!, { document: docFunc() });
});
let onRowUp = action((e: PointerEvent): void => {
document.removeEventListener("pointermove", onRowMove);
@@ -20,10 +20,10 @@ export function setupDrag(_reference: React.RefObject<HTMLDivElement>, _dragDocu
// if (this.props.isSelected() || this.props.isTopMost) {
if (e.button == 0) {
e.stopPropagation();
- e.preventDefault();
if (e.shiftKey) {
- CollectionDockingView.Instance.StartOtherDrag(_reference.current!, _dragDocument);
+ CollectionDockingView.Instance.StartOtherDrag(docFunc(), e);
} else {
+ e.preventDefault();
document.addEventListener("pointermove", onRowMove);
document.addEventListener('pointerup', onRowUp);
}
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index 17dda899d..7ef4b6132 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -15,9 +15,8 @@ import { ServerUtils } from '../../server/ServerUtil';
import { MessageStore, DocumentTransfer } from '../../server/Message';
import { Transform } from '../util/Transform';
import { CollectionDockingView } from './collections/CollectionDockingView';
-import { FieldWaiting } from '../../fields/Field';
import { UndoManager } from '../util/UndoManager';
-import { DragManager } from '../util/DragManager';
+import { setupDrag } from '../util/DragManager';
configure({
@@ -30,7 +29,6 @@ window.addEventListener("dragover", function (e) {
e.preventDefault();
}, false)
document.addEventListener("pointerdown", action(function (e: PointerEvent) {
- console.log(ContextMenu);
if (!ContextMenu.Instance.intersects(e.pageX, e.pageY)) {
ContextMenu.Instance.clearItems()
}
@@ -98,28 +96,7 @@ Documents.initProtos(() => {
let textRef = React.createRef<HTMLDivElement>();
let schemaRef = React.createRef<HTMLDivElement>();
let colRef = React.createRef<HTMLDivElement>();
- let curMoveListener: any = null
- let onRowMove = (creator: any, dragRef: any) => action((e: PointerEvent): void => {
- e.stopPropagation();
- e.preventDefault();
- document.removeEventListener("pointermove", curMoveListener);
- document.removeEventListener('pointerup', onRowUp);
- DragManager.StartDrag(dragRef.current!, { document: creator() });
- });
- let onRowUp = action((e: PointerEvent): void => {
- document.removeEventListener("pointermove", curMoveListener);
- document.removeEventListener('pointerup', onRowUp);
- });
- let onRowDown = (creator: any, dragRef: any) => (e: React.PointerEvent) => {
- if (e.shiftKey) {
- CollectionDockingView.Instance.StartOtherDrag(dragRef.current!, creator());
- e.stopPropagation();
- } else {
- document.addEventListener("pointermove", curMoveListener = onRowMove(creator, dragRef));
- document.addEventListener('pointerup', onRowUp);
- }
- }
ReactDOM.render((
<div style={{ position: "absolute", width: "100%", height: "100%" }}>
<DocumentView Document={mainContainer}
@@ -132,13 +109,13 @@ Documents.initProtos(() => {
<DocumentDecorations />
<ContextMenu />
<div style={{ position: 'absolute', bottom: '0px', left: '0px', width: '150px' }} ref={imgRef} >
- <button onPointerDown={onRowDown(addImageNode, imgRef)} onClick={addClick(addImageNode)}>Add Image</button></div>
+ <button onPointerDown={setupDrag(imgRef, addImageNode)} onClick={addClick(addImageNode)}>Add Image</button></div>
<div style={{ position: 'absolute', bottom: '25px', left: '0px', width: '150px' }} ref={textRef}>
- <button onPointerDown={onRowDown(addTextNode, textRef)} onClick={addClick(addTextNode)}>Add Text</button></div>
+ <button onPointerDown={setupDrag(textRef, addTextNode)} onClick={addClick(addTextNode)}>Add Text</button></div>
<div style={{ position: 'absolute', bottom: '50px', left: '0px', width: '150px' }} ref={colRef}>
- <button onPointerDown={onRowDown(addColNode, colRef)} onClick={addClick(addColNode)}>Add Collection</button></div>
+ <button onPointerDown={setupDrag(colRef, addColNode)} onClick={addClick(addColNode)}>Add Collection</button></div>
<div style={{ position: 'absolute', bottom: '75px', left: '0px', width: '150px' }} ref={schemaRef}>
- <button onPointerDown={onRowDown(addSchemaNode, schemaRef)} onClick={addClick(addSchemaNode)}>Add Schema</button></div>
+ <button onPointerDown={setupDrag(schemaRef, addSchemaNode)} onClick={addClick(addSchemaNode)}>Add Schema</button></div>
<button style={{ position: 'absolute', bottom: '100px', left: '0px', width: '150px' }} onClick={clearDatabase}>Clear Database</button>
<button style={{ position: 'absolute', bottom: '25', right: '0px', width: '150px' }} onClick={() => UndoManager.Undo()}>Undo</button>
<button style={{ position: 'absolute', bottom: '0', right: '0px', width: '150px' }} onClick={() => UndoManager.Redo()}>Redo</button>
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 5fb632469..3d7e46a01 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -10,7 +10,6 @@ import { FieldId, Opt, Field } from "../../../fields/Field";
import { KeyStore } from "../../../fields/KeyStore";
import { Utils } from "../../../Utils";
import { Server } from "../../Server";
-import { DragManager } from "../../util/DragManager";
import { undoBatch } from "../../util/UndoManager";
import { DocumentView } from "../nodes/DocumentView";
import "./CollectionDockingView.scss";
@@ -34,10 +33,6 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
}
private _goldenLayout: any = null;
- private _dragDiv: any = null;
- private _dragParent: HTMLElement | null = null;
- private _dragElement: HTMLElement | undefined;
- private _dragFakeElement: HTMLElement | undefined;
private _containerRef = React.createRef<HTMLDivElement>();
private _fullScreen: any = null;
@@ -47,28 +42,8 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
(window as any).React = React;
(window as any).ReactDOM = ReactDOM;
}
-
- public StartOtherDrag(dragElement: HTMLElement, dragDoc: Document) {
- this._dragElement = dragElement;
- this._dragParent = dragElement.parentElement;
- // bcz: we want to copy this document into the header, not move it there.
- // However, GoldenLayout is setup to move things, so we have to do some kludgy stuff:
-
- // - create a temporary invisible div and register that as a DragSource with GoldenLayout
- this._dragDiv = document.createElement("div");
- this._dragDiv.style.opacity = 0;
- DragManager.Root().appendChild(this._dragDiv);
- this._goldenLayout.createDragSource(this._dragDiv, CollectionDockingView.makeDocumentConfig(dragDoc));
-
- // - add our document to that div so that GoldenLayout will get the move events its listening for
- this._dragDiv.appendChild(this._dragElement);
-
- // - add a duplicate of our document to the original document's container
- // (GoldenLayout will be removing our original one)
- this._dragFakeElement = dragElement.cloneNode(true) as HTMLElement;
- this._dragParent!.appendChild(this._dragFakeElement);
-
- // all of this must be undone when the document has been dropped (see tabCreated)
+ public StartOtherDrag(dragDoc: Document, e: any) {
+ this.AddRightSplit(dragDoc, true).contentItems[0].tab._dragListener.onMouseDown({ pageX: e.pageX, pageY: e.pageY, preventDefault: () => { }, button: e.button })
}
@action
@@ -98,7 +73,7 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
// Creates a vertical split on the right side of the docking view, and then adds the Document to that split
//
@action
- public AddRightSplit(document: Document) {
+ public AddRightSplit(document: Document, minimize: boolean = false) {
this._goldenLayout.emit('stateChanged');
let newItemStackConfig = {
type: 'stack',
@@ -121,10 +96,15 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
collayout.config["width"] = 50;
newContentItem.config["width"] = 50;
}
+ if (minimize) {
+ newContentItem.config["width"] = 10;
+ newContentItem.config["height"] = 10;
+ }
newContentItem.callDownwards('_$init');
this._goldenLayout.root.callDownwards('setSize', [this._goldenLayout.width, this._goldenLayout.height]);
this._goldenLayout.emit('stateChanged');
this.stateChanged();
+ return newContentItem;
}
setupGoldenLayout() {
@@ -218,13 +198,6 @@ export class CollectionDockingView extends React.Component<SubCollectionViewProp
this.stateChanged();
}
tabCreated = (tab: any) => {
- if (this._dragDiv) {
- this._dragDiv.removeChild(this._dragElement);
- this._dragParent!.removeChild(this._dragFakeElement!);
- this._dragParent!.appendChild(this._dragElement!);
- DragManager.Root().removeChild(this._dragDiv);
- this._dragDiv = null;
- }
tab.closeElement.off('click') //unbind the current click handler
.click(function () {
tab.contentItem.remove();
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
index 106a5c4f5..03110a9c7 100644
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -45,9 +45,9 @@ export class CollectionSchemaView extends CollectionViewBase {
<FieldView {...props} />
)
let reference = React.createRef<HTMLDivElement>();
- let onItemDown = setupDrag(reference, props.doc);
+ let onItemDown = setupDrag(reference, () => props.doc);
return (
- <div onPointerDown={onItemDown} ref={reference}>
+ <div onPointerDown={onItemDown} key={props.doc.Id} ref={reference}>
<EditableView contents={contents}
height={36} GetValue={() => {
let field = props.doc.Get(props.fieldKey);
diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx
index 64f4c0970..55c804337 100644
--- a/src/client/views/collections/CollectionTreeView.tsx
+++ b/src/client/views/collections/CollectionTreeView.tsx
@@ -33,7 +33,7 @@ class TreeView extends React.Component<TreeViewProps> {
var children = childDocument.GetT<ListField<Document>>(KeyStore.Data, ListField);
let title = childDocument.GetT<TextField>(KeyStore.Title, TextField);
- let onItemDown = setupDrag(reference, childDocument);
+ let onItemDown = setupDrag(reference, () => childDocument);
if (title && title != FieldWaiting) {
let subView = !children || this.collapsed || children === FieldWaiting ? (null) :
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index c579b7142..feecde921 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -96,7 +96,7 @@ export class DocumentView extends React.Component<DocumentViewProps> {
this._downX = e.clientX;
this._downY = e.clientY;
if (e.shiftKey && e.buttons === 1) {
- CollectionDockingView.Instance.StartOtherDrag(this._mainCont.current!, this.props.Document);
+ CollectionDockingView.Instance.StartOtherDrag(this.props.Document, e);
e.stopPropagation();
} else {
this._contextMenuCanOpen = true;
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-08 08:33:55 +0000