aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/Main.tsx2
-rw-r--r--src/documents/Documents.ts21
-rw-r--r--src/fields/Document.ts74
-rw-r--r--src/fields/ImageField.ts4
-rw-r--r--src/views/collections/CollectionDockingView.tsx6
-rw-r--r--src/views/collections/CollectionFreeFormView.tsx3
-rw-r--r--src/views/collections/CollectionSchemaView.tsx3
-rw-r--r--src/views/nodes/CollectionFreeFormDocumentView.tsx5
-rw-r--r--src/views/nodes/DocumentView.tsx7
-rw-r--r--src/views/nodes/ImageBox.tsx20
10 files changed, 69 insertions, 76 deletions
diff --git a/src/Main.tsx b/src/Main.tsx
index de4a1de5d..2b805071f 100644
--- a/src/Main.tsx
+++ b/src/Main.tsx
@@ -80,7 +80,7 @@ document.addEventListener("pointerdown", action(function (e: PointerEvent) {
ReactDOM.render((
<div style={{ position: "absolute", width: "100%", height: "100%" }}>
- <DocumentView Document={mainContainer} ContainingCollectionView={undefined} DocumentView={undefined} />
+ <DocumentView Document={mainContainer} ContainingCollectionView={undefined} DocumentView={undefined} Data={mainContainer.GetField(KeyStore.Data)} />
<DocumentDecorations />
<ContextMenu />
</div>),
diff --git a/src/documents/Documents.ts b/src/documents/Documents.ts
index b69b79dd3..869e9ab90 100644
--- a/src/documents/Documents.ts
+++ b/src/documents/Documents.ts
@@ -21,6 +21,9 @@ interface DocumentOptions {
export namespace Documents {
function setupOptions(doc: Document, options: DocumentOptions): void {
+ if (options.title) {
+ doc.SetField(KeyStore.Title, new TextField(options.title));
+ }
if (options.x) {
doc.SetFieldValue(KeyStore.X, options.x, NumberField);
}
@@ -33,9 +36,6 @@ export namespace Documents {
if (options.height) {
doc.SetFieldValue(KeyStore.Height, options.height, NumberField);
}
- if (options.title) {
- doc.SetFieldValue(KeyStore.Title, options.title, TextField);
- }
doc.SetFieldValue(KeyStore.Scale, 1, NumberField);
doc.SetFieldValue(KeyStore.PanX, 0, NumberField);
doc.SetFieldValue(KeyStore.PanY, 0, NumberField);
@@ -110,13 +110,14 @@ export namespace Documents {
function GetImagePrototype(): Document {
if (!imageProto) {
imageProto = new Document();
- imageProto.SetField(KeyStore.X, new NumberField(0));
- imageProto.SetField(KeyStore.Y, new NumberField(0));
- imageProto.SetField(KeyStore.Width, new NumberField(300));
- imageProto.SetField(KeyStore.Height, new NumberField(300));
- imageProto.SetField(KeyStore.Layout, new TextField(ImageBox.LayoutString()));
+ imageProto.SetFieldValue(KeyStore.Title, "IMAGE PROTO", TextField);
+ imageProto.SetFieldValue(KeyStore.X, 0, NumberField);
+ imageProto.SetFieldValue(KeyStore.Y, 0, NumberField);
+ imageProto.SetFieldValue(KeyStore.Width, 300, NumberField);
+ imageProto.SetFieldValue(KeyStore.Height, 300, NumberField);
+ imageProto.SetFieldValue(KeyStore.Layout, ImageBox.LayoutString(), TextField);
// imageProto.SetField(KeyStore.Layout, new TextField('<div style={"background-image: " + {Data}} />'));
- imageProto.SetField(KeyStore.LayoutKeys, new ListField([KeyStore.Data]));
+ imageProto.SetFieldValue(KeyStore.LayoutKeys, [KeyStore.Data], ListField);
}
return imageProto;
}
@@ -124,7 +125,7 @@ export namespace Documents {
export function ImageDocument(url: string, options: DocumentOptions = {}): Document {
let doc = GetImagePrototype().MakeDelegate();
setupOptions(doc, options);
- doc.SetField(KeyStore.Data, new ImageField(new URL(url)));
+ doc.SetFieldValue(KeyStore.Data, new URL(url), ImageField);
return doc;
}
diff --git a/src/fields/Document.ts b/src/fields/Document.ts
index 0356959a5..5e9c3a707 100644
--- a/src/fields/Document.ts
+++ b/src/fields/Document.ts
@@ -21,42 +21,34 @@ export class Document extends Field {
}
@observable
+ GetFieldFromServerDeferred(key: Key) {
+ var me = this;
+ setTimeout(function () {
+ if (me) {
+ me.DeferredSetField(key);
+ }
+ }, key == KeyStore.Data ? 5000 : key == KeyStore.X ? 2500 : 500)
+ }
+
+ @observable
GetField(key: Key, ignoreProto: boolean = false): Opt<Field> {
- if (KeyStore.X == key) {
- console.log("");
- }
- let field: Opt<Field>;
+ let field: Opt<Field> = WAITING;
if (ignoreProto) {
if (this.fields.has(key)) {
- if (KeyStore.X == key) {
- console.log("");
- }
field = this.fields.get(key);
} else {
- field = WAITING;
- var me = this;
- setTimeout(function () {
- me.DeferredSetField(key);
- }, 100)
+ this.GetFieldFromServerDeferred(key); // bcz: only want to do this if the field is on the server
}
} else {
let doc: Opt<Document> = this;
while (doc && doc != WAITING) {
- if (!(doc.fields.has(key))) {
- var me = this;
- setTimeout(function () {
- me.DeferredSetField(key);
- }, 1000)
+ if (!doc.fields.has(key)) {
+ doc.GetFieldFromServerDeferred(key); // bcz: only want to do this if the field is on the server
doc = doc.GetPrototype();
- } else
+ } else {
+ field = doc.fields.get(key);
break;
- }
-
- if (doc && doc != WAITING) {
- if (KeyStore.X == key) {
- console.log("");
}
- field = doc.fields.get(key);
}
}
@@ -67,7 +59,7 @@ export class Document extends Field {
GetFieldT<T extends Field = Field>(key: Key, ctor: { new(...args: any[]): T }, ignoreProto: boolean = false): Opt<T> {
var getfield = this.GetField(key, ignoreProto);
if (getfield != WAITING) {
- return Cast(this.GetField(key, ignoreProto), ctor);
+ return Cast(getfield, ctor);
}
return WAITING;
}
@@ -105,49 +97,45 @@ export class Document extends Field {
return this.GetFieldValue<T[], ListField<T>>(key, ListField, defaultVal)
}
+ @action
SetField(key: Key, field: Field | undefined): void {
if (field) {
- if (KeyStore.X == key) {
- console.log("");
- }
this.fields.set(key, field);
} else {
this.fields.delete(key);
}
}
+ @action
SetFieldValue<T extends Field>(key: Key, value: any, ctor: { new(): T }): boolean {
- if (KeyStore.X == key) {
- console.log("");
- }
let field = new ctor();
if (field.TrySetValue(value)) {
this._sfields.set(key, field);
return true;
- } else {
- return false;
}
+ return false;
// let field = this.GetField(key, true);
- // if (field == WAITING)
- // return true;
- // if (field != null) {
- // return field.TrySetValue(value);
- // } else {
- // field = new ctor();
- // if (field.TrySetValue(value)) {
- // this.SetField(key, field);
- // return true;
+ // if (field != WAITING) {
+ // if (field) {
+ // return field.TrySetValue(value);
// } else {
- // return false;
+ // field = new ctor();
+ // if (field.TrySetValue(value)) {
+ // this.SetField(key, field);
+ // return true;
+ // }
// }
// }
+ // return false;
}
+ @observable
GetPrototype(): Opt<Document> {
return this.GetFieldT(KeyStore.Prototype, Document, true);
}
+ @observable
GetAllPrototypes(): Document[] {
let protos: Document[] = [];
let doc: Opt<Document> = this;
diff --git a/src/fields/ImageField.ts b/src/fields/ImageField.ts
index 9bfacf231..bc2e7cdf4 100644
--- a/src/fields/ImageField.ts
+++ b/src/fields/ImageField.ts
@@ -2,8 +2,8 @@ import { BasicField } from "./BasicField";
import { Field } from "./Field";
export class ImageField extends BasicField<URL> {
- constructor(data: URL) {
- super(data);
+ constructor(data: URL | undefined = undefined) {
+ super(data == undefined ? new URL("http://cs.brown.edu/~bcz/face.gif") : data);
}
toString(): string {
diff --git a/src/views/collections/CollectionDockingView.tsx b/src/views/collections/CollectionDockingView.tsx
index 51e2cfbbc..adb885859 100644
--- a/src/views/collections/CollectionDockingView.tsx
+++ b/src/views/collections/CollectionDockingView.tsx
@@ -99,7 +99,8 @@ export class CollectionDockingView extends CollectionViewBase {
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]} DocumentView={undefined} />);
+ var data = value[i].GetField(KeyStore.Data);
+ return (<DocumentView key={value[i].Id} ContainingCollectionView={this} Document={value[i]} DocumentView={undefined} Data={data} />);
}
}
if (component === "text") {
@@ -239,8 +240,9 @@ export class CollectionDockingView extends CollectionViewBase {
var containingDiv = "component_" + me.nextId();
container.getElement().html("<div id='" + containingDiv + "'></div>");
setTimeout(function () {
+ var data = state.doc.GetField(KeyStore.Data);
ReactDOM.render((
- <DocumentView key={state.doc.Id} Document={state.doc} ContainingCollectionView={me} DocumentView={undefined} />
+ <DocumentView key={state.doc.Id} Document={state.doc} ContainingCollectionView={me} DocumentView={undefined} Data={data} />
),
document.getElementById(containingDiv)
);
diff --git a/src/views/collections/CollectionFreeFormView.tsx b/src/views/collections/CollectionFreeFormView.tsx
index 2c10c8056..ad470f9e2 100644
--- a/src/views/collections/CollectionFreeFormView.tsx
+++ b/src/views/collections/CollectionFreeFormView.tsx
@@ -189,6 +189,7 @@ export class CollectionFreeFormView extends CollectionViewBase {
const panx: number = Document.GetNumberField(KeyStore.PanX, 0);
const pany: number = Document.GetNumberField(KeyStore.PanY, 0);
const currScale: number = Document.GetNumberField(KeyStore.Scale, 1);
+ const data = Document.GetField(KeyStore.Data);
return (
<div className="border" style={{
@@ -205,7 +206,7 @@ export class CollectionFreeFormView extends CollectionViewBase {
<div className="node-container" ref={this._nodeContainerRef}>
{value.map(doc => {
- return (<CollectionFreeFormDocumentView key={doc.Id} ContainingCollectionView={this} Document={doc} DocumentView={undefined} />);
+ return (<CollectionFreeFormDocumentView key={doc.Id} ContainingCollectionView={this} Document={doc} DocumentView={undefined} Data={data} />);
})}
</div>
</div>
diff --git a/src/views/collections/CollectionSchemaView.tsx b/src/views/collections/CollectionSchemaView.tsx
index 8503aaf1e..bde727fea 100644
--- a/src/views/collections/CollectionSchemaView.tsx
+++ b/src/views/collections/CollectionSchemaView.tsx
@@ -74,7 +74,8 @@ export class CollectionSchemaView extends CollectionViewBase {
[KS.Title, KS.Data, KS.Author])
let content;
if (this.selectedIndex != -1) {
- content = (<DocumentView Document={children[this.selectedIndex]} DocumentView={undefined} ContainingCollectionView={this} />)
+ var data = this.props.DocumentForCollection.GetField(KS.Data);
+ content = (<DocumentView Document={children[this.selectedIndex]} DocumentView={undefined} ContainingCollectionView={this} Data={data} />)
} else {
content = <div />
}
diff --git a/src/views/nodes/CollectionFreeFormDocumentView.tsx b/src/views/nodes/CollectionFreeFormDocumentView.tsx
index 08068b384..9f13733c9 100644
--- a/src/views/nodes/CollectionFreeFormDocumentView.tsx
+++ b/src/views/nodes/CollectionFreeFormDocumentView.tsx
@@ -11,6 +11,7 @@ import "./NodeView.scss";
import React = require("react");
import { DocumentView, DocumentViewProps } from "./DocumentView";
import { WAITING } from "../../fields/Field";
+import { ImageField } from '../../fields/ImageField';
@observer
@@ -206,6 +207,8 @@ export class CollectionFreeFormDocumentView extends DocumentView {
render() {
var freestyling = this.props.ContainingCollectionView instanceof CollectionFreeFormView;
+ let data = this.props.Document.GetFieldT(KeyStore.Data, ImageField);
+ console.log("CollectionFFDocView " + this.props.Document.Title + "<" + data + "> x=" + this.x);
return (
<div className="node" ref={this._mainCont} style={{
transform: freestyling ? this.transform : "",
@@ -217,7 +220,7 @@ export class CollectionFreeFormDocumentView extends DocumentView {
onContextMenu={this.onContextMenu}
onPointerDown={this.onPointerDown}>
- <DocumentView {...this.props} DocumentView={this} />
+ <DocumentView {...this.props} DocumentView={this} Data={data} />
</div>
);
}
diff --git a/src/views/nodes/DocumentView.tsx b/src/views/nodes/DocumentView.tsx
index 334ea1cb2..94fe0440f 100644
--- a/src/views/nodes/DocumentView.tsx
+++ b/src/views/nodes/DocumentView.tsx
@@ -21,6 +21,7 @@ export interface DocumentViewProps {
Document: Document;
DocumentView: Opt<DocumentView> // needed only to set ContainingDocumentView on CollectionViewProps when invoked from JsxParser -- is there a better way?
ContainingCollectionView: Opt<CollectionViewBase>;
+ Data: any;
}
@observer
export class DocumentView extends React.Component<DocumentViewProps> {
@@ -131,15 +132,15 @@ export class DocumentView extends React.Component<DocumentViewProps> {
let bindings = { ...this.props } as any;
for (const key of this.layoutKeys) {
bindings[key.Name + "Key"] = key;
+ let val = this.props.Document.GetField(key);
}
if (bindings.DocumentView === undefined)
bindings.DocumentView = this;
for (const key of this.layoutFields) {
let field = doc.GetField(key);
- if (field && field != WAITING) {
- bindings[key.Name] = field.GetValue();
- }
+ bindings[key.Name] = field && field != WAITING ? field.GetValue() : field;
}
+ console.log("DocumentView Rendering " + doc.Title + " data = " + this.props.Data);
return (
<div className="node" ref={this._mainCont} style={{ width: "100%", height: "100%", }}>
<JsxParser
diff --git a/src/views/nodes/ImageBox.tsx b/src/views/nodes/ImageBox.tsx
index 65a3b7437..fa55c6811 100644
--- a/src/views/nodes/ImageBox.tsx
+++ b/src/views/nodes/ImageBox.tsx
@@ -8,6 +8,7 @@ import { ImageField } from '../../fields/ImageField';
import { FieldViewProps, FieldView } from './FieldView';
import { CollectionFreeFormDocumentView } from './CollectionFreeFormDocumentView';
import { WAITING } from '../../fields/Field';
+import { Key, KeyStore } from '../../fields/Key';
interface ImageBoxState {
photoIndex: number,
@@ -61,22 +62,17 @@ export class ImageBox extends React.Component<FieldViewProps, ImageBoxState> {
render() {
let field = this.props.doc.GetFieldT(this.props.fieldKey, ImageField);
- let path = "";
- if (field) {
- if (field === WAITING) {
- path = "https://image.flaticon.com/icons/svg/66/66163.svg"
- } else {
- path = field.Data.href;
- }
- }
- const images = [path,];
+ let path = field == WAITING ? "https://image.flaticon.com/icons/svg/66/66163.svg" :
+ field instanceof ImageField ? field.Data.href : "";
+ console.log("ImageBox Rendering " + this.props.doc.Title);
var lightbox = () => {
+ const images = [path, "http://www.cs.brown.edu/~bcz/face.gif"];
const { photoIndex } = this.state;
if (this.state.isOpen && this.props.DocumentViewForField instanceof CollectionFreeFormDocumentView && SelectionManager.IsSelected(this.props.DocumentViewForField)) {
return (<Lightbox
mainSrc={images[photoIndex]}
- nextSrc={photoIndex + 1 < images.length ? images[(photoIndex + 1) % images.length] : undefined}
- prevSrc={photoIndex - 1 > 0 ? images[(photoIndex + images.length - 1) % images.length] : undefined}
+ nextSrc={images[(photoIndex + 1) % images.length]}
+ prevSrc={images[(photoIndex + images.length - 1) % images.length]}
onCloseRequest={() => this.setState({ isOpen: false })}
onMovePrevRequest={() =>
this.setState({ photoIndex: (photoIndex + images.length - 1) % images.length, })
@@ -89,7 +85,7 @@ export class ImageBox extends React.Component<FieldViewProps, ImageBoxState> {
}
return (
<div className="imageBox-cont" onPointerDown={this.onPointerDown} ref={this._ref} >
- <img src={images[0]} width="100%" alt="Image not found" />
+ <img src={path} width="100%" alt="Image not found" />
{lightbox()}
</div>)
}