aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/Main.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/Main.tsx')
-rw-r--r--src/client/views/Main.tsx176
1 files changed, 124 insertions, 52 deletions
diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index a86fdb9b0..f44ad0a74 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -1,28 +1,26 @@
-import { action, configure } from 'mobx';
+import { action, configure, reaction, computed } from 'mobx';
import "normalize.css";
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { DocumentDecorations } from './DocumentDecorations';
import { Documents } from '../documents/Documents';
import { Document } from '../../fields/Document';
-import { KeyStore, KeyStore as KS } from '../../fields/Key';
-import { ListField } from '../../fields/ListField';
-import { NumberField } from '../../fields/NumberField';
-import { TextField } from '../../fields/TextField';
+import { KeyStore } from '../../fields/KeyStore';
import "./Main.scss";
import { ContextMenu } from './ContextMenu';
import { DocumentView } from './nodes/DocumentView';
-import { ImageField } from '../../fields/ImageField';
+import { Server } from '../Server';
+import { Utils } from '../../Utils';
+import { ServerUtils } from '../../server/ServerUtil';
+import { MessageStore, DocumentTransfer } from '../../server/Message';
import { Transform } from '../util/Transform';
import { CollectionDockingView } from './collections/CollectionDockingView';
+import { FieldWaiting } from '../../fields/Field';
configure({
enforceActions: "observed"
});
-
-const mainNodeCollection = new Array<Document>();
-
window.addEventListener("drop", function (e) {
e.preventDefault();
}, false)
@@ -36,50 +34,124 @@ document.addEventListener("pointerdown", action(function (e: PointerEvent) {
}), true)
-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: "dog", 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.push(doc3);
-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"
+//runInAction(() =>
+// let doc1 = Documents.TextDocument({ title: "hello" });
+// let doc2 = doc1.MakeDelegate();
+// doc2.Set(KS.X, new NumberField(150));
+// doc2.Set(KS.Y, new NumberField(20));
+// let doc3 = Documents.ImageDocument("https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg", {
+// x: 450, y: 100, title: "cat 1"
+// });
+// doc3.Set(KeyStore.Data, new ImageField);
+// const schemaDocs = Array.from(Array(5).keys()).map(v => Documents.ImageDocument("https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg", {
+// x: 50 + 100 * v, y: 50, width: 100, height: 100, title: "cat" + v
+// }));
+// schemaDocs[0].SetData(KS.Author, "Tyler", TextField);
+// schemaDocs[4].SetData(KS.Author, "Bob", TextField);
+// schemaDocs.push(doc2);
+// const doc7 = Documents.SchemaDocument(schemaDocs)
+
+const mainDocId = "mainDoc";
+Documents.initProtos(() => {
+ Utils.EmitCallback(Server.Socket, MessageStore.GetField, mainDocId, (res: any) => {
+ console.log("HELLO WORLD")
+ console.log("RESPONSE: " + res)
+ let mainContainer: Document;
+ let mainfreeform: Document;
+ if (res) {
+ mainContainer = ServerUtils.FromJson(res) as Document;
+ var mainfreeformid = mainContainer._proxies.get(KeyStore.ActiveFrame.Id)!;
+ Server.GetField(mainfreeformid, (field) => {
+ if (field) {
+ mainfreeform = field as Document;
+ }
+ })
+ mainfreeform = mainContainer.Get(KeyStore.ActiveFrame) as Document;
+ }
+ else {
+ mainfreeform = Documents.CollectionDocument([], { x: 0, y: 400, title: "mini collection" });
+ Utils.Emit(Server.Socket, MessageStore.AddDocument, new DocumentTransfer(mainfreeform.ToJson()));
+
+ var docs = [mainfreeform].map(doc => CollectionDockingView.makeDocumentConfig(doc));
+ var config = { settings: { selectionEnabled: false }, content: [{ type: 'row', content: docs }] };
+ mainContainer = Documents.DockDocument(JSON.stringify(config), { title: "main container" }, mainDocId);
+ Utils.Emit(Server.Socket, MessageStore.AddDocument, new DocumentTransfer(mainContainer.ToJson()))
+ mainContainer.Set(KeyStore.ActiveFrame, mainfreeform);
+ }
+
+ let addImageNode = action(() => {
+ mainfreeform.GetList<Document>(KeyStore.Data, []).push(Documents.ImageDocument("https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg", {
+ x: 0, y: 300, width: 200, height: 200, title: "added note"
+ }));
+ })
+ let addTextNode = action(() => {
+ mainfreeform.GetList<Document>(KeyStore.Data, []).push(Documents.TextDocument({
+ x: 0, y: 300, width: 200, height: 200, title: "added note"
+ }));
+ })
+ let addColNode = action(() => {
+ mainfreeform.GetList<Document>(KeyStore.Data, []).push(Documents.CollectionDocument([], {
+ x: 0, y: 300, width: 200, height: 200, title: "added note"
+ }));
+ })
+
+ let clearDatabase = action(() => {
+ Utils.Emit(Server.Socket, MessageStore.DeleteAll, {});
+ })
+
+ ReactDOM.render((
+ <div style={{ position: "absolute", width: "100%", height: "100%" }}>
+ <DocumentView Document={mainContainer}
+ AddDocument={undefined} RemoveDocument={undefined} ScreenToLocalTransform={() => Transform.Identity}
+ Scaling={1}
+ isTopMost={true}
+ ContainingCollectionView={undefined} />
+ <DocumentDecorations />
+ <ContextMenu />
+ <button style={{
+ position: 'absolute',
+ bottom: '0px',
+ left: '0px',
+ width: '150px'
+ }} onClick={addImageNode}>Add Image</button>
+ <button style={{
+ position: 'absolute',
+ bottom: '25px',
+ left: '0px',
+ width: '150px'
+ }} onClick={addTextNode}>Add Text</button>
+ <button style={{
+ position: 'absolute',
+ bottom: '50px',
+ left: '0px',
+ width: '150px'
+ }} onClick={addColNode}>Add Collection</button>
+ <button style={{
+ position: 'absolute',
+ bottom: '75px',
+ left: '0px',
+ width: '150px'
+ }} onClick={clearDatabase}>Clear Database</button>
+ </div>),
+ document.getElementById('root'));
+ })
});
// 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, doc4, doc2];
-let doc6 = Documents.CollectionDocument(docset2, {
- x: 350, y: 100, width: 600, height: 600, title: "docking collection"
-});
-
-var docs = [doc4, doc3, doc6].map(doc => CollectionDockingView.makeDocumentConfig(doc));
-var config = {
- settings: { selectionEnabled: false }, content: [{ type: 'row', content: docs }]
-};
-let mainContainer = Documents.DockDocument(JSON.stringify(config), {
- x: 0, y: 0, title: "main container"
-})
-
-ReactDOM.render((
- <div style={{ position: "absolute", width: "100%", height: "100%" }}>
- <DocumentView Document={mainContainer}
- AddDocument={undefined} RemoveDocument={undefined} ScreenToLocalTransform={() => Transform.Identity}
- Scaling={1}
- isTopMost={true}
- ContainingCollectionView={undefined} />
- <DocumentDecorations />
- <ContextMenu />
- </div>),
- document.getElementById('root')); \ No newline at end of file
+// let docset2 = new Array<Document>(doc4);//, doc1, doc3);
+// let doc6 = Documents.CollectionDocument(docset2, {
+// x: 350, y: 100, width: 600, height: 600, title: "docking collection"
+// });
+// let mainNodes = mainContainer.GetOrCreate(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);
+// mainContainer.Set(KeyStore.Data, mainNodes);
+//}
+//);
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-14 08:07:59 +0000