aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/util/DragManager.ts46
-rw-r--r--src/client/views/DocumentDecorations.tsx5
-rw-r--r--src/client/views/collections/CollectionFreeFormView.tsx15
-rw-r--r--src/client/views/collections/CollectionViewBase.tsx19
-rw-r--r--src/client/views/nodes/DocumentView.tsx47
5 files changed, 80 insertions, 52 deletions
diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index 54784f2d2..753115f76 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -5,6 +5,7 @@ import { action } from "mobx";
import { ImageField } from "../../fields/ImageField";
import { KeyStore } from "../../fields/KeyStore";
import { CollectionView } from "../views/collections/CollectionView";
+import { DocumentView } from "../views/nodes/DocumentView";
export function setupDrag(_reference: React.RefObject<HTMLDivElement>, docFunc: () => Document, removeFunc: (containingCollection: CollectionView) => void = () => { }) {
let onRowMove = action((e: PointerEvent): void => {
@@ -13,7 +14,9 @@ export function setupDrag(_reference: React.RefObject<HTMLDivElement>, docFunc:
document.removeEventListener("pointermove", onRowMove);
document.removeEventListener('pointerup', onRowUp);
- DragManager.StartDrag(_reference.current!, { draggedDocument: docFunc(), removeDocument: removeFunc });
+ var dragData = new DragManager.DocumentDragData(docFunc());
+ dragData.removeDocument = removeFunc;
+ DragManager.StartDocumentDrag(_reference.current!, dragData);
});
let onRowUp = action((e: PointerEvent): void => {
document.removeEventListener("pointermove", onRowMove);
@@ -70,11 +73,12 @@ export namespace DragManager {
export interface DropOptions {
handlers: DropHandlers;
}
-
export class DropEvent {
constructor(readonly x: number, readonly y: number, readonly data: { [id: string]: any }) { }
}
+
+
export interface DropHandlers {
drop: (e: Event, de: DropEvent) => void;
}
@@ -96,7 +100,34 @@ export namespace DragManager {
};
}
- export function StartDrag(ele: HTMLElement, dragData: { [id: string]: any }, options?: DragOptions) {
+ export class DocumentDragData {
+ constructor(dragDoc: Document) {
+ this.draggedDocument = dragDoc;
+ this.droppedDocument = dragDoc;
+ }
+ draggedDocument: Document;
+ droppedDocument: Document;
+ xOffset?: number;
+ yOffset?: number;
+ aliasOnDrop?: boolean;
+ removeDocument?: (collectionDrop: CollectionView) => void;
+ [id: string]: any;
+ }
+ export function StartDocumentDrag(ele: HTMLElement, dragData: DocumentDragData, options?: DragOptions) {
+ StartDrag(ele, dragData, options, (dropData: { [id: string]: any }) => dropData.droppedDocument = dragData.aliasOnDrop ? dragData.draggedDocument.CreateAlias() : dragData.draggedDocument);
+ }
+
+ export class LinkDragData {
+ constructor(linkSourceDoc: DocumentView) {
+ this.linkSourceDocumentView = linkSourceDoc;
+ }
+ linkSourceDocumentView: DocumentView;
+ [id: string]: any;
+ }
+ export function StartLinkDrag(ele: HTMLElement, dragData: LinkDragData, options?: DragOptions) {
+ StartDrag(ele, dragData, options);
+ }
+ function StartDrag(ele: HTMLElement, dragData: { [id: string]: any }, options?: DragOptions, finishDrag?: (dropData: { [id: string]: any }) => void) {
if (!dragDiv) {
dragDiv = document.createElement("div");
dragDiv.className = "dragManager-dragDiv"
@@ -172,13 +203,13 @@ export namespace DragManager {
}
const upHandler = (e: PointerEvent) => {
abortDrag();
- FinishDrag(ele, e, dragData, options);
+ FinishDrag(ele, e, dragData, options, finishDrag);
};
document.addEventListener("pointermove", moveHandler, true);
document.addEventListener("pointerup", upHandler);
}
- function FinishDrag(dragEle: HTMLElement, e: PointerEvent, dragData: { [index: string]: any }, options?: DragOptions) {
+ function FinishDrag(dragEle: HTMLElement, e: PointerEvent, dragData: { [index: string]: any }, options?: DragOptions, finishDrag?: (dragData: { [index: string]: any }) => void) {
let parent = dragEle.parentElement;
if (parent)
parent.removeChild(dragEle);
@@ -188,7 +219,9 @@ export namespace DragManager {
if (!target) {
return;
}
- dragData["droppedDocument"] = dragData["aliasOnDrop"] ? (dragData["draggedDocument"] as Document).CreateAlias() : dragData["draggedDocument"];
+ if (finishDrag)
+ finishDrag(dragData);
+
target.dispatchEvent(new CustomEvent<DropEvent>("dashOnDrop", {
bubbles: true,
detail: {
@@ -197,6 +230,7 @@ export namespace DragManager {
data: dragData
}
}));
+
if (options) {
options.handlers.dragComplete({});
}
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 1145fbe7f..a8090dc8f 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -87,9 +87,8 @@ export class DocumentDecorations extends React.Component {
if (this._linkButton.current != null) {
document.removeEventListener("pointermove", this.onLinkButtonMoved)
document.removeEventListener("pointerup", this.onLinkButtonUp)
- let dragData: { [id: string]: any } = {};
- dragData["linkSourceDoc"] = SelectionManager.SelectedDocuments()[0];
- DragManager.StartDrag(this._linkButton.current, dragData, {
+ let dragData = new DragManager.LinkDragData(SelectionManager.SelectedDocuments()[0]);
+ DragManager.StartLinkDrag(this._linkButton.current, dragData, {
handlers: {
dragComplete: action(() => { }),
},
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index 85ea2d121..7ab91ebaa 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -76,14 +76,13 @@ export class CollectionFreeFormView extends CollectionViewBase {
@action
drop = (e: Event, de: DragManager.DropEvent) => {
super.drop(e, de);
- let screenX = de.x - (de.data["xOffset"] as number || 0);
- let screenY = de.y - (de.data["yOffset"] as number || 0);
- const [x, y] = this.getTransform().transformPoint(screenX, screenY);
- let doc: Document = de.data["droppedDocument"];
- if (doc) {
- doc.SetNumber(KeyStore.X, x);
- doc.SetNumber(KeyStore.Y, y);
- this.bringToFront(doc);
+ if (de.data instanceof DragManager.DocumentDragData) {
+ let screenX = de.x - (de.data.xOffset as number || 0);
+ let screenY = de.y - (de.data.yOffset as number || 0);
+ const [x, y] = this.getTransform().transformPoint(screenX, screenY);
+ de.data.droppedDocument.SetNumber(KeyStore.X, x);
+ de.data.droppedDocument.SetNumber(KeyStore.Y, y);
+ this.bringToFront(de.data.droppedDocument);
}
}
diff --git a/src/client/views/collections/CollectionViewBase.tsx b/src/client/views/collections/CollectionViewBase.tsx
index 0358b5907..581853e67 100644
--- a/src/client/views/collections/CollectionViewBase.tsx
+++ b/src/client/views/collections/CollectionViewBase.tsx
@@ -6,12 +6,12 @@ import { KeyStore } from "../../../fields/KeyStore";
import { FieldWaiting, Field, Opt } from "../../../fields/Field";
import { undoBatch } from "../../util/UndoManager";
import { DragManager } from "../../util/DragManager";
-import { DocumentView } from "../nodes/DocumentView";
import { Documents, DocumentOptions } from "../../documents/Documents";
import { Key } from "../../../fields/Key";
import { Transform } from "../../util/Transform";
import { CollectionView } from "./CollectionView";
import { NumberField } from "../../../fields/NumberField";
+import { DocumentManager } from "../../util/DocumentManager";
export interface CollectionViewProps {
fieldKey: Key;
@@ -46,18 +46,17 @@ export class CollectionViewBase extends React.Component<SubCollectionViewProps>
@undoBatch
@action
protected drop(e: Event, de: DragManager.DropEvent) {
- let dropped = de.data["droppedDocument"];
- if (dropped) {
- if (de.data["aliasOnDrop"]) {
- let dragged = de.data["draggedDocument"];
+ if (de.data instanceof DragManager.DocumentDragData) {
+ if (de.data.aliasOnDrop) {
+ let dragged = de.data.draggedDocument;
[KeyStore.Width, KeyStore.Height, KeyStore.CurPage].map(key =>
- dragged.GetTAsync(key, NumberField, (f: Opt<NumberField>) => f ? dropped.SetNumber(key, f.Data) : null));
- } else if (de.data["removeDocument"]) {
- de.data["removeDocument"](this.props.CollectionView);
+ dragged.GetTAsync(key, NumberField, (f: Opt<NumberField>) => f ? de.data.droppedDocument.SetNumber(key, f.Data) : null));
+ } else if (de.data.removeDocument) {
+ de.data.removeDocument(this.props.CollectionView);
}
- this.props.addDocument(dropped, false);
+ this.props.addDocument(de.data.droppedDocument, false);
+ e.stopPropagation();
}
- e.stopPropagation();
}
@action
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index e98815fa6..9e34b2b60 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -163,17 +163,16 @@ export class DocumentView extends React.Component<DocumentViewProps> {
startDragging(x: number, y: number, dropAliasOfDraggedDoc: boolean) {
if (this._mainCont.current) {
const [left, top] = this.props.ScreenToLocalTransform().inverse().transformPoint(0, 0);
- let dragData: { [id: string]: any } = {};
- dragData["aliasOnDrop"] = dropAliasOfDraggedDoc;
- dragData["draggedDocument"] = this.props.Document;
- dragData["xOffset"] = x - left;
- dragData["yOffset"] = y - top;
- dragData["removeDocument"] = (dropCollectionView: CollectionView) => {
+ let dragData = new DragManager.DocumentDragData(this.props.Document);
+ dragData.aliasOnDrop = dropAliasOfDraggedDoc;
+ dragData.xOffset = x - left;
+ dragData.yOffset = y - top;
+ dragData.removeDocument = (dropCollectionView: CollectionView) => {
if (this.props.RemoveDocument && this.props.ContainingCollectionView !== dropCollectionView) {
this.props.RemoveDocument(this.props.Document);
}
}
- DragManager.StartDrag(this._mainCont.current, dragData, {
+ DragManager.StartDocumentDrag(this._mainCont.current, dragData, {
handlers: {
dragComplete: action(() => { }),
},
@@ -235,27 +234,25 @@ export class DocumentView extends React.Component<DocumentViewProps> {
@action
drop = (e: Event, de: DragManager.DropEvent) => {
- const sourceDocView: DocumentView = de.data["linkSourceDoc"];
- if (!sourceDocView) {
- return;
- }
- let sourceDoc: Document = sourceDocView.props.Document;
- let destDoc: Document = this.props.Document;
- if (this.props.isTopMost) {
- return;
- }
- let linkDoc: Document = new Document();
+ if (de.data instanceof DragManager.LinkDragData) {
+ let sourceDoc: Document = de.data.linkSourceDocumentView.props.Document;
+ let destDoc: Document = this.props.Document;
+ if (this.props.isTopMost) {
+ return;
+ }
+ let linkDoc: Document = new Document();
- linkDoc.Set(KeyStore.Title, new TextField("New Link"));
- linkDoc.Set(KeyStore.LinkDescription, new TextField(""));
- linkDoc.Set(KeyStore.LinkTags, new TextField("Default"));
+ linkDoc.Set(KeyStore.Title, new TextField("New Link"));
+ linkDoc.Set(KeyStore.LinkDescription, new TextField(""));
+ linkDoc.Set(KeyStore.LinkTags, new TextField("Default"));
- sourceDoc.GetOrCreateAsync(KeyStore.LinkedToDocs, ListField, field => { (field as ListField<Document>).Data.push(linkDoc) });
- linkDoc.Set(KeyStore.LinkedToDocs, destDoc);
- destDoc.GetOrCreateAsync(KeyStore.LinkedFromDocs, ListField, field => { (field as ListField<Document>).Data.push(linkDoc) });
- linkDoc.Set(KeyStore.LinkedFromDocs, sourceDoc);
+ sourceDoc.GetOrCreateAsync(KeyStore.LinkedToDocs, ListField, field => { (field as ListField<Document>).Data.push(linkDoc) });
+ linkDoc.Set(KeyStore.LinkedToDocs, destDoc);
+ destDoc.GetOrCreateAsync(KeyStore.LinkedFromDocs, ListField, field => { (field as ListField<Document>).Data.push(linkDoc) });
+ linkDoc.Set(KeyStore.LinkedFromDocs, sourceDoc);
- e.stopPropagation();
+ e.stopPropagation();
+ }
}
onDrop = (e: React.DragEvent) => {
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-07 21:30:20 +0000