From 4ac7a62d813738b0047caefbcf40d3063ec9e6c1 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 5 Feb 2019 22:37:46 -0500 Subject: checkpoint --- src/Main.tsx | 2 +- src/documents/Documents.ts | 21 +++--- src/fields/Document.ts | 74 +++++++++------------- src/fields/ImageField.ts | 4 +- src/views/collections/CollectionDockingView.tsx | 6 +- src/views/collections/CollectionFreeFormView.tsx | 3 +- src/views/collections/CollectionSchemaView.tsx | 3 +- src/views/nodes/CollectionFreeFormDocumentView.tsx | 5 +- src/views/nodes/DocumentView.tsx | 7 +- src/views/nodes/ImageBox.tsx | 20 +++--- 10 files changed, 69 insertions(+), 76 deletions(-) (limited to 'src') 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((
- +
), 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('
')); - 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 @@ -20,43 +20,35 @@ export class Document extends Field { this.fields.set(key, sfield); } + @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 { - if (KeyStore.X == key) { - console.log(""); - } - let field: Opt; + let field: Opt = 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 = 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(key: Key, ctor: { new(...args: any[]): T }, ignoreProto: boolean = false): Opt { 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>(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(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 { return this.GetFieldT(KeyStore.Prototype, Document, true); } + @observable GetAllPrototypes(): Document[] { let protos: Document[] = []; let doc: Opt = 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 { - 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 (); + var data = value[i].GetField(KeyStore.Data); + return (); } } if (component === "text") { @@ -239,8 +240,9 @@ export class CollectionDockingView extends CollectionViewBase { var containingDiv = "component_" + me.nextId(); container.getElement().html("
"); setTimeout(function () { + var data = state.doc.GetField(KeyStore.Data); ReactDOM.render(( - + ), 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 (
{value.map(doc => { - return (); + return (); })}
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 = () + var data = this.props.DocumentForCollection.GetField(KS.Data); + content = () } else { content =
} 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 (
- +
); } 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 // needed only to set ContainingDocumentView on CollectionViewProps when invoked from JsxParser -- is there a better way? ContainingCollectionView: Opt; + Data: any; } @observer export class DocumentView extends React.Component { @@ -131,15 +132,15 @@ export class DocumentView extends React.Component { 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 (
{ 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 ( 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 { } return (
- Image not found + Image not found {lightbox()}
) } -- cgit v1.2.3-70-g09d2