aboutsummaryrefslogtreecommitdiff
path: root/src/views/collections
diff options
context:
space:
mode:
Diffstat (limited to 'src/views/collections')
-rw-r--r--src/views/collections/CollectionDockingView.tsx20
-rw-r--r--src/views/collections/CollectionFreeFormView.tsx37
-rw-r--r--src/views/collections/CollectionSchemaView.tsx16
3 files changed, 37 insertions, 36 deletions
diff --git a/src/views/collections/CollectionDockingView.tsx b/src/views/collections/CollectionDockingView.tsx
index 177e3510a..197b7df46 100644
--- a/src/views/collections/CollectionDockingView.tsx
+++ b/src/views/collections/CollectionDockingView.tsx
@@ -4,7 +4,7 @@ import React = require("react");
import FlexLayout from "flexlayout-react";
import { action, observable, computed } from "mobx";
import { Document } from "../../fields/Document";
-import { DocumentView } from "../nodes/DocumentView";
+import { DocumentView, DocumentContentsView } from "../nodes/DocumentView";
import { ListField } from "../../fields/ListField";
import { NumberField } from "../../fields/NumberField";
import { SSL_OP_SINGLE_DH_USE } from "constants";
@@ -20,11 +20,11 @@ import { CollectionViewBase, CollectionViewProps, COLLECTION_BORDER_WIDTH } from
export class CollectionDockingView extends CollectionViewBase {
private static UseGoldenLayout = true;
- public static LayoutString() { return '<CollectionDockingView Document={Document} fieldKey={DataKey} ContainingDocumentView={ContainingDocumentView}/>'; }
+ public static LayoutString() { return '<CollectionDockingView DocumentForCollection={Document} CollectionFieldKey={DataKey} DocumentContentsContainingCollection={ContainingDocumentContentsView}/>'; }
private _containerRef = React.createRef<HTMLDivElement>();
@computed
private get modelForFlexLayout() {
- const { fieldKey, Document: Document } = this.props;
+ const { CollectionFieldKey: fieldKey, DocumentForCollection: Document } = this.props;
const value: Document[] = Document.GetFieldValue(fieldKey, ListField, []);
var docs = value.map(doc => {
return { type: 'tabset', weight: 50, selected: 0, children: [{ type: "tab", name: doc.Title, component: doc.Id }] };
@@ -40,7 +40,7 @@ export class CollectionDockingView extends CollectionViewBase {
}
@computed
private get modelForGoldenLayout(): any {
- const { fieldKey, Document: Document } = this.props;
+ const { CollectionFieldKey: fieldKey, DocumentForCollection: Document } = this.props;
const value: Document[] = Document.GetFieldValue(fieldKey, ListField, []);
var docs = value.map(doc => {
return { type: 'component', componentName: 'documentViewComponent', componentState: { doc: doc } };
@@ -69,7 +69,7 @@ export class CollectionDockingView extends CollectionViewBase {
@action
onResize = (event: any) => {
- var cur = this.props.ContainingDocumentView!.MainContent.current;
+ var cur = this.props.DocumentContentsContainingCollection!.MainContent.current;
// bcz: since GoldenLayout isn't a React component itself, we need to notify it to resize when its document container's size has changed
CollectionDockingView.myLayout.updateSize(cur!.getBoundingClientRect().width, cur!.getBoundingClientRect().height);
@@ -92,11 +92,11 @@ export class CollectionDockingView extends CollectionViewBase {
if (component === "button") {
return <button>{node.getName()}</button>;
}
- const { fieldKey, Document: Document } = this.props;
+ const { CollectionFieldKey: fieldKey, DocumentForCollection: Document } = this.props;
const value: Document[] = Document.GetFieldValue(fieldKey, ListField, []);
for (var i: number = 0; i < value.length; i++) {
if (value[i].Id === component) {
- return (<DocumentView key={value[i].Id} ContainingCollectionView={this} Document={value[i]} ContainingDocumentView={this.props.ContainingDocumentView} />);
+ return (<DocumentView key={value[i].Id} ContainingCollectionView={this} Document={value[i]} ContainingDocumentContentsView={this.props.DocumentContentsContainingCollection} />);
}
}
if (component === "text") {
@@ -237,7 +237,7 @@ export class CollectionDockingView extends CollectionViewBase {
container.getElement().html("<div id='" + containingDiv + "'></div>");
setTimeout(function () {
ReactDOM.render((
- <DocumentView key={state.doc.Id} Document={state.doc} ContainingCollectionView={me} ContainingDocumentView={me.props.ContainingDocumentView} />
+ <DocumentContentsView key={state.doc.Id} Document={state.doc} ContainingCollectionView={me} ContainingDocumentContentsView={me.props.DocumentContentsContainingCollection} /> // bcz: need to fill in containingdoccontnents with value of DocumentContents when created...
),
document.getElementById(containingDiv)
);
@@ -252,10 +252,10 @@ export class CollectionDockingView extends CollectionViewBase {
render() {
- const { fieldKey, Document: Document } = this.props;
+ const { CollectionFieldKey: fieldKey, DocumentForCollection: Document } = this.props;
const value: Document[] = Document.GetFieldValue(fieldKey, ListField, []);
// bcz: not sure why, but I need these to force the flexlayout to update when the collection size changes.
- var s = this.props.ContainingDocumentView!.ScalingToScreenSpace;
+ var s = this.props.DocumentContentsContainingCollection != undefined ? this.props.DocumentContentsContainingCollection!.ScalingToScreenSpace : 1;
var w = Document.GetFieldValue(KeyStore.Width, NumberField, Number(0)) / s;
var h = Document.GetFieldValue(KeyStore.Height, NumberField, Number(0)) / s;
diff --git a/src/views/collections/CollectionFreeFormView.tsx b/src/views/collections/CollectionFreeFormView.tsx
index ab2aeee64..d0dea7a79 100644
--- a/src/views/collections/CollectionFreeFormView.tsx
+++ b/src/views/collections/CollectionFreeFormView.tsx
@@ -15,6 +15,7 @@ import { CollectionViewBase, CollectionViewProps, COLLECTION_BORDER_WIDTH } from
@observer
export class CollectionFreeFormView extends CollectionViewBase {
+ public static LayoutString() { return '<CollectionFreeFormView DocumentForCollection={Document} CollectionFieldKey={DataKey} DocumentContentsContainingCollection={ContainingDocumentContentsView}/>'; }
private _containerRef = React.createRef<HTMLDivElement>();
private _canvasRef = React.createRef<HTMLDivElement>();
private _nodeContainerRef = React.createRef<HTMLDivElement>();
@@ -36,14 +37,14 @@ export class CollectionFreeFormView extends CollectionViewBase {
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))
+ let sscale = this.props.DocumentContentsContainingCollection!.props.Document.GetFieldValue(KeyStore.Scale, NumberField, Number(1))
const screenX = de.x - xOffset;
const screenY = de.y - yOffset;
const docX = (screenX - translateX) / sscale / scale;
const docY = (screenY - translateY) / sscale / scale;
doc.x = docX;
doc.y = docY;
- this.bringToFront(doc);
+ //this.bringToFront(doc);
}
e.stopPropagation();
}
@@ -82,11 +83,11 @@ export class CollectionFreeFormView extends CollectionViewBase {
if (!e.cancelBubble) {
e.preventDefault();
e.stopPropagation();
- let currScale: number = this.props.ContainingDocumentView!.ScalingToScreenSpace;
- let x = this.props.Document.GetFieldValue(KeyStore.PanX, NumberField, Number(0));
- let y = this.props.Document.GetFieldValue(KeyStore.PanY, NumberField, Number(0));
- this.props.Document.SetFieldValue(KeyStore.PanX, x + (e.pageX - this._lastX) / currScale, NumberField);
- this.props.Document.SetFieldValue(KeyStore.PanY, y + (e.pageY - this._lastY) / currScale, NumberField);
+ let currScale: number = this.props.DocumentContentsContainingCollection!.ScalingToScreenSpace;
+ let x = this.props.DocumentForCollection.GetFieldValue(KeyStore.PanX, NumberField, Number(0));
+ let y = this.props.DocumentForCollection.GetFieldValue(KeyStore.PanY, NumberField, Number(0));
+ this.props.DocumentForCollection.SetFieldValue(KeyStore.PanX, x + (e.pageX - this._lastX) / currScale, NumberField);
+ this.props.DocumentForCollection.SetFieldValue(KeyStore.PanY, y + (e.pageY - this._lastY) / currScale, NumberField);
this._lastX = e.pageX;
this._lastY = e.pageY;
}
@@ -96,7 +97,7 @@ export class CollectionFreeFormView extends CollectionViewBase {
onPointerWheel = (e: React.WheelEvent): void => {
e.stopPropagation();
- let { LocalX, Ss, Panxx, Xx, LocalY, Panyy, Yy, ContainerX, ContainerY } = this.props.ContainingDocumentView!.TransformToLocalPoint(e.pageX, e.pageY);
+ let { LocalX, Ss, Panxx, Xx, LocalY, Panyy, Yy, ContainerX, ContainerY } = this.props.DocumentContentsContainingCollection!.TransformToLocalPoint(e.pageX, e.pageY);
var deltaScale = (1 - (e.deltaY / 1000)) * Ss;
@@ -106,9 +107,9 @@ export class CollectionFreeFormView extends CollectionViewBase {
let dx = ContainerX - newContainerX;
let dy = ContainerY - newContainerY;
- this.props.Document.SetField(KeyStore.Scale, new NumberField(deltaScale));
- this.props.Document.SetFieldValue(KeyStore.PanX, Panxx + dx, NumberField);
- this.props.Document.SetFieldValue(KeyStore.PanY, Panyy + dy, NumberField);
+ this.props.DocumentForCollection.SetField(KeyStore.Scale, new NumberField(deltaScale));
+ this.props.DocumentForCollection.SetFieldValue(KeyStore.PanX, Panxx + dx, NumberField);
+ this.props.DocumentForCollection.SetFieldValue(KeyStore.PanY, Panyy + dy, NumberField);
}
@action
@@ -118,8 +119,8 @@ export class CollectionFreeFormView extends CollectionViewBase {
let fReader = new FileReader()
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));
+ const panx: number = this.props.DocumentForCollection.GetFieldValue(KeyStore.PanX, NumberField, Number(0));
+ const pany: number = this.props.DocumentForCollection.GetFieldValue(KeyStore.PanY, NumberField, Number(0));
let x = e.pageX - panx
let y = e.pageY - pany
@@ -129,10 +130,10 @@ export class CollectionFreeFormView extends CollectionViewBase {
let doc = Documents.ImageDocument(url, {
x: x, y: y
})
- let docs = that.props.Document.GetFieldT(KeyStore.Data, ListField);
+ let docs = that.props.DocumentForCollection.GetFieldT(KeyStore.Data, ListField);
if (!docs) {
docs = new ListField<Document>();
- that.props.Document.SetField(KeyStore.Data, docs)
+ that.props.DocumentForCollection.SetField(KeyStore.Data, docs)
}
docs.Data.push(doc);
}
@@ -148,7 +149,7 @@ export class CollectionFreeFormView extends CollectionViewBase {
@action
bringToFront(doc: DocumentView) {
- const { fieldKey, Document: Document } = this.props;
+ const { CollectionFieldKey: fieldKey, DocumentForCollection: Document } = this.props;
const value: Document[] = Document.GetListField<Document>(fieldKey, []);
var topmost = value.reduce((topmost, d) => Math.max(d.GetNumberField(KeyStore.ZIndex, 0), topmost), -1000);
@@ -165,7 +166,7 @@ export class CollectionFreeFormView extends CollectionViewBase {
}
render() {
- const { fieldKey, Document: Document } = this.props;
+ const { CollectionFieldKey: fieldKey, DocumentForCollection: Document } = this.props;
const value: Document[] = Document.GetListField<Document>(fieldKey, []);
const panx: number = Document.GetNumberField(KeyStore.PanX, 0);
const pany: number = Document.GetNumberField(KeyStore.PanY, 0);
@@ -186,7 +187,7 @@ export class CollectionFreeFormView extends CollectionViewBase {
<div className="node-container" ref={this._nodeContainerRef}>
{value.map(doc => {
- return (<DocumentView key={doc.Id} ContainingCollectionView={this} Document={doc} ContainingDocumentView={this.props.ContainingDocumentView} />);
+ return (<DocumentView key={doc.Id} ContainingCollectionView={this} Document={doc} ContainingDocumentContentsView={this.props.DocumentContentsContainingCollection} />);
})}
</div>
</div>
diff --git a/src/views/collections/CollectionSchemaView.tsx b/src/views/collections/CollectionSchemaView.tsx
index 420a68cc9..f625b39c5 100644
--- a/src/views/collections/CollectionSchemaView.tsx
+++ b/src/views/collections/CollectionSchemaView.tsx
@@ -1,4 +1,4 @@
-import { DocumentContents } from "../nodes/DocumentView";
+import { DocumentContentsView } from "../nodes/DocumentView";
import React = require("react")
import ReactTable, { ReactTableDefaults, CellInfo, ComponentPropsGetterRC, ComponentPropsGetterR } from "react-table";
import { observer } from "mobx-react";
@@ -14,19 +14,19 @@ import { CollectionViewBase } from "./CollectionViewBase";
@observer
export class CollectionSchemaView extends CollectionViewBase {
- public static LayoutString() { return '<CollectionSchemaView Document={Document} fieldKey={DataKey} ContainingDocumentView={ContainingDocumentView}/>'; }
+ public static LayoutString() { return '<CollectionSchemaView DocumentForCollection={Document} CollectionFieldKey={DataKey} ContainingDocumentView={ContainingDocumentContentsView}/>'; }
@observable
selectedIndex = 0;
renderCell = (rowProps: CellInfo) => {
- if (!this.props.ContainingDocumentView) {
+ if (!this.props.DocumentContentsContainingCollection) {
return <div></div>
}
let props: FieldViewProps = {
doc: rowProps.value[0],
fieldKey: rowProps.value[1],
- documentViewContainer: this.props.ContainingDocumentView
+ documentViewContainer: this.props.DocumentContentsContainingCollection
}
return (
<FieldView {...props} />
@@ -71,15 +71,15 @@ export class CollectionSchemaView extends CollectionViewBase {
}
render() {
- const { Document, fieldKey } = this.props;
+ const { DocumentForCollection: Document, CollectionFieldKey: fieldKey } = this.props;
const children = Document.GetListField<Document>(fieldKey, []);
const columns = Document.GetListField(KS.ColumnsKey,
[KS.Title, KS.Data, KS.Author])
let content;
if (this.selectedIndex != -1) {
- content = (<DocumentContents Document={children[this.selectedIndex]}
- ContainingDocumentView={this.props.ContainingDocumentView}
- ContainingCollectionView={undefined} />)
+ content = (<DocumentContentsView Document={children[this.selectedIndex]}
+ ContainingDocumentContentsView={this.props.DocumentContentsContainingCollection}
+ ContainingCollectionView={this} />)
} else {
content = <div />
}