aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/DocumentDecorations.tsx25
-rw-r--r--src/client/views/nodes/DocumentView.tsx3
-rw-r--r--src/client/views/nodes/LinkBox.scss39
-rw-r--r--src/client/views/nodes/LinkBox.tsx62
-rw-r--r--src/client/views/nodes/LinkEditor.scss0
-rw-r--r--src/client/views/nodes/LinkEditor.tsx0
-rw-r--r--src/client/views/nodes/LinkMenu.scss2
-rw-r--r--src/client/views/nodes/LinkMenu.tsx27
8 files changed, 134 insertions, 24 deletions
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 29a4bbcf1..22d34127d 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -1,4 +1,4 @@
-import { observable, computed } from "mobx";
+import { observable, computed, action } from "mobx";
import React = require("react");
import { SelectionManager } from "../util/SelectionManager";
import { observer } from "mobx-react";
@@ -197,6 +197,18 @@ export class DocumentDecorations extends React.Component {
console.log("DocumentDecorations: Bounds Error")
return (null);
}
+
+ let linkButton = null;
+ if (SelectionManager.SelectedDocuments().length > 0) {
+ linkButton = (<Flyout
+ anchorPoint={anchorPoints.RIGHT_TOP}
+ content={
+ <LinkMenu docView={SelectionManager.SelectedDocuments()[0]}>
+ </LinkMenu>
+ }>
+ <div id="linkButton" onPointerDown={this.onLinkButtonDown} ref={this._linkButton}></div>
+ </Flyout>);
+ }
return (
<div id="documentDecorations-container" style={{
width: (bounds.r - bounds.x + 40) + "px",
@@ -214,16 +226,7 @@ export class DocumentDecorations extends React.Component {
<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>
- <Flyout
- anchorPoint={anchorPoints.RIGHT_TOP}
- content={
- <LinkMenu docView={SelectionManager.SelectedDocuments()[0]}>
- </LinkMenu>
- }
-
- >
- <div id="linkButton" onPointerDown={this.onLinkButtonDown} ref={this._linkButton}></div>
- </Flyout>
+ {linkButton}
</div >
)
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index e69485b9a..220f7017e 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -204,6 +204,9 @@ export class DocumentView extends React.Component<DocumentViewProps> {
}
let sourceDoc: Document = sourceDocView.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"));
diff --git a/src/client/views/nodes/LinkBox.scss b/src/client/views/nodes/LinkBox.scss
index e69de29bb..3ae8ed666 100644
--- a/src/client/views/nodes/LinkBox.scss
+++ b/src/client/views/nodes/LinkBox.scss
@@ -0,0 +1,39 @@
+.link-container {
+ width: 100%;
+ height: 30px;
+ display: flex;
+ flex-direction: row;
+ border-top: 0.5px solid #bababa;
+}
+
+.info-container {
+ width: 60%;
+ padding-top: 10px;
+ padding-left: 5px;
+ display: flex;
+ flex-direction: column
+}
+
+.link-name {
+ font-size: 11px;
+}
+
+.doc-name {
+ font-size: 8px;
+}
+
+.button-container {
+ width: 40%;
+ display: flex;
+ flex-direction: row;
+}
+
+.button {
+ height: 15px;
+ width: 15px;
+ margin: 8px 5px;
+ border-radius: 50%;
+ opacity: 0.6;
+ pointer-events: auto;
+ background-color: #2B6091;
+} \ No newline at end of file
diff --git a/src/client/views/nodes/LinkBox.tsx b/src/client/views/nodes/LinkBox.tsx
index e69de29bb..d6cb1f612 100644
--- a/src/client/views/nodes/LinkBox.tsx
+++ b/src/client/views/nodes/LinkBox.tsx
@@ -0,0 +1,62 @@
+import { observable, computed, action } from "mobx";
+import React = require("react");
+import { SelectionManager } from "../../util/SelectionManager";
+import { observer } from "mobx-react";
+import './LinkBox.scss'
+import { KeyStore } from '../../../fields/KeyStore'
+import { props } from "bluebird";
+import { DocumentView } from "./DocumentView";
+import { Document } from "../../../fields/Document";
+import { ListField } from "../../../fields/ListField";
+
+interface Props {
+ linkDoc: Document;
+ linkName: String;
+ // pairedDoc: Document;
+}
+
+@observer
+export class LinkBox extends React.Component<Props> {
+
+ onViewButtonPressed = (e: React.PointerEvent): void => {
+ console.log("view down");
+ e.stopPropagation();
+ }
+
+ onEditButtonPressed = (e: React.PointerEvent): void => {
+ console.log("edit down");
+ e.stopPropagation();
+ }
+
+ onDeleteButtonPressed = (e: React.PointerEvent): void => {
+ console.log("delete down");
+ e.stopPropagation();
+ let linkToDoc: Document = this.props.linkDoc.GetData(KeyStore.LinkedToDocs, ListField, [])[0];
+ let linkFromDoc: Document = this.props.linkDoc.GetData(KeyStore.LinkedFromDocs, ListField, [])[0];
+
+ // let linkToDocFromDocs: Document[] = linkToDoc.GetData(KeyStore.LinkedFromDocs, ListField, []);
+ // linkToDocFromDocs.
+ }
+
+ render() {
+
+ return (
+ <div className="link-container">
+ <div className="info-container">
+ <div className="link-name">
+ <p>{this.props.linkName}</p>
+ </div>
+ {/* <div className="doc-name">
+ <p>{this.props.pairedDoc.Title}</p>
+ </div> */}
+ </div>
+
+ <div className="button-container">
+ <div className="button" onPointerDown={this.onViewButtonPressed}></div>
+ <div className="button" onPointerDown={this.onEditButtonPressed}></div>
+ <div className="button" onPointerDown={this.onDeleteButtonPressed}></div>
+ </div>
+ </div>
+ )
+ }
+} \ No newline at end of file
diff --git a/src/client/views/nodes/LinkEditor.scss b/src/client/views/nodes/LinkEditor.scss
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/src/client/views/nodes/LinkEditor.scss
diff --git a/src/client/views/nodes/LinkEditor.tsx b/src/client/views/nodes/LinkEditor.tsx
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/src/client/views/nodes/LinkEditor.tsx
diff --git a/src/client/views/nodes/LinkMenu.scss b/src/client/views/nodes/LinkMenu.scss
index fac6ba2b5..af5b84ec6 100644
--- a/src/client/views/nodes/LinkMenu.scss
+++ b/src/client/views/nodes/LinkMenu.scss
@@ -13,8 +13,8 @@
}
#link-list {
+ margin-top: 5px;
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
index 9e01de4cd..4a1f49864 100644
--- a/src/client/views/nodes/LinkMenu.tsx
+++ b/src/client/views/nodes/LinkMenu.tsx
@@ -4,38 +4,41 @@ 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 { LinkBox } from "./LinkBox"
import { Document } from "../../../fields/Document";
+import { ListField } from "../../../fields/ListField";
+import { TextField } from "../../../fields/TextField";
interface Props {
- docView: DocumentView | undefined;
+ docView: DocumentView;
}
@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);
- // }
+ //get list of links from document
+ let linkFrom: Document[] = this.props.docView.props.Document.GetData(KeyStore.LinkedFromDocs, ListField, []);
+ let linkTo: Document[] = this.props.docView.props.Document.GetData(KeyStore.LinkedToDocs, ListField, []);
return (
<div id="menu-container">
<input id="search-bar" type="text" placeholder="Search..."></input>
<div id="link-list">
+ {linkTo.map(link => {
+ let name = link.GetData(KeyStore.Title, TextField, new String);
+ return <LinkBox linkDoc={link} linkName={name} />
+ })}
+
+ {linkFrom.map(link => {
+ return <LinkBox linkDoc={link} linkName={name} />
+ })}
</div>
</div>
)
}
-
} \ No newline at end of file