aboutsummaryrefslogtreecommitdiff
path: root/src/client
diff options
context:
space:
mode:
Diffstat (limited to 'src/client')
-rw-r--r--src/client/views/DocumentManager.tsx51
-rw-r--r--src/client/views/Main.tsx80
-rw-r--r--src/client/views/TempTreeView.scss12
-rw-r--r--src/client/views/TempTreeView.tsx47
-rw-r--r--src/client/views/nodes/DocumentView.tsx17
5 files changed, 167 insertions, 40 deletions
diff --git a/src/client/views/DocumentManager.tsx b/src/client/views/DocumentManager.tsx
new file mode 100644
index 000000000..b69d40148
--- /dev/null
+++ b/src/client/views/DocumentManager.tsx
@@ -0,0 +1,51 @@
+import React = require('react')
+import { observer } from 'mobx-react';
+import { observable, action } from 'mobx';
+import { DocumentView } from './nodes/DocumentView';
+import { Document } from "../../fields/Document"
+
+
+export class DocumentManager {
+
+ //global holds all of the nodes (regardless of which collection they're in)
+ @observable
+ public DocumentViews: DocumentView[];
+
+ // singleton instance
+ private static _instance: DocumentManager;
+
+ // create one and only one instance of NodeManager
+ public static get Instance(): DocumentManager {
+ return this._instance || (this._instance = new this());
+ }
+
+ //private constructor so no other class can create a nodemanager
+ private constructor() {
+ this.DocumentViews = new Array<DocumentView>();
+ }
+
+ public getDocumentView(toFind: Document): DocumentView | null {
+
+ let toReturn: DocumentView | null;
+ toReturn = null;
+
+ DocumentManager.Instance.DocumentViews.map(view => {
+ let doc = view.props.Document;
+ if (Object.is(doc, toFind)) {
+ toReturn = view;
+ return;
+ }
+ })
+
+ return (toReturn);
+ }
+
+ public centerNode(doc: DocumentView) {
+
+ }
+
+ public setPosition(doc: DocumentView) {
+
+ }
+
+} \ No newline at end of file
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index c7ad3e249..17abceedf 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -10,9 +10,10 @@ import { ListField } from '../../fields/ListField';
import { NumberField } from '../../fields/NumberField';
import { TextField } from '../../fields/TextField';
import "./Main.scss";
-import { ContextMenu } from './ContextMenu';
-import { DocumentView } from './nodes/DocumentView';
-import { ImageField } from '../../fields/ImageField';
+import { ContextMenu } from './../views/ContextMenu';
+import { DocumentView } from './../views/nodes/DocumentView';
+import { CompileScript } from './../util/Scripting';
+import { TempTreeView } from './../views/TempTreeView';
import { Transform } from '../util/Transform';
@@ -39,43 +40,41 @@ document.addEventListener("pointerdown", action(function (e: PointerEvent) {
//runInAction(() =>
-{
- let doc1 = Documents.TextDocument({ title: "hello", width: 400, height: 300 });
- let doc2 = doc1.MakeDelegate();
- doc2.Set(KS.X, new NumberField(150));
- doc2.Set(KS.Y, new NumberField(20));
- let doc3 = Documents.ImageDocument("https://psmag.com/.image/t_share/MTMyNzc2NzM1MDY1MjgzMDM4/shutterstock_151341212jpg.jpg", {
- x: 450, y: 100, title: "cat 1", width: 606, height: 386, nativeWidth: 606, nativeHeight: 386
- });
- //doc3.Set(KeyStore.Data, new ImageField);
- const schemaDocs = Array.from(Array(5).keys()).map(v => Documents.ImageDocument("https://psmag.com/.image/t_share/MTMyNzc2NzM1MDY1MjgzMDM4/shutterstock_151341212jpg.jpg", {
- x: 50 + 100 * v, y: 50, width: 100, height: 100, title: "cat" + v, nativeWidth: 606, nativeHeight: 386
- }));
- schemaDocs[0].SetData(KS.Author, "Tyler", TextField);
- schemaDocs[4].SetData(KS.Author, "Bob", TextField);
- schemaDocs.push(doc2);
- const doc7 = Documents.SchemaDocument(schemaDocs)
- const docset = [doc1, doc2, doc3, doc7];
- let doc4 = Documents.CollectionDocument(docset, {
- x: 0, y: 400, title: "mini collection"
- });
- // let doc5 = Documents.ImageDocument("https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg", {
- // x: 650, y: 500, width: 600, height: 600, title: "cat 2"
- // });
- let docset2 = [doc3, doc1, doc2];
- let doc6 = Documents.CollectionDocument(docset2, {
- x: 350, y: 100, width: 600, height: 600, title: "docking collection"
- });
- let mainNodes = mainContainer.GetOrCreate<ListField<Document>>(KeyStore.Data, ListField);
- // mainNodes.Data.push(doc6);
- // mainNodes.Data.push(doc2);
- mainNodes.Data.push(doc4);
- mainNodes.Data.push(doc3);
- // mainNodes.Data.push(doc5);
- // mainNodes.Data.push(doc1);
- // mainNodes.Data.push(doc2);
- mainNodes.Data.push(doc6);
-}
+let doc1 = Documents.TextDocument({ title: "hello", width: 400, height: 300 });
+let doc2 = doc1.MakeDelegate();
+doc2.Set(KS.X, new NumberField(150));
+doc2.Set(KS.Y, new NumberField(20));
+let doc3 = Documents.ImageDocument("https://psmag.com/.image/t_share/MTMyNzc2NzM1MDY1MjgzMDM4/shutterstock_151341212jpg.jpg", {
+ x: 450, y: 100, title: "cat 1", width: 606, height: 386, nativeWidth: 606, nativeHeight: 386
+});
+//doc3.Set(KeyStore.Data, new ImageField);
+const schemaDocs = Array.from(Array(5).keys()).map(v => Documents.ImageDocument("https://psmag.com/.image/t_share/MTMyNzc2NzM1MDY1MjgzMDM4/shutterstock_151341212jpg.jpg", {
+ x: 50 + 100 * v, y: 50, width: 100, height: 100, title: "cat" + v, nativeWidth: 606, nativeHeight: 386
+}));
+schemaDocs[0].SetData(KS.Author, "Tyler", TextField);
+schemaDocs[4].SetData(KS.Author, "Bob", TextField);
+schemaDocs.push(doc2);
+const doc7 = Documents.SchemaDocument(schemaDocs)
+const docset = [doc1, doc2, doc3, doc7];
+let doc4 = Documents.CollectionDocument(docset, {
+ x: 0, y: 400, title: "mini collection"
+});
+// let doc5 = Documents.ImageDocument("https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg", {
+// x: 650, y: 500, width: 600, height: 600, title: "cat 2"
+// });
+let docset2 = [doc3, doc1, doc2];
+let doc6 = Documents.CollectionDocument(docset2, {
+ x: 350, y: 100, width: 600, height: 600, title: "docking collection"
+});
+let mainNodes = mainContainer.GetOrCreate<ListField<Document>>(KeyStore.Data, ListField);
+// mainNodes.Data.push(doc6);
+// mainNodes.Data.push(doc2);
+mainNodes.Data.push(doc4);
+mainNodes.Data.push(doc3);
+// mainNodes.Data.push(doc5);
+// mainNodes.Data.push(doc1);
+// mainNodes.Data.push(doc2);
+mainNodes.Data.push(doc6);
//}
//);
@@ -88,5 +87,6 @@ ReactDOM.render((
ContainingCollectionView={undefined} DocumentView={undefined} />
<DocumentDecorations />
<ContextMenu />
+ <TempTreeView mainCollection={mainNodes.Data} />
</div>),
document.getElementById('root')); \ No newline at end of file
diff --git a/src/client/views/TempTreeView.scss b/src/client/views/TempTreeView.scss
new file mode 100644
index 000000000..c50b5be2c
--- /dev/null
+++ b/src/client/views/TempTreeView.scss
@@ -0,0 +1,12 @@
+.temptree {
+ background: #ADD8E6;
+ width: 300px;
+ height: 100px;
+ z-index: 100;
+ position: fixed;
+ bottom: 0px;
+ .list {
+ padding: 5px;
+ color: #1e5162;
+ }
+} \ No newline at end of file
diff --git a/src/client/views/TempTreeView.tsx b/src/client/views/TempTreeView.tsx
new file mode 100644
index 000000000..8dd256c8a
--- /dev/null
+++ b/src/client/views/TempTreeView.tsx
@@ -0,0 +1,47 @@
+import { observable, computed } from "mobx";
+import React = require("react");
+import { observer } from "mobx-react";
+import { Document } from "../../fields/Document";
+import { ListField } from "../../fields/ListField";
+import "./TempTreeView.scss"
+import { DocumentManager } from "./DocumentManager";
+
+export interface IProps {
+ mainCollection: Array<Document>;
+}
+
+@observer
+export class TempTreeView extends React.Component<IProps>{
+
+ onClick(doc: Document) {
+ let view = DocumentManager.Instance.getDocumentView(doc);
+ if (view != null) {
+ console.log(view.Id)
+ console.log(view.props.Document.Title)
+ if (view.props.ContainingCollectionView != undefined) {
+ //console.log(view.props.ContainingCollectionView.Id)
+ }
+ else {
+ console.log("containing collection is undefined")
+ }
+ }
+ }
+
+ render() {
+ return (
+ <div className="tempTree">
+ <div className="list">
+ {this.props.mainCollection.map(doc => {
+ return (
+ <div key={doc.Id} onClick={() => { this.onClick(doc) }}>
+ {doc.Title}
+ </div>
+ )
+ }
+ )}
+ </div>
+ </div>
+ );
+ }
+
+} \ No newline at end of file
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index cb080c08e..bc27c424c 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -16,6 +16,7 @@ import { ImageBox } from "../nodes/ImageBox";
import "./NodeView.scss";
import React = require("react");
import { Transform } from "../../util/Transform";
+import { DocumentManager } from "../DocumentManager";
import { SelectionManager } from "../../util/SelectionManager";
import { DragManager } from "../../util/DragManager";
import { ContextMenu } from "../ContextMenu";
@@ -36,6 +37,9 @@ export interface DocumentViewProps {
@observer
export class DocumentView extends React.Component<DocumentViewProps> {
+ public Id: string = Utils.GenerateGuid();
+ public tempTitle: string = "hello there"
+
private _mainCont = React.createRef<HTMLDivElement>();
get MainContent() {
return this._mainCont;
@@ -210,6 +214,19 @@ export class DocumentView extends React.Component<DocumentViewProps> {
return 1;
}
+ //adds doc to global list
+ componentDidMount: () => void = () => {
+ DocumentManager.Instance.DocumentViews.push(this);
+ }
+
+ //removes doc from global list
+ componentWillUnmount: () => void = () => {
+ for (let node of DocumentManager.Instance.DocumentViews) {
+ if (Object.is(node, this)) {
+ DocumentManager.Instance.DocumentViews.splice(DocumentManager.Instance.DocumentViews.indexOf(this), 1);
+ }
+ }
+ }
isSelected = () => {
return SelectionManager.IsSelected(this);
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-12-07 16:10:25 +0000