aboutsummaryrefslogtreecommitdiff
path: root/src/views
diff options
context:
space:
mode:
Diffstat (limited to 'src/views')
-rw-r--r--src/views/collections/CollectionDockingView.tsx3
-rw-r--r--src/views/collections/CollectionFreeFormView.tsx16
-rw-r--r--src/views/collections/CollectionSchemaView.scss0
-rw-r--r--src/views/collections/CollectionSchemaView.tsx49
-rw-r--r--src/views/nodes/DocumentView.tsx26
-rw-r--r--src/views/nodes/FieldTextBox.tsx11
-rw-r--r--src/views/nodes/FieldView.tsx31
7 files changed, 109 insertions, 27 deletions
diff --git a/src/views/collections/CollectionDockingView.tsx b/src/views/collections/CollectionDockingView.tsx
index d4965645c..a547ea1e8 100644
--- a/src/views/collections/CollectionDockingView.tsx
+++ b/src/views/collections/CollectionDockingView.tsx
@@ -44,8 +44,7 @@ export class CollectionDockingView extends React.Component<CollectionViewProps>
const { fieldKey, Document: Document } = this.props;
const value: Document[] = Document.GetFieldValue(fieldKey, ListField, []);
var docs = value.map(doc => {
- var d = { type: 'component', componentName: 'documentViewComponent', componentState: { doc: doc } };
- return d;
+ return { type: 'component', componentName: 'documentViewComponent', componentState: { doc: doc } };
});
return new GoldenLayout({
settings: {
diff --git a/src/views/collections/CollectionFreeFormView.tsx b/src/views/collections/CollectionFreeFormView.tsx
index 39a8fc44f..ffb39426d 100644
--- a/src/views/collections/CollectionFreeFormView.tsx
+++ b/src/views/collections/CollectionFreeFormView.tsx
@@ -35,14 +35,14 @@ export class CollectionFreeFormView extends React.Component<CollectionViewProps>
}
drop = (e: Event, de: DragManager.DropEvent) => {
- const doc = de.data[ "document" ];
+ const doc = de.data["document"];
if (doc instanceof DocumentView) {
if (doc.props.ContainingCollectionView && doc.props.ContainingCollectionView !== this) {
doc.props.ContainingCollectionView.removeDocument(doc.props.Document);
this.addDocument(doc.props.Document);
}
- const xOffset = de.data[ "xOffset" ] as number || 0;
- const yOffset = de.data[ "yOffset" ] as number || 0;
+ const xOffset = de.data["xOffset"] as number || 0;
+ const yOffset = de.data["yOffset"] as number || 0;
const { scale, translateX, translateY } = Utils.GetScreenTransform(this._canvasRef.current!);
let sscale = this.props.ContainingDocumentView!.props.Document.GetFieldValue(KeyStore.Scale, NumberField, Number(1))
const screenX = de.x - xOffset;
@@ -124,7 +124,7 @@ export class CollectionFreeFormView extends React.Component<CollectionViewProps>
e.stopPropagation()
e.preventDefault()
let fReader = new FileReader()
- let file = e.dataTransfer.items[ 0 ].getAsFile();
+ let file = e.dataTransfer.items[0].getAsFile();
let that = this;
const panx: number = this.props.Document.GetFieldValue(KeyStore.PanX, NumberField, Number(0));
const pany: number = this.props.Document.GetFieldValue(KeyStore.PanY, NumberField, Number(0));
@@ -175,10 +175,10 @@ export class CollectionFreeFormView extends React.Component<CollectionViewProps>
render() {
const { fieldKey, Document: Document } = this.props;
- const value: Document[] = Document.GetFieldValue(fieldKey, ListField, []);
- const panx: number = Document.GetFieldValue(KeyStore.PanX, NumberField, Number(0));
- const pany: number = Document.GetFieldValue(KeyStore.PanY, NumberField, Number(0));
- const currScale: number = Document.GetFieldValue(KeyStore.Scale, NumberField, Number(1));
+ const value: Document[] = Document.GetListField<Document>(fieldKey, []);
+ const panx: number = Document.GetNumberField(KeyStore.PanX, 0);
+ const pany: number = Document.GetNumberField(KeyStore.PanY, 0);
+ const currScale: number = Document.GetNumberField(KeyStore.Scale, 1);
console.log("DocsR " + value.length);
return (
<div className="border" style={{
diff --git a/src/views/collections/CollectionSchemaView.scss b/src/views/collections/CollectionSchemaView.scss
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/src/views/collections/CollectionSchemaView.scss
diff --git a/src/views/collections/CollectionSchemaView.tsx b/src/views/collections/CollectionSchemaView.tsx
new file mode 100644
index 000000000..01a5ab639
--- /dev/null
+++ b/src/views/collections/CollectionSchemaView.tsx
@@ -0,0 +1,49 @@
+import { CollectionViewProps, DocumentFieldViewProps } from "../nodes/DocumentView";
+import React = require("react")
+import ReactTable, { ReactTableDefaults, CellInfo } from "react-table";
+import { observer } from "mobx-react";
+import { KeyStore as KS, Key } from "../../fields/Key";
+import { Document } from "../../fields/Document";
+import { FieldView } from "../nodes/FieldView";
+import "react-table/react-table.css"
+
+@observer
+export class CollectionSchemaView extends React.Component<CollectionViewProps> {
+ public static LayoutString() { return '<CollectionSchemaView Document={Document} fieldKey={DataKey} ContainingDocumentView={ContainingDocumentView}/>'; }
+
+ renderCell = (rowProps: CellInfo) => {
+ if (!this.props.ContainingDocumentView) {
+ return <div></div>
+ }
+ let props: DocumentFieldViewProps = {
+ doc: rowProps.value[0],
+ fieldKey: rowProps.value[1],
+ containingDocumentView: this.props.ContainingDocumentView
+ }
+ return <FieldView {...props} />
+ }
+
+ render() {
+ const { Document, fieldKey } = this.props;
+ const children = Document.GetListField<Document>(fieldKey, []);
+ const columns = Document.GetListField(KS.ColumnsKey,
+ [KS.Title, KS.Data, KS.Author])
+ return (
+ <ReactTable
+ data={children}
+ columns={columns.map(col => {
+ return (
+ {
+ Header: col.Name,
+ accessor: (doc: Document) => [doc, col],
+ id: col.Id
+ })
+ })}
+ column={{
+ ...ReactTableDefaults.column,
+ Cell: this.renderCell
+ }}
+ />
+ )
+ }
+} \ No newline at end of file
diff --git a/src/views/nodes/DocumentView.tsx b/src/views/nodes/DocumentView.tsx
index 147727a67..634cd78be 100644
--- a/src/views/nodes/DocumentView.tsx
+++ b/src/views/nodes/DocumentView.tsx
@@ -6,6 +6,8 @@ import { Key, KeyStore } from "../../fields/Key";
import { ListField } from "../../fields/ListField";
import { NumberField } from "../../fields/NumberField";
import { TextField } from "../../fields/TextField";
+import { CollectionSchemaView } from "../collections/CollectionSchemaView"
+import "./NodeView.scss"
import { DragManager } from "../../util/DragManager";
import { SelectionManager } from "../../util/SelectionManager";
import { Utils } from "../../Utils";
@@ -31,6 +33,16 @@ export interface CollectionViewProps {
ContainingDocumentView: Opt<DocumentView>;
}
+//
+// these properties get assigned through the render() method of the DocumentView when it creates this node.
+// However, that only happens because the properties are "defined" in FieldTextBox's LayoutString() method
+//
+export interface DocumentFieldViewProps {
+ fieldKey: Key;
+ doc: Document;
+ containingDocumentView: DocumentView
+}
+
export const COLLECTION_BORDER_WIDTH = 2;
interface CollectionView {
@@ -61,16 +73,16 @@ class DocumentContents extends React.Component<DocumentViewProps> {
let doc = this.props.Document;
let bindings = { ...this.props } as any;
for (const key of this.layoutKeys) {
- bindings[ key.Name + "Key" ] = key;
+ bindings[key.Name + "Key"] = key;
}
for (const key of this.layoutFields) {
let field = doc.GetField(key);
if (field) {
- bindings[ key.Name ] = field.GetValue();
+ bindings[key.Name] = field.GetValue();
}
}
return <JsxParser
- components={{ FieldTextBox, CollectionFreeFormView, CollectionDockingView }}
+ components={{ FieldTextBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }}
bindings={bindings}
jsx={this.layout}
showWarnings={true}
@@ -262,10 +274,10 @@ export class DocumentView extends React.Component<DocumentViewProps> {
if (this._mainCont.current != null && this.props.ContainingCollectionView != null) {
this._contextMenuCanOpen = false;
const rect = this.screenRect;
- let dragData: { [ id: string ]: any } = {};
- dragData[ "document" ] = this;
- dragData[ "xOffset" ] = e.x - rect.left;
- dragData[ "yOffset" ] = e.y - rect.top;
+ let dragData: { [id: string]: any } = {};
+ dragData["document"] = this;
+ dragData["xOffset"] = e.x - rect.left;
+ dragData["yOffset"] = e.y - rect.top;
DragManager.StartDrag(this._mainCont.current, dragData, {
handlers: {
dragComplete: this.dragComplete,
diff --git a/src/views/nodes/FieldTextBox.tsx b/src/views/nodes/FieldTextBox.tsx
index 45493f0ec..9809f3aed 100644
--- a/src/views/nodes/FieldTextBox.tsx
+++ b/src/views/nodes/FieldTextBox.tsx
@@ -10,19 +10,10 @@ import { Opt } from "../../fields/Field";
import { Key } from "../../fields/Key";
import { TextField } from "../../fields/TextField";
import { SelectionManager } from "../../util/SelectionManager";
-import { DocumentView } from "./DocumentView";
+import { DocumentView, DocumentFieldViewProps } from "./DocumentView";
import "./FieldTextBox.scss";
import React = require("react")
-//
-// these properties get assigned through the render() method of the DocumentView when it creates this node.
-// However, that only happens because the properties are "defined" in FieldTextBox's LayoutString() method
-//
-interface DocumentFieldViewProps {
- fieldKey: Key;
- doc: Document;
- containingDocumentView: DocumentView
-}
// FieldTextBox: Displays an editable plain text node that maps to a specified Key of a Document
//
diff --git a/src/views/nodes/FieldView.tsx b/src/views/nodes/FieldView.tsx
new file mode 100644
index 000000000..1c4164089
--- /dev/null
+++ b/src/views/nodes/FieldView.tsx
@@ -0,0 +1,31 @@
+import React = require("react")
+import { DocumentFieldViewProps } from "./DocumentView";
+import { observer } from "mobx-react";
+import { computed } from "mobx";
+import { Field, Opt } from "../../fields/Field";
+import { TextField } from "../../fields/TextField";
+import { NumberField } from "../../fields/NumberField";
+
+@observer
+export class FieldView extends React.Component<DocumentFieldViewProps> {
+ @computed
+ get field(): Opt<Field> {
+ const { doc, fieldKey } = this.props;
+ return doc.GetField(fieldKey);
+ }
+ render() {
+ const field = this.field;
+ if (!field) {
+ return <p>{'<null>'}</p>
+ }
+ if (field instanceof TextField) {
+ return <p>{field.Data}</p>
+ }
+ else if (field instanceof NumberField) {
+ return <p>{field.Data}</p>
+ } else {
+ return <p>{field.GetValue}</p>
+ }
+ }
+
+} \ No newline at end of file
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-12-15 09:40:10 +0000