aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/util/DragManager.ts1
-rw-r--r--src/client/views/DocumentDecorations.scss11
-rw-r--r--src/client/views/DocumentDecorations.tsx44
-rw-r--r--src/client/views/collections/CollectionFreeFormView.tsx3
-rw-r--r--src/client/views/nodes/DocumentView.tsx42
-rw-r--r--src/fields/KeyStore.ts2
6 files changed, 100 insertions, 3 deletions
diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index 60910a40b..95bf44560 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -95,7 +95,6 @@ export namespace DragManager {
}
export function StartDrag(ele: HTMLElement, dragData: { [id: string]: any }, options?: DragOptions) {
- DocumentDecorations.Instance.Hidden = true;
if (!dragDiv) {
dragDiv = document.createElement("div");
DragManager.Root().appendChild(dragDiv);
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss
index e8b93a18b..ca7896088 100644
--- a/src/client/views/DocumentDecorations.scss
+++ b/src/client/views/DocumentDecorations.scss
@@ -2,7 +2,7 @@
position: absolute;
display: grid;
z-index: 1000;
- grid-template-rows: 20px 1fr 20px;
+ grid-template-rows: 20px 1fr 20px 0px;
grid-template-columns: 20px 1fr 20px;
pointer-events: none;
#documentDecorations-centerCont {
@@ -29,4 +29,13 @@
#documentDecorations-rightResizer {
cursor: ew-resize;
}
+ #linkButton {
+ height: 25px;
+ width: 25px;
+ margin-top: 10px;
+ border-radius: 50%;
+ opacity: 0.6;
+ pointer-events: auto;
+ background-color: #2B6091;
+ }
} \ No newline at end of file
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 975a125f7..fb8a724c5 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -5,12 +5,16 @@ import { observer } from "mobx-react";
import './DocumentDecorations.scss'
import { KeyStore } from '../../fields/KeyStore'
import { NumberField } from "../../fields/NumberField";
+import { props } from "bluebird";
+import { DragManager } from "../util/DragManager";
+
@observer
export class DocumentDecorations extends React.Component {
static Instance: DocumentDecorations
private _resizer = ""
private _isPointerDown = false;
+ private _linkButton = React.createRef<HTMLDivElement>();
@observable private _hidden = false;
constructor(props: Readonly<{}>) {
@@ -52,6 +56,42 @@ export class DocumentDecorations extends React.Component {
}
}
+ onLinkButtonDown = (e: React.PointerEvent): void => {
+ console.log("down");
+ e.stopPropagation();
+ document.removeEventListener("pointermove", this.onLinkButtonMoved)
+ document.addEventListener("pointermove", this.onLinkButtonMoved);
+ document.removeEventListener("pointerup", this.onLinkButtonUp)
+ document.addEventListener("pointerup", this.onLinkButtonUp);
+
+ }
+
+ onLinkButtonUp = (e: PointerEvent): void => {
+ console.log("up");
+ document.removeEventListener("pointermove", this.onLinkButtonMoved)
+ document.removeEventListener("pointerup", this.onLinkButtonUp)
+ e.stopPropagation();
+ }
+
+
+ onLinkButtonMoved = (e: PointerEvent): void => {
+ console.log("moved");
+ let dragData: { [id: string]: any } = {};
+ dragData["linkSourceDoc"] = SelectionManager.SelectedDocuments()[0];
+ if (this._linkButton.current != null) {
+ DragManager.StartDrag(this._linkButton.current, dragData, {
+ handlers: {
+ dragComplete: action(() => { }),
+ },
+ hideSource: false
+ })
+ }
+ document.removeEventListener("pointermove", this.onLinkButtonMoved)
+ document.removeEventListener("pointerup", this.onLinkButtonUp)
+ e.stopPropagation();
+ }
+
+
onPointerMove = (e: PointerEvent): void => {
e.stopPropagation();
e.preventDefault();
@@ -163,7 +203,9 @@ export class DocumentDecorations extends React.Component {
<div id="documentDecorations-bottomLeftResizer" className="documentDecorations-resizer" onPointerDown={this.onPointerDown} onContextMenu={(e) => e.preventDefault()}></div>
<div id="documentDecorations-bottomResizer" className="documentDecorations-resizer" onPointerDown={this.onPointerDown} onContextMenu={(e) => e.preventDefault()}></div>
<div id="documentDecorations-bottomRightResizer" className="documentDecorations-resizer" onPointerDown={this.onPointerDown} onContextMenu={(e) => e.preventDefault()}></div>
- </div>
+ <div id="linkButton" onPointerDown={this.onLinkButtonDown} ref={this._linkButton}></div>
+
+ </div >
)
}
} \ No newline at end of file
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index 5e9dcd5d5..11f9a8148 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -53,6 +53,9 @@ export class CollectionFreeFormView extends CollectionViewBase {
@undoBatch
@action
drop = (e: Event, de: DragManager.DropEvent) => {
+ if (!("documentView" in de.data)) {
+ return;
+ }
super.drop(e, de);
const docView: DocumentView = de.data["documentView"];
let doc: Document = docView ? docView.props.Document : de.data["document"];
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 19a455b74..6dab62998 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -116,6 +116,32 @@ export class DocumentView extends React.Component<DocumentViewProps> {
}
}
+ private dropDisposer?: DragManager.DragDropDisposer;
+ protected createDropTarget = (ele: HTMLDivElement) => {
+
+ }
+
+ componentDidMount() {
+ if (this._mainCont.current) {
+ this.dropDisposer = DragManager.MakeDropTarget(this._mainCont.current, { handlers: { drop: this.drop.bind(this) } });
+ }
+ }
+
+ componentDidUpdate() {
+ if (this.dropDisposer) {
+ this.dropDisposer();
+ }
+ if (this._mainCont.current) {
+ this.dropDisposer = DragManager.MakeDropTarget(this._mainCont.current, { handlers: { drop: this.drop.bind(this) } });
+ }
+ }
+
+ componentWillUnmount() {
+ if (this.dropDisposer) {
+ this.dropDisposer();
+ }
+ }
+
onPointerMove = (e: PointerEvent): void => {
if (e.cancelBubble) {
return;
@@ -176,6 +202,22 @@ export class DocumentView extends React.Component<DocumentViewProps> {
}
@action
+ drop = (e: Event, de: DragManager.DropEvent) => {
+ console.log("drop");
+ const sourceDocView: DocumentView = de.data["linkSourceDoc"];
+ if (!sourceDocView) {
+ return;
+ }
+ let sourceDoc: Document = sourceDocView.props.Document;
+ let destDoc: Document = this.props.Document;
+
+ sourceDoc.GetOrCreateAsync(KeyStore.LinkedToDocs, ListField, field => { (field as ListField<Document>).Data.push(destDoc) });
+ destDoc.GetOrCreateAsync(KeyStore.LinkedFromDocs, ListField, field => { (field as ListField<Document>).Data.push(sourceDoc) });
+
+ e.stopPropagation();
+ }
+
+ @action
onContextMenu = (e: React.MouseEvent): void => {
e.stopPropagation();
let moved = Math.abs(this._downX - e.clientX) > 3 || Math.abs(this._downY - e.clientY) > 3;
diff --git a/src/fields/KeyStore.ts b/src/fields/KeyStore.ts
index a3b39735d..9c3dab6de 100644
--- a/src/fields/KeyStore.ts
+++ b/src/fields/KeyStore.ts
@@ -26,4 +26,6 @@ export namespace KeyStore {
export const Caption = new Key("Caption");
export const ActiveFrame = new Key("ActiveFrame");
export const DocumentText = new Key("DocumentText");
+ export const LinkedToDocs = new Key("LinkedToDocs");
+ export const LinkedFromDocs = new Key("LinkedFromDocs");
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-11 05:07:21 +0000