aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/.DS_Storebin6148 -> 6148 bytes
-rw-r--r--src/client/util/DragManager.ts1
-rw-r--r--src/client/views/.DS_Storebin0 -> 6148 bytes
-rw-r--r--src/client/views/DocumentDecorations.scss11
-rw-r--r--src/client/views/DocumentDecorations.tsx64
-rw-r--r--src/client/views/collections/CollectionFreeFormView.tsx3
-rw-r--r--src/client/views/nodes/DocumentView.tsx51
-rw-r--r--src/client/views/nodes/LinkBox.scss0
-rw-r--r--src/client/views/nodes/LinkBox.tsx0
-rw-r--r--src/client/views/nodes/LinkMenu.scss20
-rw-r--r--src/client/views/nodes/LinkMenu.tsx41
-rw-r--r--src/fields/KeyStore.ts2
12 files changed, 190 insertions, 3 deletions
diff --git a/src/.DS_Store b/src/.DS_Store
index 4d6acb95a..f20f36d63 100644
--- a/src/.DS_Store
+++ b/src/.DS_Store
Binary files differ
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/.DS_Store b/src/client/views/.DS_Store
new file mode 100644
index 000000000..6bd614c8b
--- /dev/null
+++ b/src/client/views/.DS_Store
Binary files differ
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss
index e8b93a18b..f88bf9c14 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: 20px;
+ width: 20px;
+ 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 9fd73a33b..29a4bbcf1 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -5,12 +5,19 @@ 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";
+import { LinkMenu } from "./nodes/LinkMenu";
+const higflyout = require("@hig/flyout");
+const { anchorPoints } = higflyout;
+const Flyout = higflyout.default;
@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 +59,46 @@ export class DocumentDecorations extends React.Component {
}
}
+ onLinkButtonDown = (e: React.PointerEvent): void => {
+ // if ()
+ // let linkMenu = new LinkMenu(SelectionManager.SelectedDocuments()[0]);
+ // linkMenu.Hidden = false;
+ 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();
@@ -137,6 +184,9 @@ export class DocumentDecorations extends React.Component {
document.removeEventListener("pointerup", this.onPointerUp);
}
}
+ // buttonOnPointerUp = (e: React.PointerEvent): void => {
+ // e.stopPropagation();
+ // }
render() {
var bounds = this.Bounds;
@@ -163,7 +213,19 @@ 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>
+
+ <Flyout
+ anchorPoint={anchorPoints.RIGHT_TOP}
+ content={
+ <LinkMenu docView={SelectionManager.SelectedDocuments()[0]}>
+ </LinkMenu>
+ }
+
+ >
+ <div id="linkButton" onPointerDown={this.onLinkButtonDown} ref={this._linkButton}></div>
+ </Flyout>
+
+ </div >
)
}
} \ No newline at end of file
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index f71f2791c..bc2c1c68d 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 e01e1d4cd..d31441399 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -109,6 +109,36 @@ export class DocumentView extends React.Component<DocumentViewProps> {
}
}
}
+<<<<<<< HEAD
+
+ 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();
+ }
+ }
+
+=======
+>>>>>>> bb1d3120f11a47e9d493202c1003dae52bf6667f
onPointerMove = (e: PointerEvent): void => {
if (e.cancelBubble) {
return;
@@ -168,6 +198,27 @@ 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;
+ let linkDoc: Document = new Document();
+
+ sourceDoc.GetOrCreateAsync(KeyStore.LinkedToDocs, ListField, field => { (field as ListField<Document>).Data.push(linkDoc) });
+ linkDoc.GetOrCreateAsync(KeyStore.LinkedToDocs, ListField, field => { (field as ListField<Document>).Data.push(destDoc) });
+ destDoc.GetOrCreateAsync(KeyStore.LinkedFromDocs, ListField, field => { (field as ListField<Document>).Data.push(linkDoc) });
+ linkDoc.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/client/views/nodes/LinkBox.scss b/src/client/views/nodes/LinkBox.scss
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/src/client/views/nodes/LinkBox.scss
diff --git a/src/client/views/nodes/LinkBox.tsx b/src/client/views/nodes/LinkBox.tsx
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/src/client/views/nodes/LinkBox.tsx
diff --git a/src/client/views/nodes/LinkMenu.scss b/src/client/views/nodes/LinkMenu.scss
new file mode 100644
index 000000000..fac6ba2b5
--- /dev/null
+++ b/src/client/views/nodes/LinkMenu.scss
@@ -0,0 +1,20 @@
+#menu-container {
+ width: 100%;
+ height: auto;
+ display: flex;
+ flex-direction: column;
+}
+
+#search-bar {
+ width: 100%;
+ padding: 5px;
+ margin-bottom: 10px;
+ font-size: 12px;
+}
+
+#link-list {
+ width: 100%;
+ height: 100px;
+ overflow-y: scroll;
+ background: black;
+} \ No newline at end of file
diff --git a/src/client/views/nodes/LinkMenu.tsx b/src/client/views/nodes/LinkMenu.tsx
new file mode 100644
index 000000000..9e01de4cd
--- /dev/null
+++ b/src/client/views/nodes/LinkMenu.tsx
@@ -0,0 +1,41 @@
+import { observable, computed, action } from "mobx";
+import React = require("react");
+import { SelectionManager } from "../../util/SelectionManager";
+import { observer } from "mobx-react";
+import './LinkMenu.scss'
+import { KeyStore } from '../../../fields/KeyStore'
+import { NumberField } from "../../../fields/NumberField";
+import { props } from "bluebird";
+import { DragManager } from "../../util/DragManager";
+import { DocumentView } from "./DocumentView";
+import { Document } from "../../../fields/Document";
+
+interface Props {
+ docView: DocumentView | undefined;
+}
+
+@observer
+export class LinkMenu extends React.Component<Props> {
+ // @observable private _hidden = true;
+
+ // @computed
+ // public get Hidden() { return this._hidden; }
+ // public set Hidden(value: boolean) { this._hidden = value; }
+
+ render() {
+ // if (this.Hidden) {
+ // return (null);
+ // }
+
+ return (
+ <div id="menu-container">
+ <input id="search-bar" type="text" placeholder="Search..."></input>
+ <div id="link-list">
+
+ </div>
+
+ </div>
+ )
+ }
+
+} \ No newline at end of file
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");
}