From 1d667d19f5402dc9f9069e0a57008dac96f6de2a Mon Sep 17 00:00:00 2001
From: madelinegr <mgriswold99@gmail.com>
Date: Tue, 12 Feb 2019 18:55:11 -0500
Subject: set up web box classes

---
 src/fields/BasicField 2.ts        | 38 ++++++++++++++++
 src/fields/Document 2.ts          | 93 +++++++++++++++++++++++++++++++++++++++
 src/fields/DocumentReference 2.ts | 46 +++++++++++++++++++
 src/fields/Field 2.ts             | 54 +++++++++++++++++++++++
 src/fields/FieldUpdatedArgs 2.ts  | 27 ++++++++++++
 src/fields/Key 2.ts               | 45 +++++++++++++++++++
 src/fields/ListField 2.ts         | 21 +++++++++
 src/fields/NumberField 2.ts       | 13 ++++++
 src/fields/TextField 2.ts         | 13 ++++++
 src/fields/WebField.ts            | 21 +++++++++
 10 files changed, 371 insertions(+)
 create mode 100644 src/fields/BasicField 2.ts
 create mode 100644 src/fields/Document 2.ts
 create mode 100644 src/fields/DocumentReference 2.ts
 create mode 100644 src/fields/Field 2.ts
 create mode 100644 src/fields/FieldUpdatedArgs 2.ts
 create mode 100644 src/fields/Key 2.ts
 create mode 100644 src/fields/ListField 2.ts
 create mode 100644 src/fields/NumberField 2.ts
 create mode 100644 src/fields/TextField 2.ts
 create mode 100644 src/fields/WebField.ts

(limited to 'src/fields')

diff --git a/src/fields/BasicField 2.ts b/src/fields/BasicField 2.ts
new file mode 100644
index 000000000..437024d07
--- /dev/null
+++ b/src/fields/BasicField 2.ts	
@@ -0,0 +1,38 @@
+import { Field } from "./Field"
+import { observable, computed, action } from "mobx";
+
+export abstract class BasicField<T> extends Field {
+    constructor(data: T) {
+        super();
+
+        this.data = data;
+    }
+
+    @observable
+    private data:T;
+
+    @computed
+    get Data(): T {
+        return this.data;
+    }
+
+    set Data(value: T) {
+        if(this.data === value) {
+            return;
+        }
+        this.data = value;
+    }
+
+    @action
+    TrySetValue(value: any): boolean {
+        if (typeof value == typeof this.data) {
+            this.Data = value;
+            return true;
+        }
+        return false;
+    }
+
+    GetValue(): any {
+        return this.Data;
+    }
+}
diff --git a/src/fields/Document 2.ts b/src/fields/Document 2.ts
new file mode 100644
index 000000000..0bba9c21e
--- /dev/null
+++ b/src/fields/Document 2.ts	
@@ -0,0 +1,93 @@
+import { Field, Cast, Opt } from "./Field"
+import { Key, KeyStore } from "./Key"
+import { ObservableMap } from "mobx";
+
+export class Document extends Field {
+    private fields: ObservableMap<Key, Field> = new ObservableMap();
+
+    GetField(key: Key, ignoreProto: boolean = false): Opt<Field> {
+        let field: Opt<Field>;
+        if (ignoreProto) {
+            if (this.fields.has(key)) {
+                field = this.fields.get(key);
+            }
+        } else {
+            let doc: Opt<Document> = this;
+            while (doc && !(doc.fields.has(key))) {
+                doc = doc.GetPrototype();
+            }
+
+            if (doc) {
+                field = doc.fields.get(key);
+            }
+        }
+
+        return field;
+    }
+
+    GetFieldT<T extends Field = Field>(key: Key, ctor: { new(): T }, ignoreProto?: boolean): Opt<T> {
+        return Cast(this.GetField(key, ignoreProto), ctor);
+    }
+
+    GetFieldValue<T, U extends { Data: T }>(key: Key, ctor: { new(): U }, defaultVal: T): T {
+        let val = this.GetField(key);
+        return (val && val instanceof ctor) ? val.Data : defaultVal;
+    }
+
+    SetField(key: Key, field: Opt<Field>): void {
+        if (field) {
+            this.fields.set(key, field);
+        } else {
+            this.fields.delete(key);
+        }
+    }
+
+    SetFieldValue<T extends Field>(key: Key, value: any, ctor: { new(): T }): boolean {
+        let field = this.GetField(key, true);
+        if (field != null) {
+            return field.TrySetValue(value);
+        } else {
+            field = new ctor();
+            if (field.TrySetValue(value)) {
+                this.SetField(key, field);
+                return true;
+            } else {
+                return false;
+            }
+        }
+    }
+
+    GetPrototype(): Opt<Document> {
+        return this.GetFieldT(KeyStore.Prototype, Document, true);
+    }
+
+    GetAllPrototypes(): Document[] {
+        let protos: Document[] = [];
+        let doc: Opt<Document> = this;
+        while (doc != null) {
+            protos.push(doc);
+            doc = doc.GetPrototype();
+        }
+        return protos;
+    }
+
+    MakeDelegate(): Document {
+        let delegate = new Document();
+
+        delegate.SetField(KeyStore.Prototype, this);
+
+        return delegate;
+    }
+
+    TrySetValue(value: any): boolean {
+        throw new Error("Method not implemented.");
+    }
+    GetValue() {
+        throw new Error("Method not implemented.");
+    }
+    Copy(): Field {
+        throw new Error("Method not implemented.");
+    }
+
+
+}
\ No newline at end of file
diff --git a/src/fields/DocumentReference 2.ts b/src/fields/DocumentReference 2.ts
new file mode 100644
index 000000000..936067bd2
--- /dev/null
+++ b/src/fields/DocumentReference 2.ts	
@@ -0,0 +1,46 @@
+import { Field, Opt } from "./Field";
+import { Document } from "./Document";
+import { Key } from "./Key";
+import { DocumentUpdatedArgs } from "./FieldUpdatedArgs";
+
+export class DocumentReference extends Field {
+    get Key(): Key{
+        return this.key;
+    }
+
+    get Document(): Document {
+        return this.document;
+    }
+
+    constructor(private document: Document, private key: Key) {
+        super();
+    }
+
+    private DocFieldUpdated(args: DocumentUpdatedArgs):void{
+        // this.FieldUpdated.emit(args.fieldArgs);
+    }
+
+    Dereference() : Opt<Field> {
+        return this.document.GetField(this.key);
+    }
+
+    DereferenceToRoot(): Opt<Field> {
+        let field: Opt<Field> = this;
+        while (field instanceof DocumentReference) {
+            field = field.Dereference();
+        }
+        return field;
+    }
+
+    TrySetValue(value: any): boolean {
+        throw new Error("Method not implemented.");
+    }
+    GetValue() {
+        throw new Error("Method not implemented.");
+    }
+    Copy(): Field {
+        throw new Error("Method not implemented.");
+    }
+
+
+}
\ No newline at end of file
diff --git a/src/fields/Field 2.ts b/src/fields/Field 2.ts
new file mode 100644
index 000000000..46f92f203
--- /dev/null
+++ b/src/fields/Field 2.ts	
@@ -0,0 +1,54 @@
+import { TypedEvent } from "../util/TypedEvent";
+import { FieldUpdatedArgs } from "./FieldUpdatedArgs";
+import { DocumentReference } from "./DocumentReference";
+import { Utils } from "../Utils";
+
+export function Cast<T extends Field>(field: Opt<Field>, ctor: { new(): T }): Opt<T> {
+    if (field) {
+        if (ctor && field instanceof ctor) {
+            return field;
+        }
+    }
+    return undefined;
+}
+
+export type Opt<T> = T | undefined;
+
+export abstract class Field {
+    //FieldUpdated: TypedEvent<Opt<FieldUpdatedArgs>> = new TypedEvent<Opt<FieldUpdatedArgs>>();
+
+    private id: string;
+    get Id(): string {
+        return this.id;
+    }
+
+    constructor(id: Opt<string> = undefined) {
+        this.id = id || Utils.GenerateGuid();
+    }
+
+    Dereference(): Opt<Field> {
+        return this;
+    }
+    DereferenceToRoot(): Opt<Field> {
+        return this;
+    }
+
+    DereferenceT<T extends Field = Field>(ctor: { new(): T }): Opt<T> {
+        return Cast(this.Dereference(), ctor);
+    }
+
+    DereferenceToRootT<T extends Field = Field>(ctor: { new(): T }): Opt<T> {
+        return Cast(this.DereferenceToRoot(), ctor);
+    }
+
+    Equals(other: Field): boolean {
+        return this.id === other.id;
+    }
+
+    abstract TrySetValue(value: any): boolean;
+
+    abstract GetValue(): any;
+
+    abstract Copy(): Field;
+
+}
\ No newline at end of file
diff --git a/src/fields/FieldUpdatedArgs 2.ts b/src/fields/FieldUpdatedArgs 2.ts
new file mode 100644
index 000000000..23ccf2a5a
--- /dev/null
+++ b/src/fields/FieldUpdatedArgs 2.ts	
@@ -0,0 +1,27 @@
+import { Field, Opt } from "./Field";
+import { Document } from "./Document";
+import { Key } from "./Key";
+
+export enum FieldUpdatedAction {
+    Add,
+    Remove,
+    Replace,
+    Update
+}
+
+export interface FieldUpdatedArgs {
+    field: Field;
+    action: FieldUpdatedAction;
+}
+
+export interface DocumentUpdatedArgs {
+    field: Document;
+    key: Key;
+
+    oldValue: Opt<Field>;
+    newValue: Opt<Field>;
+
+    fieldArgs?: FieldUpdatedArgs;
+
+    action: FieldUpdatedAction;
+}
diff --git a/src/fields/Key 2.ts b/src/fields/Key 2.ts
new file mode 100644
index 000000000..db30f545d
--- /dev/null
+++ b/src/fields/Key 2.ts	
@@ -0,0 +1,45 @@
+import { Field } from "./Field"
+import { Utils } from "../Utils";
+import { observable } from "mobx";
+
+export class Key extends Field {
+    private name:string;
+
+    get Name():string {
+        return this.name;
+    }
+
+    constructor(name:string){
+        super(Utils.GenerateDeterministicGuid(name));
+
+        this.name = name;
+    }
+
+    TrySetValue(value: any): boolean {
+        throw new Error("Method not implemented.");
+    }
+
+    GetValue() {
+        return this.Name;
+    }
+
+    Copy(): Field {
+        return this;
+    }
+
+
+}
+
+export namespace KeyStore {
+    export let Prototype = new Key("Prototype");
+    export let X = new Key("X");
+    export let Y = new Key("Y");
+    export let PanX = new Key("PanX");
+    export let PanY = new Key("PanY");
+    export let Width = new Key("Width");
+    export let Height = new Key("Height");
+    export let Data = new Key("Data");
+    export let Layout = new Key("Layout");
+    export let LayoutKeys = new Key("LayoutKeys");
+    export let LayoutFields = new Key("LayoutFields");
+}
\ No newline at end of file
diff --git a/src/fields/ListField 2.ts b/src/fields/ListField 2.ts
new file mode 100644
index 000000000..dd96ea8c8
--- /dev/null
+++ b/src/fields/ListField 2.ts	
@@ -0,0 +1,21 @@
+import { Field } from "./Field";
+import { BasicField } from "./BasicField";
+
+export class ListField<T extends Field> extends BasicField<T[]> {
+    constructor(data: T[] = []) {
+        super(data.slice());
+    }
+
+    Get(index:number) : T{
+        return this.Data[index];
+    }
+
+    Set(index:number, value:T):void {
+        this.Data[index] = value;
+    }
+
+    Copy(): Field {
+        return new ListField<T>(this.Data);
+    }
+
+}
\ No newline at end of file
diff --git a/src/fields/NumberField 2.ts b/src/fields/NumberField 2.ts
new file mode 100644
index 000000000..cbe15f987
--- /dev/null
+++ b/src/fields/NumberField 2.ts	
@@ -0,0 +1,13 @@
+import { BasicField } from "./BasicField"
+
+export class NumberField extends BasicField<number> {
+    constructor(data: number = 0) {
+        super(data);
+    }
+
+    Copy() {
+        return new NumberField(this.Data);
+    }
+
+
+}
\ No newline at end of file
diff --git a/src/fields/TextField 2.ts b/src/fields/TextField 2.ts
new file mode 100644
index 000000000..a7c221788
--- /dev/null
+++ b/src/fields/TextField 2.ts	
@@ -0,0 +1,13 @@
+import { BasicField } from "./BasicField"
+
+export class TextField extends BasicField<string> {
+    constructor(data: string = "") {
+        super(data);
+    }
+
+    Copy() {
+        return new TextField(this.Data);
+    }
+
+
+}
diff --git a/src/fields/WebField.ts b/src/fields/WebField.ts
new file mode 100644
index 000000000..88e6130e0
--- /dev/null
+++ b/src/fields/WebField.ts
@@ -0,0 +1,21 @@
+import { BasicField } from "./BasicField";
+import { Field } from "./Field";
+
+export class WebField extends BasicField<URL> {
+    constructor(data: URL | undefined = undefined) {
+        super(data == undefined ? new URL("https://cs.brown.edu/") : data);
+    }
+
+    toString(): string {
+        return this.Data.href;
+    }
+
+    ToScriptString(): string {
+        return `new WebField("${this.Data}")`;
+    }
+
+    Copy(): Field {
+        return new WebField(this.Data);
+    }
+
+}
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From 837509322d7e556830c57653828e223b06eb38a6 Mon Sep 17 00:00:00 2001
From: madelinegr <mgriswold99@gmail.com>
Date: Tue, 12 Feb 2019 19:25:28 -0500
Subject: fixed bugs with launching

---
 .DS_Store                                          | Bin 0 -> 6148 bytes
 package-lock.json                                  |   6 +-
 src/.DS_Store                                      | Bin 0 -> 6148 bytes
 src/client/documents/Documents.ts                  |   4 +-
 src/client/views/nodes/DocumentView.tsx            |   5 +-
 src/client/views/nodes/WebBox.scss                 |   4 +-
 src/documents/Documents.ts                         |  92 --------------
 src/fields/Document 2.ts                           |  93 --------------
 src/fields/DocumentReference 2.ts                  |  46 -------
 src/fields/Field 2.ts                              |  54 ---------
 src/fields/FieldUpdatedArgs 2.ts                   |  27 -----
 src/fields/Key 2.ts                                |  45 -------
 src/fields/ListField 2.ts                          |  21 ----
 src/fields/NumberField 2.ts                        |  13 --
 src/fields/TextField 2.ts                          |  13 --
 src/stores/NodeCollectionStore.ts                  |  25 ----
 src/stores/NodeStore.ts                            |  24 ----
 src/stores/RootStore.ts                            |  16 ---
 src/stores/StaticTextNodeStore.ts                  |  16 ---
 src/stores/VideoNodeStore.ts                       |  17 ---
 src/util/TypedEvent.ts                             |  42 -------
 src/viewmodels/DocumentViewModel.ts                |  11 --
 .../freeformcanvas/CollectionFreeFormView.scss     |  15 ---
 .../freeformcanvas/CollectionFreeFormView.tsx      |  98 ---------------
 src/views/freeformcanvas/FreeFormCanvas.scss       |  15 ---
 src/views/freeformcanvas/FreeFormCanvas.tsx        |  86 -------------
 src/views/nodes/DocumentView.tsx                   | 134 ---------------------
 src/views/nodes/FieldTextBox.tsx                   | 117 ------------------
 src/views/nodes/NodeView.scss                      |  31 -----
 src/views/nodes/RichTextView.tsx                   |   0
 src/views/nodes/TextNodeView.tsx                   |  28 -----
 src/views/nodes/TopBar.tsx                         |  46 -------
 src/views/nodes/VideoNodeView.scss                 |   5 -
 src/views/nodes/VideoNodeView.tsx                  |  29 -----
 34 files changed, 10 insertions(+), 1168 deletions(-)
 create mode 100644 .DS_Store
 create mode 100644 src/.DS_Store
 delete mode 100644 src/documents/Documents.ts
 delete mode 100644 src/fields/Document 2.ts
 delete mode 100644 src/fields/DocumentReference 2.ts
 delete mode 100644 src/fields/Field 2.ts
 delete mode 100644 src/fields/FieldUpdatedArgs 2.ts
 delete mode 100644 src/fields/Key 2.ts
 delete mode 100644 src/fields/ListField 2.ts
 delete mode 100644 src/fields/NumberField 2.ts
 delete mode 100644 src/fields/TextField 2.ts
 delete mode 100644 src/stores/NodeCollectionStore.ts
 delete mode 100644 src/stores/NodeStore.ts
 delete mode 100644 src/stores/RootStore.ts
 delete mode 100644 src/stores/StaticTextNodeStore.ts
 delete mode 100644 src/stores/VideoNodeStore.ts
 delete mode 100644 src/util/TypedEvent.ts
 delete mode 100644 src/viewmodels/DocumentViewModel.ts
 delete mode 100644 src/views/freeformcanvas/CollectionFreeFormView.scss
 delete mode 100644 src/views/freeformcanvas/CollectionFreeFormView.tsx
 delete mode 100644 src/views/freeformcanvas/FreeFormCanvas.scss
 delete mode 100644 src/views/freeformcanvas/FreeFormCanvas.tsx
 delete mode 100644 src/views/nodes/DocumentView.tsx
 delete mode 100644 src/views/nodes/FieldTextBox.tsx
 delete mode 100644 src/views/nodes/NodeView.scss
 delete mode 100644 src/views/nodes/RichTextView.tsx
 delete mode 100644 src/views/nodes/TextNodeView.tsx
 delete mode 100644 src/views/nodes/TopBar.tsx
 delete mode 100644 src/views/nodes/VideoNodeView.scss
 delete mode 100644 src/views/nodes/VideoNodeView.tsx

(limited to 'src/fields')

diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 000000000..8493b4a74
Binary files /dev/null and b/.DS_Store differ
diff --git a/package-lock.json b/package-lock.json
index a4939f1cb..5b62532c4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9119,7 +9119,7 @@
     },
     "regjsparser": {
       "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
+      "resolved": "http://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
       "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw=",
       "dev": true,
       "requires": {
@@ -9470,7 +9470,7 @@
     },
     "sha.js": {
       "version": "2.4.11",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
+      "resolved": "http://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
       "integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==",
       "dev": true,
       "requires": {
@@ -9962,7 +9962,7 @@
     },
     "strip-eof": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
       "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8="
     },
     "strip-indent": {
diff --git a/src/.DS_Store b/src/.DS_Store
new file mode 100644
index 000000000..4d6acb95a
Binary files /dev/null and b/src/.DS_Store differ
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index d8db6ee79..605a99bef 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -69,7 +69,7 @@ export namespace Documents {
     export function TextDocument(options: DocumentOptions = {}): Document {
         let doc = GetTextPrototype().MakeDelegate();
         setupOptions(doc, options);
-        // doc.SetField(KeyStore.Data, new RichTextField());
+        // doc.Set(KeyStore.Data, new RichTextField());
         return doc;
     }
 
@@ -131,7 +131,7 @@ export namespace Documents {
             imageProto.Set(KeyStore.Height, new NumberField(300));
             imageProto.Set(KeyStore.Layout, new TextField(CollectionFreeFormView.LayoutString("AnnotationsKey")));
             imageProto.Set(KeyStore.BackgroundLayout, new TextField(ImageBox.LayoutString()));
-            // imageProto.SetField(KeyStore.Layout, new TextField('<div style={"background-image: " + {Data}} />'));
+            // imageProto.Set(KeyStore.Layout, new TextField('<div style={"background-image: " + {Data}} />'));
             imageProto.Set(KeyStore.LayoutKeys, new ListField([KeyStore.Data, KeyStore.Annotations]));
             Server.AddDocument(imageProto);
             return imageProto;
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 3a73f2fde..b13d6486b 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -13,6 +13,7 @@ import { CollectionSchemaView } from "../collections/CollectionSchemaView";
 import { CollectionViewBase, COLLECTION_BORDER_WIDTH } from "../collections/CollectionViewBase";
 import { FormattedTextBox } from "../nodes/FormattedTextBox";
 import { ImageBox } from "../nodes/ImageBox";
+import { WebBox } from "../nodes/WebBox";
 import "./NodeView.scss";
 import React = require("react");
 import { Transform } from "../../util/Transform";
@@ -151,7 +152,7 @@ export class DocumentView extends React.Component<DocumentViewProps> {
             bindings.DocumentView = this; // set the DocumentView to this if it hasn't already been set by a sub-class during its render method.
         }
         var annotated = <JsxParser
-            components={{ FormattedTextBox: FormattedTextBox, ImageBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }}
+            components={{ FormattedTextBox: FormattedTextBox, ImageBox, WebBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }}
             bindings={bindings}
             jsx={this.backgroundLayout}
             showWarnings={true}
@@ -166,7 +167,7 @@ export class DocumentView extends React.Component<DocumentViewProps> {
         return (
             <div className="node" ref={this._mainCont} style={{ width: strwidth, height: strheight, transformOrigin: "left top", transform: `scale(${this.props.Scaling},${this.props.Scaling})` }}>
                 <JsxParser
-                    components={{ FormattedTextBox: FormattedTextBox, ImageBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }}
+                    components={{ FormattedTextBox: FormattedTextBox, ImageBox, WebBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView }}
                     bindings={bindings}
                     jsx={this.layout}
                     showWarnings={true}
diff --git a/src/client/views/nodes/WebBox.scss b/src/client/views/nodes/WebBox.scss
index 2bd8b1d3c..9df984d68 100644
--- a/src/client/views/nodes/WebBox.scss
+++ b/src/client/views/nodes/WebBox.scss
@@ -1,11 +1,11 @@
 
-.imageBox-cont {
+.webBox-cont {
     padding: 0vw;
     position: absolute;
     width: 100%
 }
 
-.imageBox-button {
+.webBox-button {
     padding : 0vw;
     border: none;
     width : 100%;
diff --git a/src/documents/Documents.ts b/src/documents/Documents.ts
deleted file mode 100644
index beee44bee..000000000
--- a/src/documents/Documents.ts
+++ /dev/null
@@ -1,92 +0,0 @@
-import { Document } from "../fields/Document";
-import { KeyStore } from "../fields/Key";
-import { TextField } from "../fields/TextField";
-import { NumberField } from "../fields/NumberField";
-import { ListField } from "../fields/ListField";
-
-interface DocumentOptions {
-    x?: number;
-    y?: number;
-    width?: number;
-    height?: number;
-}
-
-export namespace Documents {
-    function setupOptions(doc: Document, options: DocumentOptions): void {
-        if(options.x) {
-            doc.SetFieldValue(KeyStore.X, options.x, NumberField);
-        }
-        if(options.y) {
-            doc.SetFieldValue(KeyStore.Y, options.y, NumberField);
-        }
-        if(options.width) {
-            doc.SetFieldValue(KeyStore.Width, options.width, NumberField);
-        }
-        if(options.height) {
-            doc.SetFieldValue(KeyStore.Height, options.height, NumberField);
-        }
-    }
-
-    let textProto:Document;
-    function GetTextPrototype(): Document {
-        if(!textProto) {
-            textProto = new Document();
-            textProto.SetField(KeyStore.X, new NumberField(0));
-            textProto.SetField(KeyStore.Y, new NumberField(0));
-            textProto.SetField(KeyStore.Width, new NumberField(300));
-            textProto.SetField(KeyStore.Height, new NumberField(150));
-            textProto.SetField(KeyStore.Layout, new TextField("<FieldTextBox doc={doc} fieldKey={DataKey} />"));
-            textProto.SetField(KeyStore.LayoutKeys, new ListField([KeyStore.Data]));
-        }
-        return textProto;
-    }
-
-    export function TextDocument(text: string, options:DocumentOptions = {}): Document {
-        let doc = GetTextPrototype().MakeDelegate();
-        setupOptions(doc, options);
-        // doc.SetField(KeyStore.Data, new TextField(text));
-        return doc;
-    }
-
-    let imageProto:Document;
-    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('<img src={Data} alt="Image not found"/>'));
-            imageProto.SetField(KeyStore.LayoutFields, new ListField([KeyStore.Data]));
-        }
-        return imageProto;
-    }
-
-    export function ImageDocument(url: string, options:DocumentOptions = {}): Document {
-        let doc = GetImagePrototype().MakeDelegate();
-        setupOptions(doc, options);
-        doc.SetField(KeyStore.Data, new TextField(url));
-        return doc;
-    }
-
-    let collectionProto:Document;
-    function GetCollectionPrototype(): Document {
-        if(!collectionProto) {
-            collectionProto = new Document();
-            collectionProto.SetField(KeyStore.X, new NumberField(150));
-            collectionProto.SetField(KeyStore.Y, new NumberField(0));
-            collectionProto.SetField(KeyStore.Width, new NumberField(300));
-            collectionProto.SetField(KeyStore.Height, new NumberField(300));
-            collectionProto.SetField(KeyStore.Layout, new TextField('<CollectionFreeFormView doc={doc} fieldKey={DataKey}/>'));
-            collectionProto.SetField(KeyStore.LayoutKeys, new ListField([KeyStore.Data]));
-        }
-        return collectionProto;
-    }
-
-    export function CollectionDocument( documents: Array<Document>, options:DocumentOptions = {}): Document {
-        let doc = GetCollectionPrototype().MakeDelegate();
-        setupOptions(doc, options);
-        doc.SetField(KeyStore.Data, new ListField(documents));
-        return doc;
-    }
-}
\ No newline at end of file
diff --git a/src/fields/Document 2.ts b/src/fields/Document 2.ts
deleted file mode 100644
index 0bba9c21e..000000000
--- a/src/fields/Document 2.ts	
+++ /dev/null
@@ -1,93 +0,0 @@
-import { Field, Cast, Opt } from "./Field"
-import { Key, KeyStore } from "./Key"
-import { ObservableMap } from "mobx";
-
-export class Document extends Field {
-    private fields: ObservableMap<Key, Field> = new ObservableMap();
-
-    GetField(key: Key, ignoreProto: boolean = false): Opt<Field> {
-        let field: Opt<Field>;
-        if (ignoreProto) {
-            if (this.fields.has(key)) {
-                field = this.fields.get(key);
-            }
-        } else {
-            let doc: Opt<Document> = this;
-            while (doc && !(doc.fields.has(key))) {
-                doc = doc.GetPrototype();
-            }
-
-            if (doc) {
-                field = doc.fields.get(key);
-            }
-        }
-
-        return field;
-    }
-
-    GetFieldT<T extends Field = Field>(key: Key, ctor: { new(): T }, ignoreProto?: boolean): Opt<T> {
-        return Cast(this.GetField(key, ignoreProto), ctor);
-    }
-
-    GetFieldValue<T, U extends { Data: T }>(key: Key, ctor: { new(): U }, defaultVal: T): T {
-        let val = this.GetField(key);
-        return (val && val instanceof ctor) ? val.Data : defaultVal;
-    }
-
-    SetField(key: Key, field: Opt<Field>): void {
-        if (field) {
-            this.fields.set(key, field);
-        } else {
-            this.fields.delete(key);
-        }
-    }
-
-    SetFieldValue<T extends Field>(key: Key, value: any, ctor: { new(): T }): boolean {
-        let field = this.GetField(key, true);
-        if (field != null) {
-            return field.TrySetValue(value);
-        } else {
-            field = new ctor();
-            if (field.TrySetValue(value)) {
-                this.SetField(key, field);
-                return true;
-            } else {
-                return false;
-            }
-        }
-    }
-
-    GetPrototype(): Opt<Document> {
-        return this.GetFieldT(KeyStore.Prototype, Document, true);
-    }
-
-    GetAllPrototypes(): Document[] {
-        let protos: Document[] = [];
-        let doc: Opt<Document> = this;
-        while (doc != null) {
-            protos.push(doc);
-            doc = doc.GetPrototype();
-        }
-        return protos;
-    }
-
-    MakeDelegate(): Document {
-        let delegate = new Document();
-
-        delegate.SetField(KeyStore.Prototype, this);
-
-        return delegate;
-    }
-
-    TrySetValue(value: any): boolean {
-        throw new Error("Method not implemented.");
-    }
-    GetValue() {
-        throw new Error("Method not implemented.");
-    }
-    Copy(): Field {
-        throw new Error("Method not implemented.");
-    }
-
-
-}
\ No newline at end of file
diff --git a/src/fields/DocumentReference 2.ts b/src/fields/DocumentReference 2.ts
deleted file mode 100644
index 936067bd2..000000000
--- a/src/fields/DocumentReference 2.ts	
+++ /dev/null
@@ -1,46 +0,0 @@
-import { Field, Opt } from "./Field";
-import { Document } from "./Document";
-import { Key } from "./Key";
-import { DocumentUpdatedArgs } from "./FieldUpdatedArgs";
-
-export class DocumentReference extends Field {
-    get Key(): Key{
-        return this.key;
-    }
-
-    get Document(): Document {
-        return this.document;
-    }
-
-    constructor(private document: Document, private key: Key) {
-        super();
-    }
-
-    private DocFieldUpdated(args: DocumentUpdatedArgs):void{
-        // this.FieldUpdated.emit(args.fieldArgs);
-    }
-
-    Dereference() : Opt<Field> {
-        return this.document.GetField(this.key);
-    }
-
-    DereferenceToRoot(): Opt<Field> {
-        let field: Opt<Field> = this;
-        while (field instanceof DocumentReference) {
-            field = field.Dereference();
-        }
-        return field;
-    }
-
-    TrySetValue(value: any): boolean {
-        throw new Error("Method not implemented.");
-    }
-    GetValue() {
-        throw new Error("Method not implemented.");
-    }
-    Copy(): Field {
-        throw new Error("Method not implemented.");
-    }
-
-
-}
\ No newline at end of file
diff --git a/src/fields/Field 2.ts b/src/fields/Field 2.ts
deleted file mode 100644
index 46f92f203..000000000
--- a/src/fields/Field 2.ts	
+++ /dev/null
@@ -1,54 +0,0 @@
-import { TypedEvent } from "../util/TypedEvent";
-import { FieldUpdatedArgs } from "./FieldUpdatedArgs";
-import { DocumentReference } from "./DocumentReference";
-import { Utils } from "../Utils";
-
-export function Cast<T extends Field>(field: Opt<Field>, ctor: { new(): T }): Opt<T> {
-    if (field) {
-        if (ctor && field instanceof ctor) {
-            return field;
-        }
-    }
-    return undefined;
-}
-
-export type Opt<T> = T | undefined;
-
-export abstract class Field {
-    //FieldUpdated: TypedEvent<Opt<FieldUpdatedArgs>> = new TypedEvent<Opt<FieldUpdatedArgs>>();
-
-    private id: string;
-    get Id(): string {
-        return this.id;
-    }
-
-    constructor(id: Opt<string> = undefined) {
-        this.id = id || Utils.GenerateGuid();
-    }
-
-    Dereference(): Opt<Field> {
-        return this;
-    }
-    DereferenceToRoot(): Opt<Field> {
-        return this;
-    }
-
-    DereferenceT<T extends Field = Field>(ctor: { new(): T }): Opt<T> {
-        return Cast(this.Dereference(), ctor);
-    }
-
-    DereferenceToRootT<T extends Field = Field>(ctor: { new(): T }): Opt<T> {
-        return Cast(this.DereferenceToRoot(), ctor);
-    }
-
-    Equals(other: Field): boolean {
-        return this.id === other.id;
-    }
-
-    abstract TrySetValue(value: any): boolean;
-
-    abstract GetValue(): any;
-
-    abstract Copy(): Field;
-
-}
\ No newline at end of file
diff --git a/src/fields/FieldUpdatedArgs 2.ts b/src/fields/FieldUpdatedArgs 2.ts
deleted file mode 100644
index 23ccf2a5a..000000000
--- a/src/fields/FieldUpdatedArgs 2.ts	
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Field, Opt } from "./Field";
-import { Document } from "./Document";
-import { Key } from "./Key";
-
-export enum FieldUpdatedAction {
-    Add,
-    Remove,
-    Replace,
-    Update
-}
-
-export interface FieldUpdatedArgs {
-    field: Field;
-    action: FieldUpdatedAction;
-}
-
-export interface DocumentUpdatedArgs {
-    field: Document;
-    key: Key;
-
-    oldValue: Opt<Field>;
-    newValue: Opt<Field>;
-
-    fieldArgs?: FieldUpdatedArgs;
-
-    action: FieldUpdatedAction;
-}
diff --git a/src/fields/Key 2.ts b/src/fields/Key 2.ts
deleted file mode 100644
index db30f545d..000000000
--- a/src/fields/Key 2.ts	
+++ /dev/null
@@ -1,45 +0,0 @@
-import { Field } from "./Field"
-import { Utils } from "../Utils";
-import { observable } from "mobx";
-
-export class Key extends Field {
-    private name:string;
-
-    get Name():string {
-        return this.name;
-    }
-
-    constructor(name:string){
-        super(Utils.GenerateDeterministicGuid(name));
-
-        this.name = name;
-    }
-
-    TrySetValue(value: any): boolean {
-        throw new Error("Method not implemented.");
-    }
-
-    GetValue() {
-        return this.Name;
-    }
-
-    Copy(): Field {
-        return this;
-    }
-
-
-}
-
-export namespace KeyStore {
-    export let Prototype = new Key("Prototype");
-    export let X = new Key("X");
-    export let Y = new Key("Y");
-    export let PanX = new Key("PanX");
-    export let PanY = new Key("PanY");
-    export let Width = new Key("Width");
-    export let Height = new Key("Height");
-    export let Data = new Key("Data");
-    export let Layout = new Key("Layout");
-    export let LayoutKeys = new Key("LayoutKeys");
-    export let LayoutFields = new Key("LayoutFields");
-}
\ No newline at end of file
diff --git a/src/fields/ListField 2.ts b/src/fields/ListField 2.ts
deleted file mode 100644
index dd96ea8c8..000000000
--- a/src/fields/ListField 2.ts	
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Field } from "./Field";
-import { BasicField } from "./BasicField";
-
-export class ListField<T extends Field> extends BasicField<T[]> {
-    constructor(data: T[] = []) {
-        super(data.slice());
-    }
-
-    Get(index:number) : T{
-        return this.Data[index];
-    }
-
-    Set(index:number, value:T):void {
-        this.Data[index] = value;
-    }
-
-    Copy(): Field {
-        return new ListField<T>(this.Data);
-    }
-
-}
\ No newline at end of file
diff --git a/src/fields/NumberField 2.ts b/src/fields/NumberField 2.ts
deleted file mode 100644
index cbe15f987..000000000
--- a/src/fields/NumberField 2.ts	
+++ /dev/null
@@ -1,13 +0,0 @@
-import { BasicField } from "./BasicField"
-
-export class NumberField extends BasicField<number> {
-    constructor(data: number = 0) {
-        super(data);
-    }
-
-    Copy() {
-        return new NumberField(this.Data);
-    }
-
-
-}
\ No newline at end of file
diff --git a/src/fields/TextField 2.ts b/src/fields/TextField 2.ts
deleted file mode 100644
index a7c221788..000000000
--- a/src/fields/TextField 2.ts	
+++ /dev/null
@@ -1,13 +0,0 @@
-import { BasicField } from "./BasicField"
-
-export class TextField extends BasicField<string> {
-    constructor(data: string = "") {
-        super(data);
-    }
-
-    Copy() {
-        return new TextField(this.Data);
-    }
-
-
-}
diff --git a/src/stores/NodeCollectionStore.ts b/src/stores/NodeCollectionStore.ts
deleted file mode 100644
index ac4f515f1..000000000
--- a/src/stores/NodeCollectionStore.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { computed, observable, action } from "mobx";
-import { NodeStore } from "./NodeStore";
-import { Document } from "../fields/Document";
-
-export class NodeCollectionStore extends NodeStore {
-
-    @observable
-    public Scale: number = 1;
-
-    @observable
-    public Nodes: NodeStore[] = new Array<NodeStore>();
-
-    @observable
-    public Docs: Document[] = [];
-
-    @computed
-    public get Transform(): string {
-        return "translate(" + this.X + "px," + this.Y + "px) scale(" + this.Scale + "," + this.Scale + ")";
-    }
-
-    @action
-    public AddNodes(stores: NodeStore[]): void {
-        stores.forEach(store => this.Nodes.push(store));
-    }
-}
\ No newline at end of file
diff --git a/src/stores/NodeStore.ts b/src/stores/NodeStore.ts
deleted file mode 100644
index 6a734cf44..000000000
--- a/src/stores/NodeStore.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import { computed, observable } from "mobx";
-import { Utils } from "../Utils";
-
-export class NodeStore {
-
-    public Id: string = Utils.GenerateGuid();
-
-    @observable
-    public X: number = 0;
-
-    @observable
-    public Y: number = 0;
-
-    @observable
-    public Width: number = 0;
-
-    @observable
-    public Height: number = 0;
-
-    @computed
-    public get Transform(): string {
-        return "translate(" + this.X + "px, " + this.Y + "px)";
-    }
-}
\ No newline at end of file
diff --git a/src/stores/RootStore.ts b/src/stores/RootStore.ts
deleted file mode 100644
index fa551c1d1..000000000
--- a/src/stores/RootStore.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import { action, observable } from "mobx";
-import { NodeStore } from "./NodeStore";
-
-// This globally accessible store might come in handy, although you may decide that you don't need it.
-export class RootStore {
-
-    private constructor() {
-        // initialization code
-    }
-
-    private static _instance: RootStore;
-
-    public static get Instance():RootStore {
-        return this._instance || (this._instance = new this());
-    }
-}
\ No newline at end of file
diff --git a/src/stores/StaticTextNodeStore.ts b/src/stores/StaticTextNodeStore.ts
deleted file mode 100644
index 7c342a7a2..000000000
--- a/src/stores/StaticTextNodeStore.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import { observable } from "mobx";
-import { NodeStore } from "./NodeStore";
-
-export class StaticTextNodeStore extends NodeStore {
-
-    constructor(initializer: Partial<StaticTextNodeStore>) {
-        super();
-        Object.assign(this, initializer);
-    }
-
-    @observable
-    public Title: string = "";
-
-    @observable
-    public Text: string = "";
-}
\ No newline at end of file
diff --git a/src/stores/VideoNodeStore.ts b/src/stores/VideoNodeStore.ts
deleted file mode 100644
index e5187ab07..000000000
--- a/src/stores/VideoNodeStore.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { observable } from "mobx";
-import { NodeStore } from "./NodeStore";
-
-export class VideoNodeStore extends NodeStore {
-
-    constructor(initializer: Partial<VideoNodeStore>) {
-        super();
-        Object.assign(this, initializer);
-    }
-
-    @observable
-    public Title: string = "";
-
-    @observable
-    public Url: string = "";
-
-}
\ No newline at end of file
diff --git a/src/util/TypedEvent.ts b/src/util/TypedEvent.ts
deleted file mode 100644
index 0714a7f5c..000000000
--- a/src/util/TypedEvent.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-export interface Listener<T> {
-  (event: T): any;
-}
-
-export interface Disposable {
-  dispose(): void;
-}
-
-/** passes through events as they happen. You will not get events from before you start listening */
-export class TypedEvent<T> {
-  private listeners: Listener<T>[] = [];
-  private listenersOncer: Listener<T>[] = [];
-
-  on = (listener: Listener<T>): Disposable => {
-    this.listeners.push(listener);
-    return {
-      dispose: () => this.off(listener)
-    };
-  }
-
-  once = (listener: Listener<T>): void => {
-    this.listenersOncer.push(listener);
-  }
-
-  off = (listener: Listener<T>) => {
-    var callbackIndex = this.listeners.indexOf(listener);
-    if (callbackIndex > -1) this.listeners.splice(callbackIndex, 1);
-  }
-
-  emit = (event: T) => {
-    /** Update any general listeners */
-    this.listeners.forEach((listener) => listener(event));
-
-    /** Clear the `once` queue */
-    this.listenersOncer.forEach((listener) => listener(event));
-    this.listenersOncer = [];
-  }
-
-  pipe = (te: TypedEvent<T>): Disposable => {
-    return this.on((e) => te.emit(e));
-  }
-}
\ No newline at end of file
diff --git a/src/viewmodels/DocumentViewModel.ts b/src/viewmodels/DocumentViewModel.ts
deleted file mode 100644
index 008275f3c..000000000
--- a/src/viewmodels/DocumentViewModel.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Document } from "../fields/Document";
-
-export class DocumentViewModel {
-    constructor(private doc: Document) {
-
-    }
-
-    get Doc(): Document {
-        return this.doc;
-    }
-}
\ No newline at end of file
diff --git a/src/views/freeformcanvas/CollectionFreeFormView.scss b/src/views/freeformcanvas/CollectionFreeFormView.scss
deleted file mode 100644
index cb4805eb3..000000000
--- a/src/views/freeformcanvas/CollectionFreeFormView.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-.collectionfreeformview-container {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
-
-    .collectionfreeformview {
-        position: absolute;
-        top: 0;
-        left: 0;
-    }
-}
-
diff --git a/src/views/freeformcanvas/CollectionFreeFormView.tsx b/src/views/freeformcanvas/CollectionFreeFormView.tsx
deleted file mode 100644
index d5343536d..000000000
--- a/src/views/freeformcanvas/CollectionFreeFormView.tsx
+++ /dev/null
@@ -1,98 +0,0 @@
-import { observer } from "mobx-react";
-import { Key, KeyStore } from "../../fields/Key";
-import "./FreeFormCanvas.scss";
-import React = require("react");
-import { action } from "mobx";
-import { Document } from "../../fields/Document";
-import { DocumentViewModel } from "../../viewmodels/DocumentViewModel";
-import { DocumentView } from "../nodes/DocumentView";
-import { ListField } from "../../fields/ListField";
-import { NumberField } from "../../fields/NumberField";
-import { SSL_OP_SINGLE_DH_USE } from "constants";
-
-interface IProps {
-    fieldKey: Key;
-    doc: Document;
-}
-
-@observer
-export class CollectionFreeFormView extends React.Component<IProps> {
-
-    private _isPointerDown: boolean = false;
-
-    constructor(props: IProps) {
-        super(props);
-    }
-
-    @action
-    onPointerDown = (e: React.PointerEvent): void => {
-        e.stopPropagation();
-        if (e.button === 2) {
-            this._isPointerDown = true;
-            document.removeEventListener("pointermove", this.onPointerMove);
-            document.addEventListener("pointermove", this.onPointerMove);
-            document.removeEventListener("pointerup", this.onPointerUp);
-            document.addEventListener("pointerup", this.onPointerUp);
-        }
-    }
-
-    @action
-    onPointerUp = (e: PointerEvent): void => {
-        e.stopPropagation();
-        if (e.button === 2) {
-            this._isPointerDown = false;
-            document.removeEventListener("pointermove", this.onPointerMove);
-            document.removeEventListener("pointerup", this.onPointerUp);
-        }
-    }
-
-    @action
-    onPointerMove = (e: PointerEvent): void => {
-        e.preventDefault();
-        e.stopPropagation();
-        if (!this._isPointerDown) {
-            return;
-        }
-        const { doc } = this.props;
-        let x = doc.GetFieldValue(KeyStore.PanX, NumberField, Number(0));
-        let y = doc.GetFieldValue(KeyStore.PanY, NumberField, Number(0));
-        doc.SetFieldValue(KeyStore.PanX, x + e.movementX, NumberField);
-        doc.SetFieldValue(KeyStore.PanY, y + e.movementY, NumberField);
-    }
-
-    @action
-    onPointerWheel = (e: React.WheelEvent): void => {
-        e.stopPropagation();
-
-        let scaleAmount = 1 - (e.deltaY / 1000);
-        //this.props.store.Scale *= scaleAmount;
-    }
-
-    render() {
-        const { fieldKey, doc } = this.props;
-        const value: Document[] = doc.GetFieldValue(fieldKey, ListField, []);
-        const panx: number = doc.GetFieldValue(KeyStore.PanX, NumberField, Number(0));
-        const pany: number = doc.GetFieldValue(KeyStore.PanY, NumberField, Number(0));
-        return (
-
-            <div className="border" style={{
-                    borderStyle: "solid",
-                    borderWidth: "2px"
-                }}>
-                <div className="collectionfreeformview-container" onPointerDown={this.onPointerDown} onWheel={this.onPointerWheel} onContextMenu={(e) => e.preventDefault()} style={{
-                    width: "100%",
-                    height: "calc(100% - 4px)",
-                    overflow: "hidden"
-                }}>
-                    <div className="collectionfreeformview" style={{ transform: `translate(${panx}px, ${pany}px)`, transformOrigin: '50% 50%' }}>
-                        <div className="node-container">
-                            {value.map(doc => {
-                                return (<DocumentView key={doc.Id} dvm={new DocumentViewModel(doc)} />);
-                            })}
-                        </div>
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
diff --git a/src/views/freeformcanvas/FreeFormCanvas.scss b/src/views/freeformcanvas/FreeFormCanvas.scss
deleted file mode 100644
index 884ef90e6..000000000
--- a/src/views/freeformcanvas/FreeFormCanvas.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-.freeformcanvas-container {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
-
-    .freeformcanvas {
-        position: absolute;
-        top: 0;
-        left: 0;
-    }
-}
-
diff --git a/src/views/freeformcanvas/FreeFormCanvas.tsx b/src/views/freeformcanvas/FreeFormCanvas.tsx
deleted file mode 100644
index 9ef5ab8f7..000000000
--- a/src/views/freeformcanvas/FreeFormCanvas.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-import { observer } from "mobx-react";
-import { Key } from "../../fields/Key";
-import { NodeCollectionStore } from "../../stores/NodeCollectionStore";
-import "./FreeFormCanvas.scss";
-import React = require("react");
-import { action } from "mobx";
-import { Document } from "../../fields/Document";
-import {DocumentViewModel} from "../../viewmodels/DocumentViewModel";
-import {DocumentView} from "../nodes/DocumentView";
-import {TextField} from "../../fields/TextField";
-import {ListField} from "../../fields/ListField";
-import {Field} from "../../fields/Field";
-
-interface IProps {
-    store: NodeCollectionStore;
-}
-
-@observer
-export class FreeFormCanvas extends React.Component<IProps> {
-
-    private _isPointerDown: boolean = false;
-
-    constructor(props:IProps) {
-        super(props);
-    }
-
-    @action
-    onPointerDown = (e: React.PointerEvent): void => {
-        e.stopPropagation();
-        if (e.button === 2) {
-            this._isPointerDown = true;
-            document.removeEventListener("pointermove", this.onPointerMove);
-            document.addEventListener("pointermove", this.onPointerMove);
-            document.removeEventListener("pointerup", this.onPointerUp);
-            document.addEventListener("pointerup", this.onPointerUp);
-        }
-    }
-
-    @action
-    onPointerUp = (e: PointerEvent): void => {
-        e.stopPropagation();
-        if (e.button === 2) {
-            this._isPointerDown = false;
-            document.removeEventListener("pointermove", this.onPointerMove);
-            document.removeEventListener("pointerup", this.onPointerUp);
-        }
-
-        // let doc = this.props.store.Docs[0];
-        // let dataField = doc.GetFieldT(KeyStore.Data, TextField);
-        // let data = dataField ? dataField.Data : "";
-        // this.props.store.Docs[0].SetFieldValue(KeyStore.Data, data + " hello", TextField);
-    }
-
-    @action
-    onPointerMove = (e: PointerEvent): void => {
-        e.stopPropagation();
-        if (!this._isPointerDown) {
-            return;
-        }
-        this.props.store.X += e.movementX;
-        this.props.store.Y += e.movementY;
-    }
-
-    @action
-    onPointerWheel = (e: React.WheelEvent): void => {
-        e.stopPropagation();
-
-        let scaleAmount = 1 - (e.deltaY / 1000);
-        this.props.store.Scale *= scaleAmount;
-    }
-
-    render() {
-        let store = this.props.store;
-        return (
-            <div className="freeformcanvas-container" onPointerDown={this.onPointerDown} onWheel={this.onPointerWheel} onContextMenu={(e) => e.preventDefault()}>
-                <div className="freeformcanvas" style={{ transform: store.Transform, transformOrigin: '50% 50%' }}>
-                    <div className="node-container">
-                        {this.props.store.Docs.map(doc => {
-                            return (<DocumentView key={doc.Id} dvm={new DocumentViewModel(doc)} />);
-                        })}
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
diff --git a/src/views/nodes/DocumentView.tsx b/src/views/nodes/DocumentView.tsx
deleted file mode 100644
index f955a8c39..000000000
--- a/src/views/nodes/DocumentView.tsx
+++ /dev/null
@@ -1,134 +0,0 @@
-import { observer } from "mobx-react";
-import React = require("react");
-import { computed } from "mobx";
-import { KeyStore, Key } from "../../fields/Key";
-import { NumberField } from "../../fields/NumberField";
-import { TextField } from "../../fields/TextField";
-import { DocumentViewModel } from "../../viewmodels/DocumentViewModel";
-import { ListField } from "../../fields/ListField";
-import { FieldTextBox } from "../nodes/FieldTextBox"
-import { FreeFormCanvas } from "../freeformcanvas/FreeFormCanvas"
-import { CollectionFreeFormView } from "../freeformcanvas/CollectionFreeFormView"
-import "./NodeView.scss"
-const JsxParser = require('react-jsx-parser').default;//TODO Why does this need to be imported like this?
-
-interface IProps {
-    dvm: DocumentViewModel;
-}
-
-@observer
-export class DocumentView extends React.Component<IProps> {
-    @computed
-    get x(): number {
-        return this.props.dvm.Doc.GetFieldValue(KeyStore.X, NumberField, Number(0));
-    }
-
-    @computed
-    get y(): number {
-        return this.props.dvm.Doc.GetFieldValue(KeyStore.Y, NumberField, Number(0));
-    }
-
-    set x(x: number) {
-        this.props.dvm.Doc.SetFieldValue(KeyStore.X, x, NumberField)
-    }
-
-    set y(y: number) {
-        this.props.dvm.Doc.SetFieldValue(KeyStore.Y, y, NumberField)
-    }
-
-    @computed
-    get transform(): string {
-        return `translate(${this.x}px, ${this.y}px)`;
-    }
-
-    @computed
-    get width(): number {
-        return this.props.dvm.Doc.GetFieldValue(KeyStore.Width, NumberField, Number(0));
-    }
-
-    @computed
-    get height(): number {
-        return this.props.dvm.Doc.GetFieldValue(KeyStore.Height, NumberField, Number(0));
-    }
-
-    @computed
-    get layout(): string {
-        return this.props.dvm.Doc.GetFieldValue(KeyStore.Layout, TextField, String("<p>Error loading layout data</p>"));
-    }
-
-    @computed
-    get layoutKeys(): Key[] {
-        return this.props.dvm.Doc.GetFieldValue(KeyStore.LayoutKeys, ListField, new Array<Key>());
-    }
-
-    @computed
-    get layoutFields(): Key[] {
-        return this.props.dvm.Doc.GetFieldValue(KeyStore.LayoutFields, ListField, new Array<Key>());
-    }
-
-    private _isPointerDown = false;
-
-    onPointerDown = (e: React.PointerEvent): void => {
-        e.stopPropagation();
-        if (e.button === 2) {
-            this._isPointerDown = true;
-            document.removeEventListener("pointermove", this.onPointerMove);
-            document.addEventListener("pointermove", this.onPointerMove);
-            document.removeEventListener("pointerup", this.onPointerUp);
-            document.addEventListener("pointerup", this.onPointerUp);
-        }
-    }
-
-    onPointerUp = (e: PointerEvent): void => {
-        e.stopPropagation();
-        if (e.button === 2) {
-            e.preventDefault();
-            this._isPointerDown = false;
-            document.removeEventListener("pointermove", this.onPointerMove);
-            document.removeEventListener("pointerup", this.onPointerUp);
-        }
-    }
-
-    onPointerMove = (e: PointerEvent): void => {
-        e.stopPropagation();
-        e.preventDefault();
-        if (!this._isPointerDown) {
-            return;
-        }
-        this.x += e.movementX;
-        this.y += e.movementY;
-    }
-
-    render() {
-        let doc = this.props.dvm.Doc;
-        let bindings: any = {
-            doc: doc
-        };
-        for (const key of this.layoutKeys) {
-            bindings[key.Name + "Key"] = key;
-        }
-        for (const key of this.layoutFields) {
-            let field = doc.GetField(key);
-            if (field) {
-                bindings[key.Name] = field.GetValue();
-            }
-        }
-        return (
-            <div className="node" style={{
-                transform: this.transform,
-                width: this.width,
-                height: this.height
-            }} onPointerDown={this.onPointerDown} onContextMenu={
-                (e) => {
-                    e.preventDefault()
-                }}>
-                <JsxParser
-                    components={{ FieldTextBox, FreeFormCanvas, CollectionFreeFormView }}
-                    bindings={bindings}
-                    jsx={this.layout}
-                />
-            </div>
-        );
-    }
-
-}
\ No newline at end of file
diff --git a/src/views/nodes/FieldTextBox.tsx b/src/views/nodes/FieldTextBox.tsx
deleted file mode 100644
index dbac3906a..000000000
--- a/src/views/nodes/FieldTextBox.tsx
+++ /dev/null
@@ -1,117 +0,0 @@
-import { Key, KeyStore } from "../../fields/Key";
-import { Document } from "../../fields/Document";
-import { observer } from "mobx-react";
-import { TextField } from "../../fields/TextField";
-import React = require("react")
-import { action, observable, reaction, IReactionDisposer } from "mobx";
-
-import {schema} from "prosemirror-schema-basic";
-import {EditorState, Transaction} from "prosemirror-state"
-import {EditorView} from "prosemirror-view"
-import {keymap} from "prosemirror-keymap"
-import {baseKeymap} from "prosemirror-commands"
-import {undo, redo, history} from "prosemirror-history"
-import { Opt } from "../../fields/Field";
-
-interface IProps {
-    fieldKey:Key;
-    doc:Document;
-}
-
-// FieldTextBox: Displays an editable plain text node that maps to a specified Key of a Document
-//
-//  HTML Markup:  <FieldTextBox Doc={Document's ID} FieldKey={Key's name + "Key"}
-// 
-//  In Code, the node's HTML is specified in the document's parameterized structure as:
-//        document.SetField(KeyStore.Layout,  "<FieldTextBox doc={doc} fieldKey={<KEYNAME>Key} />");
-//  and the node's binding to the specified document KEYNAME as:
-//        document.SetField(KeyStore.LayoutKeys, new ListField([KeyStore.<KEYNAME>]));
-//  The Jsx parser at run time will bind:
-//        'fieldKey' property to the Key stored in LayoutKeys
-//    and 'doc' property to the document that is being rendered
-//
-//  When rendered() by React, this extracts the TextController from the Document stored at the 
-//  specified Key and assigns it to an HTML input node.  When changes are made tot his node, 
-//  this will edit the document and assign the new value to that field.
-//
-@observer
-export class FieldTextBox extends React.Component<IProps> {
-    private _ref: React.RefObject<HTMLDivElement>;
-    private _editorView: Opt<EditorView>;
-    private _reactionDisposer: Opt<IReactionDisposer>;
-
-    constructor(props:IProps) {
-        super(props);
-
-        this._ref = React.createRef();
-
-        this.onChange = this.onChange.bind(this);
-    }
-
-    dispatchTransaction = (tx: Transaction) => {
-        if(this._editorView) {
-            const state = this._editorView.state.apply(tx);
-            this._editorView.updateState(state);
-            const {doc, fieldKey} = this.props;
-            doc.SetFieldValue(fieldKey, JSON.stringify(state.toJSON()), TextField);
-        }
-    }
-
-    componentDidMount() {
-        let state:EditorState;
-        const {doc, fieldKey} = this.props;
-        const config = {
-            schema,
-            plugins: [
-                history(),
-                keymap({"Mod-z": undo, "Mod-y": redo}),
-                keymap(baseKeymap)
-            ]
-        };
-
-        let field = doc.GetFieldT(fieldKey, TextField);
-        if(field) {
-            state = EditorState.fromJSON(config, JSON.parse(field.Data));
-        } else {
-            state = EditorState.create(config);
-        }
-        if(this._ref.current) {
-            this._editorView = new EditorView(this._ref.current, {
-                state,
-                dispatchTransaction: this.dispatchTransaction
-            });
-        }
-
-        this._reactionDisposer = reaction(() => {
-            const field = this.props.doc.GetFieldT(this.props.fieldKey, TextField);
-            return field ? field.Data : undefined;
-        }, (field) => {
-            if(field && this._editorView) {
-                this._editorView.updateState(EditorState.fromJSON(config, JSON.parse(field)));
-            }
-        })
-    }
-
-    componentWillUnmount() {
-        if(this._editorView) {
-            this._editorView.destroy();
-        }
-        if(this._reactionDisposer) {
-            this._reactionDisposer();
-        }
-    }
-
-    shouldComponentUpdate() {
-        return false;
-    }
-
-    @action
-    onChange(e: React.ChangeEvent<HTMLInputElement>) {
-        const {fieldKey, doc} = this.props;
-        doc.SetFieldValue(fieldKey, e.target.value, TextField);
-    }
-
-    render() {
-        return (<div ref={this._ref} />)
-    }
-}
\ No newline at end of file
diff --git a/src/views/nodes/NodeView.scss b/src/views/nodes/NodeView.scss
deleted file mode 100644
index a68335f87..000000000
--- a/src/views/nodes/NodeView.scss
+++ /dev/null
@@ -1,31 +0,0 @@
-.node {
-    position: absolute;
-    background: #cdcdcd;
-
-    overflow: hidden;
-
-        
-    &.minimized {
-        width: 30px;
-        height: 30px;
-    }
-
-    .top {
-        background: #232323;
-        height: 20px;
-        cursor: pointer;
-    }
-
-    .content {
-        padding: 20px 20px;
-        height: auto;
-        box-sizing: border-box;
-
-    }
-
-    .scroll-box {
-        overflow-y: scroll;
-        height: calc(100% - 20px);
-    }
-}
-
diff --git a/src/views/nodes/RichTextView.tsx b/src/views/nodes/RichTextView.tsx
deleted file mode 100644
index e69de29bb..000000000
diff --git a/src/views/nodes/TextNodeView.tsx b/src/views/nodes/TextNodeView.tsx
deleted file mode 100644
index 4831e658c..000000000
--- a/src/views/nodes/TextNodeView.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { observer } from "mobx-react";
-import { StaticTextNodeStore } from "../../stores/StaticTextNodeStore";
-import "./NodeView.scss";
-import { TopBar } from "./TopBar";
-import React = require("react");
-
-interface IProps {
-    store: StaticTextNodeStore;
-}
-
-@observer
-export class TextNodeView extends React.Component<IProps> {
-
-    render() {
-        let store = this.props.store;
-        return (
-            <div className="node text-node" style={{ transform: store.Transform }}>
-                <TopBar store={store} />
-                <div className="scroll-box">
-                    <div className="content">
-                        <h3 className="title">{store.Title}</h3>
-                        <p className="paragraph">{store.Text}</p>
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
diff --git a/src/views/nodes/TopBar.tsx b/src/views/nodes/TopBar.tsx
deleted file mode 100644
index bb126e8b5..000000000
--- a/src/views/nodes/TopBar.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import { observer } from "mobx-react";
-import { NodeStore } from "../../stores/NodeStore";
-import "./NodeView.scss";
-import React = require("react");
-
-interface IProps {
-    store: NodeStore;
-}
-
-@observer
-export class TopBar extends React.Component<IProps> {
-
-    private _isPointerDown = false;
-
-    onPointerDown = (e: React.PointerEvent): void => {
-        e.stopPropagation();
-        e.preventDefault();
-        this._isPointerDown = true;
-        document.removeEventListener("pointermove", this.onPointerMove);
-        document.addEventListener("pointermove", this.onPointerMove);
-        document.removeEventListener("pointerup", this.onPointerUp);
-        document.addEventListener("pointerup", this.onPointerUp);
-    }
-
-    onPointerUp = (e: PointerEvent): void => {
-        e.stopPropagation();
-        e.preventDefault();
-        this._isPointerDown = false;
-        document.removeEventListener("pointermove", this.onPointerMove);
-        document.removeEventListener("pointerup", this.onPointerUp);
-    }
-
-    onPointerMove = (e: PointerEvent): void => {
-        e.stopPropagation();
-        e.preventDefault();
-        if (!this._isPointerDown) {
-            return;
-        }
-        this.props.store.X += e.movementX;
-        this.props.store.Y += e.movementY;
-    }
-
-    render() {
-        return <div className="top" onPointerDown={this.onPointerDown}></div>
-    }
-}
diff --git a/src/views/nodes/VideoNodeView.scss b/src/views/nodes/VideoNodeView.scss
deleted file mode 100644
index f412c3519..000000000
--- a/src/views/nodes/VideoNodeView.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-.node {
-    video {
-        width: 100%;
-    }
-}
\ No newline at end of file
diff --git a/src/views/nodes/VideoNodeView.tsx b/src/views/nodes/VideoNodeView.tsx
deleted file mode 100644
index 0a7b3d174..000000000
--- a/src/views/nodes/VideoNodeView.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { observer } from "mobx-react";
-import { VideoNodeStore } from "../../stores/VideoNodeStore";
-import "./NodeView.scss";
-import { TopBar } from "./TopBar";
-import "./VideoNodeView.scss";
-import React = require("react");
-
-interface IProps {
-    store: VideoNodeStore;
-}
-
-@observer
-export class VideoNodeView extends React.Component<IProps> {
-
-    render() {
-        let store = this.props.store;
-        return (
-            <div className="node text-node" style={{ transform: store.Transform }}>
-                <TopBar store={store} />
-                <div className="scroll-box">
-                    <div className="content">
-                        <h3 className="title">{store.Title}</h3>
-                        <video src={store.Url} controls />
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From 281f6268238c4f9f1640899ce258535ad4fe2401 Mon Sep 17 00:00:00 2001
From: madelinegr <mgriswold99@gmail.com>
Date: Mon, 18 Feb 2019 18:01:47 -0500
Subject: tried to get around cors with crossorigin.me

---
 src/client/views/Main.tsx         | 2 +-
 src/client/views/nodes/WebBox.tsx | 2 +-
 src/fields/WebField.ts            | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

(limited to 'src/fields')

diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx
index 3e5118379..f310be950 100644
--- a/src/client/views/Main.tsx
+++ b/src/client/views/Main.tsx
@@ -79,7 +79,7 @@ document.addEventListener("pointerdown", action(function (e: PointerEvent) {
     // mainNodes.Data.push(doc2);
     mainNodes.Data.push(doc6);
 
-    let doc9 = Documents.WebDocument("https://cs.brown.edu/", {
+    let doc9 = Documents.WebDocument("https://crossorigin.me/https://google.com", {
         x: 450, y: 100, title: "cat 1", width: 606, height: 386, nativeWidth: 606, nativeHeight: 386
     });
     mainNodes.Data.push(doc9);
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index f50f8c60e..b9d0853b9 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -62,7 +62,7 @@ export class WebBox extends React.Component<FieldViewProps> {
     render() {
         let field = this.props.doc.Get(this.props.fieldKey);
         let path = field == FieldWaiting ? "https://image.flaticon.com/icons/svg/66/66163.svg" :
-            field instanceof WebField ? field.Data.href : "https://cs.brown.edu/";
+            field instanceof WebField ? field.Data.href : "https://crossorigin.me/" + "https://cs.brown.edu";
         let nativeWidth = this.props.doc.GetNumber(KeyStore.NativeWidth, 1);
 
         return (
diff --git a/src/fields/WebField.ts b/src/fields/WebField.ts
index 88e6130e0..cd3519128 100644
--- a/src/fields/WebField.ts
+++ b/src/fields/WebField.ts
@@ -3,7 +3,7 @@ import { Field } from "./Field";
 
 export class WebField extends BasicField<URL> {
     constructor(data: URL | undefined = undefined) {
-        super(data == undefined ? new URL("https://cs.brown.edu/") : data);
+        super(data == undefined ? new URL("https://crossorigin.me/" + "https://cs.brown.edu/") : data);
     }
 
     toString(): string {
-- 
cgit v1.2.3-70-g09d2


From efe5d9515c88f6e0963ae1c04545b7bbbd8beb55 Mon Sep 17 00:00:00 2001
From: madelinegr <mgriswold99@gmail.com>
Date: Mon, 25 Feb 2019 17:51:40 -0500
Subject: fixed some of bugs caused by pulling from master

---
 src/client/documents/Documents.ts    | 27 ---------------------------
 src/client/views/nodes/FieldView.tsx |  5 -----
 src/client/views/nodes/WebBox.tsx    |  8 ++++----
 src/fields/WebField.ts               | 15 ++++++++++++---
 src/server/Message.ts                |  2 +-
 5 files changed, 17 insertions(+), 40 deletions(-)

(limited to 'src/fields')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 398c6f1a2..5c73c6b87 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -7,17 +7,12 @@ import { ListField } from "../../fields/ListField";
 import { FormattedTextBox } from "../views/nodes/FormattedTextBox";
 import { ImageField } from "../../fields/ImageField";
 import { ImageBox } from "../views/nodes/ImageBox";
-<<<<<<< HEAD
 import { WebField } from "../../fields/WebField";
 import { WebBox } from "../views/nodes/WebBox";
 import { CollectionFreeFormView } from "../views/collections/CollectionFreeFormView";
 import { FieldId } from "../../fields/Field";
-=======
 import { CollectionView, CollectionViewType } from "../views/collections/CollectionView";
 import { FieldView } from "../views/nodes/FieldView";
-import { HtmlField } from "../../fields/HtmlField";
-import { WebView } from "../views/nodes/WebView";
->>>>>>> bb418216efa9cc2e191b970e4cbe5080f4fd2b87
 
 export interface DocumentOptions {
     x?: number;
@@ -88,28 +83,6 @@ export namespace Documents {
         return doc;
     }
 
-    let htmlProto: Document;
-    const htmlProtoId = "htmlProto";
-    function GetHtmlPrototype(): Document {
-        if (!htmlProto) {
-            htmlProto = new Document(htmlProtoId);
-            htmlProto.Set(KeyStore.X, new NumberField(0));
-            htmlProto.Set(KeyStore.Y, new NumberField(0));
-            htmlProto.Set(KeyStore.Width, new NumberField(300));
-            htmlProto.Set(KeyStore.Height, new NumberField(150));
-            htmlProto.Set(KeyStore.Layout, new TextField(WebView.LayoutString()));
-            htmlProto.Set(KeyStore.LayoutKeys, new ListField([KeyStore.Data]));
-        }
-        return htmlProto;
-    }
-
-    export function HtmlDocument(html: string, options: DocumentOptions = {}): Document {
-        let doc = GetHtmlPrototype().MakeDelegate();
-        setupOptions(doc, options);
-        doc.Set(KeyStore.Data, new HtmlField(html));
-        return doc;
-    }
-
     let imageProto: Document;
     const imageProtoId = "imageProto";
     function GetImagePrototype(): Document {
diff --git a/src/client/views/nodes/FieldView.tsx b/src/client/views/nodes/FieldView.tsx
index 368ad049d..978cfe196 100644
--- a/src/client/views/nodes/FieldView.tsx
+++ b/src/client/views/nodes/FieldView.tsx
@@ -11,13 +11,10 @@ import { WebField } from "../../../fields/WebField";
 import { Key } from "../../../fields/Key";
 import { FormattedTextBox } from "./FormattedTextBox";
 import { ImageBox } from "./ImageBox";
-<<<<<<< HEAD
 import { WebBox } from "./WebBox";
 import { DocumentView } from "./DocumentView";
-=======
 import { HtmlField } from "../../../fields/HtmlField";
 import { WebView } from "./WebView";
->>>>>>> bb418216efa9cc2e191b970e4cbe5080f4fd2b87
 
 //
 // these properties get assigned through the render() method of the DocumentView when it creates this node.
@@ -61,8 +58,6 @@ export class FieldView extends React.Component<FieldViewProps> {
         }
         else if (field instanceof NumberField) {
             return <p>{field.Data}</p>
-        } else if (field instanceof HtmlField) {
-            return <WebView {...this.props} />
         } else if (field != FieldWaiting) {
             return <p>{field.GetValue}</p>
         } else
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index b9d0853b9..4f774bae2 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -9,12 +9,12 @@ import { CollectionFreeFormDocumentView } from './CollectionFreeFormDocumentView
 import { FieldWaiting } from '../../../fields/Field';
 import { observer } from "mobx-react"
 import { observable, action, spy } from 'mobx';
-import { KeyStore } from '../../../fields/Key';
+import { KeyStore } from '../../../fields/KeyStore';
 
 @observer
 export class WebBox extends React.Component<FieldViewProps> {
 
-    public static LayoutString() { return FieldView.LayoutString("WebBox"); }
+    public static LayoutString() { return FieldView.LayoutString(WebBox); }
     private _ref: React.RefObject<HTMLDivElement>;
     private _downX: number = 0;
     private _downY: number = 0;
@@ -38,8 +38,7 @@ export class WebBox extends React.Component<FieldViewProps> {
 
     onPointerDown = (e: React.PointerEvent): void => {
         if (Date.now() - this._lastTap < 300) {
-            if (e.buttons === 1 && this.props.DocumentViewForField instanceof CollectionFreeFormDocumentView &&
-                SelectionManager.IsSelected(this.props.DocumentViewForField)) {
+            if (e.buttons === 1 && this.props.isSelected()) {
                 e.stopPropagation();
                 this._downX = e.clientX;
                 this._downY = e.clientY;
@@ -50,6 +49,7 @@ export class WebBox extends React.Component<FieldViewProps> {
             this._lastTap = Date.now();
         }
     }
+
     @action
     onPointerUp = (e: PointerEvent): void => {
         document.removeEventListener("pointerup", this.onPointerUp);
diff --git a/src/fields/WebField.ts b/src/fields/WebField.ts
index cd3519128..8f945d686 100644
--- a/src/fields/WebField.ts
+++ b/src/fields/WebField.ts
@@ -1,9 +1,10 @@
 import { BasicField } from "./BasicField";
-import { Field } from "./Field";
+import { Field, FieldId } from "./Field";
+import { Types } from "../server/Message";
 
 export class WebField extends BasicField<URL> {
-    constructor(data: URL | undefined = undefined) {
-        super(data == undefined ? new URL("https://crossorigin.me/" + "https://cs.brown.edu/") : data);
+    constructor(data: URL | undefined = undefined, id?: FieldId, save: boolean = true) {
+        super(data == undefined ? new URL("https://crossorigin.me/" + "https://cs.brown.edu/") : data, save, id);
     }
 
     toString(): string {
@@ -18,4 +19,12 @@ export class WebField extends BasicField<URL> {
         return new WebField(this.Data);
     }
 
+    ToJson(): { type: Types, data: URL, _id: string } {
+        return {
+            type: Types.Web,
+            data: this.Data,
+            _id: this.Id
+        }
+    }
+
 }
\ No newline at end of file
diff --git a/src/server/Message.ts b/src/server/Message.ts
index 80fc9a80d..148e6e723 100644
--- a/src/server/Message.ts
+++ b/src/server/Message.ts
@@ -45,7 +45,7 @@ export class GetFieldArgs {
 }
 
 export enum Types {
-    Number, List, Key, Image, Document, Text, RichText, DocumentReference, Html
+    Number, List, Key, Image, Web, Document, Text, RichText, DocumentReference, Html
 }
 
 export class DocumentTransfer implements Transferable {
-- 
cgit v1.2.3-70-g09d2


From 2d4e1ac97f87c3e5a7be58291542829d68a19669 Mon Sep 17 00:00:00 2001
From: Bob Zeleznik <zzzman@gmail.com>
Date: Tue, 26 Feb 2019 19:35:26 -0500
Subject: simplified WebBox.

---
 src/client/views/nodes/WebBox.tsx | 50 +++------------------------------------
 src/fields/Document.ts            |  5 ++++
 2 files changed, 8 insertions(+), 47 deletions(-)

(limited to 'src/fields')

diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index 0a198f059..2ca8d49ce 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -4,63 +4,19 @@ import { WebField } from '../../../fields/WebField';
 import { FieldViewProps, FieldView } from './FieldView';
 import { FieldWaiting } from '../../../fields/Field';
 import { observer } from "mobx-react"
-import { observable, action, spy, computed } from 'mobx';
+import { computed } from 'mobx';
 import { KeyStore } from '../../../fields/KeyStore';
-import { HtmlField } from "../../../fields/HtmlField";
 
 @observer
 export class WebBox extends React.Component<FieldViewProps> {
 
     public static LayoutString() { return FieldView.LayoutString(WebBox); }
-    private _ref: React.RefObject<HTMLDivElement>;
-    private _downX: number = 0;
-    private _downY: number = 0;
-    private _lastTap: number = 0;
-    @observable private _isOpen: boolean = false;
 
     constructor(props: FieldViewProps) {
         super(props);
-
-        this._ref = React.createRef();
-        this.state = {
-            isOpen: false,
-        };
-    }
-
-    componentDidMount() {
-    }
-
-    componentWillUnmount() {
-    }
-
-    onPointerDown = (e: React.PointerEvent): void => {
-        if (Date.now() - this._lastTap < 300) {
-            if (e.buttons === 1 && this.props.isSelected()) {
-                e.stopPropagation();
-                this._downX = e.clientX;
-                this._downY = e.clientY;
-                document.removeEventListener("pointerup", this.onPointerUp);
-                document.addEventListener("pointerup", this.onPointerUp);
-            }
-        } else {
-            this._lastTap = Date.now();
-        }
-    }
-
-    @action
-    onPointerUp = (e: PointerEvent): void => {
-        document.removeEventListener("pointerup", this.onPointerUp);
-        if (Math.abs(e.clientX - this._downX) < 2 && Math.abs(e.clientY - this._downY) < 2) {
-            this._isOpen = true;
-        }
-        e.stopPropagation();
-    }
-
-    @computed
-    get html(): string {
-        return this.props.doc.GetData(KeyStore.Data, HtmlField, "" as string);
     }
 
+    @computed get html(): string { return this.props.doc.GetHtml(KeyStore.Data, ""); }
 
     render() {
         let field = this.props.doc.Get(this.props.fieldKey);
@@ -75,7 +31,7 @@ export class WebBox extends React.Component<FieldViewProps> {
             </div>;
 
         return (
-            <div className="webBox-cont" onPointerDown={this.onPointerDown} ref={this._ref}   >
+            <div className="webBox-cont"  >
                 {content}
             </div>)
     }
diff --git a/src/fields/Document.ts b/src/fields/Document.ts
index 6193ea56c..5b91de6ed 100644
--- a/src/fields/Document.ts
+++ b/src/fields/Document.ts
@@ -8,6 +8,7 @@ import { ListField } from "./ListField";
 import { Server } from "../client/Server";
 import { Types } from "../server/Message";
 import { UndoManager } from "../client/util/UndoManager";
+import { HtmlField } from "./HtmlField";
 
 export class Document extends Field {
     public fields: ObservableMap<string, { key: Key, field: Field }> = new ObservableMap();
@@ -125,6 +126,10 @@ export class Document extends Field {
         return vval;
     }
 
+    GetHtml(key: Key, defaultVal: string): string {
+        return this.GetData(key, HtmlField, defaultVal);
+    }
+
     GetNumber(key: Key, defaultVal: number): number {
         return this.GetData(key, NumberField, defaultVal);
     }
-- 
cgit v1.2.3-70-g09d2


From 23387df535e9ab87a08196aab19de6f937ae9bba Mon Sep 17 00:00:00 2001
From: madelinegr <laura_wilson@brown.edu>
Date: Thu, 28 Feb 2019 00:20:14 -0500
Subject: finished kvp

---
 package-lock.json                                  |  21 +--
 package.json                                       |   2 +-
 src/client/documents/Documents.ts                  |  16 ++
 .../views/collections/CollectionFreeFormView.tsx   |   7 -
 src/client/views/nodes/DocumentView.tsx            |  14 +-
 src/client/views/nodes/FieldView.tsx               |   2 +
 src/client/views/nodes/KeyValuePair.tsx            |  68 ++++++++
 src/client/views/nodes/KeyValuePane.tsx            | 176 +++++++++------------
 src/fields/KVPField                                |   0
 src/fields/KVPField.ts                             |  30 ++++
 10 files changed, 198 insertions(+), 138 deletions(-)
 create mode 100644 src/client/views/nodes/KeyValuePair.tsx
 create mode 100644 src/fields/KVPField
 create mode 100644 src/fields/KVPField.ts

(limited to 'src/fields')

diff --git a/package-lock.json b/package-lock.json
index d03e78a2d..75e6cae17 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3285,11 +3285,6 @@
         }
       }
     },
-    "font-awesome": {
-      "version": "4.7.0",
-      "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz",
-      "integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM="
-    },
     "for-in": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
@@ -3399,13 +3394,11 @@
         },
         "balanced-match": {
           "version": "1.0.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
-          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -3422,8 +3415,7 @@
         },
         "concat-map": {
           "version": "0.0.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "console-control-strings": {
           "version": "1.1.0",
@@ -3552,7 +3544,6 @@
         "minimatch": {
           "version": "3.0.4",
           "bundled": true,
-          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -10434,14 +10425,6 @@
         "scheduler": "^0.12.0"
       }
     },
-    "react-fontawesome": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/react-fontawesome/-/react-fontawesome-1.6.1.tgz",
-      "integrity": "sha1-7dzhfn3HMaoJ/UoYZoimF5OhbFw=",
-      "requires": {
-        "prop-types": "^15.5.6"
-      }
-    },
     "react-golden-layout": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/react-golden-layout/-/react-golden-layout-1.0.6.tgz",
diff --git a/package.json b/package.json
index 8568a7bef..ae7a7b25c 100644
--- a/package.json
+++ b/package.json
@@ -116,4 +116,4 @@
     "url-loader": "^1.1.2",
     "uuid": "^3.3.2"
   }
-}
\ No newline at end of file
+}
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index ba13cc31b..41f1c9b3f 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -13,6 +13,8 @@ import { CollectionView, CollectionViewType } from "../views/collections/Collect
 import { HtmlField } from "../../fields/HtmlField";
 import { Key } from "../../fields/Key"
 import { Field } from "../../fields/Field";
+import { KeyValuePane } from "../views/nodes/KeyValuePane"
+import { KVPField } from "../../fields/KVPField";
 
 export interface DocumentOptions {
     x?: number;
@@ -35,10 +37,12 @@ export namespace Documents {
     let imageProto: Document;
     let webProto: Document;
     let collProto: Document;
+    let kvpProto: Document;
     const textProtoId = "textProto";
     const imageProtoId = "imageProto";
     const webProtoId = "webProto";
     const collProtoId = "collectionProto";
+    const kvpProtoId = "kvpProto";
 
     export function initProtos(mainDocId: string, callback: (mainDoc?: Document) => void) {
         Server.GetFields([collProtoId, textProtoId, imageProtoId, mainDocId], (fields) => {
@@ -46,6 +50,7 @@ export namespace Documents {
             imageProto = fields[imageProtoId] as Document;
             textProto = fields[textProtoId] as Document;
             webProto = fields[webProtoId] as Document;
+            kvpProto = fields[kvpProtoId] as Document;
             callback(fields[mainDocId] as Document)
         });
     }
@@ -98,6 +103,12 @@ export namespace Documents {
                 { panx: 0, pany: 0, scale: 1, layoutKeys: [KeyStore.Data] });
     }
 
+    function GetKVPPrototype(): Document {
+        return kvpProto ? kvpProto :
+            kvpProto = setupPrototypeOptions(kvpProtoId, "KVP_PROTO", KeyValuePane.LayoutString(),
+                { x: 0, y: 0, width: 300, height: 150, layoutKeys: [KeyStore.Data] })
+    }
+
     export function ImageDocument(url: string, options: DocumentOptions = {}) {
         let doc = SetInstanceOptions(GetImagePrototype(), { ...options, layoutKeys: [KeyStore.Data, KeyStore.Annotations, KeyStore.Caption] },
             new URL(url), ImageField);
@@ -124,6 +135,11 @@ export namespace Documents {
     export function DockDocument(config: string, options: DocumentOptions, id?: string) {
         return SetInstanceOptions(GetCollectionPrototype(), { ...options, viewType: CollectionViewType.Docking }, config, TextField, id)
     }
+    export function KVPDocument(document: Document, options: DocumentOptions = {}, id?: string) {
+        var deleg = GetKVPPrototype().MakeDelegate(id);
+        deleg.Set(KeyStore.Data, document);
+        return assignOptions(deleg, options);
+    }
 
 
 
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index 29d254e56..137bcf706 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -194,12 +194,6 @@ export class CollectionFreeFormView extends CollectionViewBase {
         });
     }
 
-    @action
-    addKVP(doc: Document) {
-        let fields = doc.fields;
-        //TODO: return kvpg
-    }
-
     @computed get backgroundLayout(): string | undefined {
         let field = this.props.Document.GetT(KeyStore.BackgroundLayout, TextField);
         if (field && field !== "<Waiting>") {
@@ -266,7 +260,6 @@ export class CollectionFreeFormView extends CollectionViewBase {
     }
 
     render() {
-        //TODO: put KVP stuff in this function
 
         //determines whether preview text cursor should be visible (ie when user taps this collection it should)
         let cursor = null;
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index d1706c80c..23cfa6df3 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -20,13 +20,9 @@ import { KeyValuePane } from "../nodes/KeyValuePane"
 import { WebBox } from "../nodes/WebBox";
 import "./DocumentView.scss";
 import React = require("react");
+import { CollectionViewProps } from "../collections/CollectionViewBase";
 const JsxParser = require('react-jsx-parser').default;//TODO Why does this need to be imported like this?
 
-/*
-    if containingcollectionview is CollectionFreeformView:
-        (ContainingCollectionView as CollectionFreeformView)?.addKVP
-*/
-
 
 export interface DocumentViewProps {
     ContainingCollectionView: Opt<CollectionView>;
@@ -161,8 +157,8 @@ export class DocumentView extends React.Component<DocumentViewProps> {
     }
 
     fieldsClicked = (e: React.MouseEvent): void => {
-        if (this.props.ContainingCollectionView) {
-            (this.props.ContainingCollectionView as unknown as CollectionFreeFormView).addKVP(this.props.Document);
+        if (this.props.AddDocument) {
+            this.props.AddDocument(Documents.KVPDocument(this.props.Document));
         }
     }
     fullScreenClicked = (e: React.MouseEvent): void => {
@@ -190,7 +186,7 @@ export class DocumentView extends React.Component<DocumentViewProps> {
         e.preventDefault()
 
         ContextMenu.Instance.addItem({ description: "Full Screen", event: this.fullScreenClicked })
-        ContextMenu.Instance.addItem({ description: "Fields", event: () => this.fieldsClicked })
+        ContextMenu.Instance.addItem({ description: "Fields", event: this.fieldsClicked })
         ContextMenu.Instance.addItem({ description: "Open Right", event: () => CollectionDockingView.Instance.AddRightSplit(this.props.Document) })
         ContextMenu.Instance.addItem({ description: "Freeform", event: () => this.props.Document.SetNumber(KeyStore.ViewType, CollectionViewType.Freeform) })
         ContextMenu.Instance.addItem({ description: "Schema", event: () => this.props.Document.SetNumber(KeyStore.ViewType, CollectionViewType.Schema) })
@@ -209,7 +205,7 @@ export class DocumentView extends React.Component<DocumentViewProps> {
 
     @computed get mainContent() {
         return <JsxParser
-            components={{ FormattedTextBox, ImageBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView, CollectionView, WebBox }}
+            components={{ FormattedTextBox, ImageBox, CollectionFreeFormView, CollectionDockingView, CollectionSchemaView, CollectionView, WebBox, KeyValuePane }}
             bindings={this._documentBindings}
             jsx={this.layout}
             showWarnings={true}
diff --git a/src/client/views/nodes/FieldView.tsx b/src/client/views/nodes/FieldView.tsx
index f372258f8..056f834d1 100644
--- a/src/client/views/nodes/FieldView.tsx
+++ b/src/client/views/nodes/FieldView.tsx
@@ -12,6 +12,8 @@ import { Key } from "../../../fields/Key";
 import { FormattedTextBox } from "./FormattedTextBox";
 import { ImageBox } from "./ImageBox";
 import { WebBox } from "./WebBox";
+import { KVPField } from "../../../fields/KVPField";
+import { KeyValuePane } from "./KeyValuePane";
 
 //
 // these properties get assigned through the render() method of the DocumentView when it creates this node.
diff --git a/src/client/views/nodes/KeyValuePair.tsx b/src/client/views/nodes/KeyValuePair.tsx
new file mode 100644
index 000000000..bc407f137
--- /dev/null
+++ b/src/client/views/nodes/KeyValuePair.tsx
@@ -0,0 +1,68 @@
+import Lightbox from 'react-image-lightbox';
+import 'react-image-lightbox/style.css'; // This only needs to be imported once in your app
+import "./KeyValuePane.scss";
+import React = require("react")
+import { FieldViewProps, FieldView } from './FieldView';
+import { FieldWaiting, Opt, Field } from '../../../fields/Field';
+import { observer } from "mobx-react"
+import { observable, action, IReactionDisposer, reaction, ObservableMap } from 'mobx';
+import { KeyStore } from '../../../fields/KeyStore';
+import { RichTextField } from "../../../fields/RichTextField";
+import { element } from 'prop-types';
+import { props } from 'bluebird';
+import { EditorView } from 'prosemirror-view';
+import { Transaction, EditorState } from 'prosemirror-state';
+import { schema } from 'prosemirror-schema-basic';
+import { keymap } from 'prosemirror-keymap';
+import { undo, redo } from 'prosemirror-history';
+import { baseKeymap } from 'prosemirror-commands';
+import { KVPField } from '../../../fields/KVPField';
+import { Document } from '../../../fields/Document';
+import { Key } from '../../../fields/Key';
+import { JSXElement } from 'babel-types';
+import { Server } from "../../Server"
+
+// Represents one row in a key value plane
+
+export interface KeyValuePairProps {
+    fieldId: string;
+    doc: Document;
+}
+@observer
+export class KeyValuePair extends React.Component<KeyValuePairProps> {
+
+    @observable
+    private key: Opt<Key>
+
+    constructor(props: KeyValuePairProps) {
+        super(props);
+        Server.GetField(this.props.fieldId,
+            action((field: Opt<Field>) => {
+                if (field) {
+                    this.key = field as Key;
+                }
+            }));
+
+    }
+
+
+
+    render() {
+        if (!this.key) {
+            return <tr><td>error</td><td></td></tr>
+
+        }
+        let props: FieldViewProps = {
+            doc: this.props.doc,
+            fieldKey: this.key,
+            isSelected: () => false,
+            select: () => { },
+            isTopMost: false,
+            bindings: {},
+            selectOnLoad: false,
+        }
+        return (
+            <tr><td>{this.key.Name}</td><td><FieldView {...props} /></td></tr>
+        )
+    }
+}
\ No newline at end of file
diff --git a/src/client/views/nodes/KeyValuePane.tsx b/src/client/views/nodes/KeyValuePane.tsx
index 26d5ed9fd..90f5b653c 100644
--- a/src/client/views/nodes/KeyValuePane.tsx
+++ b/src/client/views/nodes/KeyValuePane.tsx
@@ -4,121 +4,93 @@ import 'react-image-lightbox/style.css'; // This only needs to be imported once
 import "./KeyValuePane.scss";
 import React = require("react")
 import { FieldViewProps, FieldView } from './FieldView';
-import { FieldWaiting } from '../../../fields/Field';
+import { FieldWaiting, Opt, Field } from '../../../fields/Field';
 import { observer } from "mobx-react"
-import { observable, action } from 'mobx';
+import { observable, action, IReactionDisposer, reaction, ObservableMap } from 'mobx';
 import { KeyStore } from '../../../fields/KeyStore';
+import { RichTextField } from "../../../fields/RichTextField";
 import { element } from 'prop-types';
 import { props } from 'bluebird';
+import { EditorView } from 'prosemirror-view';
+import { Transaction, EditorState } from 'prosemirror-state';
+import { schema } from 'prosemirror-schema-basic';
+import { keymap } from 'prosemirror-keymap';
+import { undo, redo } from 'prosemirror-history';
+import { baseKeymap } from 'prosemirror-commands';
+import { KVPField } from '../../../fields/KVPField';
+import { Document } from '../../../fields/Document';
+import { Key } from '../../../fields/Key';
+import { JSXElement } from 'babel-types';
+import { KeyValuePair } from "./KeyValuePair"
 
 @observer
-export class KeyValuePane extends React.Component/*<FieldViewProps>*/ {
+export class KeyValuePane extends React.Component<FieldViewProps> {
 
-    public static LayoutString() { return FieldView.LayoutString(KeyValuePane) }
-    //private _ref: React.RefObject<HTMLDivElement>;
-    // private _downX: number = 0;
-    // private _downY: number = 0;
-    // private _lastTap: number = 0;
-    // @observable private _photoIndex: number = 0;
-    // @observable private _isOpen: boolean = false;
+    public static LayoutString(fieldStr: string = "DataKey") { return FieldView.LayoutString(KeyValuePane, fieldStr) }
+    private _ref: React.RefObject<HTMLDivElement>;
+    private _editorView: Opt<EditorView>;
+    private _reactionDisposer: Opt<IReactionDisposer>;
 
-    constructor() {
+
+    constructor(props: FieldViewProps) {
         super(props);
+
+        this._ref = React.createRef();
+    }
+
+
+
+    shouldComponentUpdate() {
+        return false;
+    }
+
+
+    onPointerDown = (e: React.PointerEvent): void => {
+        if (e.buttons === 1 && this.props.isSelected()) {
+            e.stopPropagation();
+        }
+    }
+    onPointerWheel = (e: React.WheelEvent): void => {
+        e.stopPropagation();
+    }
+
+    createTable = () => {
+        let table: Array<JSX.Element> = []
+        let ret = "waiting"
+        let doc = this.props.doc.GetT(KeyStore.Data, Document);
+        if (!doc || doc == "<Waiting>") {
+            return <tr><td>Loading...</td></tr>
+        }
+        let realDoc = doc;
+
+        let ids: { [key: string]: string } = {};
+        let protos = doc.GetAllPrototypes();
+        for (const proto of protos) {
+            proto._proxies.forEach((val, key) => {
+                if (!(key in ids)) {
+                    ids[key] = key;
+                }
+            })
+        }
+
+        let rows: JSX.Element[] = [];
+        for (let key in ids) {
+            rows.push(<KeyValuePair doc={realDoc} fieldId={key} />)
+        }
+        return rows;
     }
-    // constructor(props: FieldViewProps) {
-    //     super(props);
-
-    //     //     this._ref = React.createRef();
-    //     //     this._imgRef = React.createRef();
-    //     //     this.state = {
-    //     //         photoIndex: 0,
-    //     //         isOpen: false,
-    //     //     };
-    // }
-
-    // @action
-    // onLoad = (target: any) => {
-    //     var h = this._imgRef.current!.naturalHeight;
-    //     var w = this._imgRef.current!.naturalWidth;
-    //     this.props.doc.SetNumber(KeyStore.NativeHeight, this.props.doc.GetNumber(KeyStore.NativeWidth, 0) * h / w)
-    // }
-
-    // componentDidMount() {
-    // }
-
-    // componentWillUnmount() {
-    // }
-
-    // onPointerDown = (e: React.PointerEvent): void => {
-    //     if (Date.now() - this._lastTap < 300) {
-    //         if (e.buttons === 1 && this.props.isSelected()) {
-    //             e.stopPropagation();
-    //             this._downX = e.clientX;
-    //             this._downY = e.clientY;
-    //             document.removeEventListener("pointerup", this.onPointerUp);
-    //             document.addEventListener("pointerup", this.onPointerUp);
-    //         }
-    //     } else {
-    //         this._lastTap = Date.now();
-    //     }
-    // }
-    // @action
-    // onPointerUp = (e: PointerEvent): void => {
-    //     document.removeEventListener("pointerup", this.onPointerUp);
-    //     if (Math.abs(e.clientX - this._downX) < 2 && Math.abs(e.clientY - this._downY) < 2) {
-    //         this._isOpen = true;
-    //     }
-    //     e.stopPropagation();
-    // }
-
-    // lightbox = (path: string) => {
-    //     const images = [path, "http://www.cs.brown.edu/~bcz/face.gif"];
-    //     if (this._isOpen && this.props.isSelected()) {
-    //         return (<Lightbox
-    //             mainSrc={images[this._photoIndex]}
-    //             nextSrc={images[(this._photoIndex + 1) % images.length]}
-    //             prevSrc={images[(this._photoIndex + images.length - 1) % images.length]}
-    //             onCloseRequest={action(() =>
-    //                 this._isOpen = false
-    //             )}
-    //             onMovePrevRequest={action(() =>
-    //                 this._photoIndex = (this._photoIndex + images.length - 1) % images.length
-    //             )}
-    //             onMoveNextRequest={action(() =>
-    //                 this._photoIndex = (this._photoIndex + 1) % images.length
-    //             )}
-    //         />)
-    //     }
-    // }
+
 
     render() {
-        //     let field = this.props.doc.Get(this.props.fieldKey);
-        //     let path = field == FieldWaiting ? "https://image.flaticon.com/icons/svg/66/66163.svg" :
-        //         field instanceof ImageField ? field.Data.href : "http://www.cs.brown.edu/~bcz/face.gif";
-        //     let nativeWidth = this.props.doc.GetNumber(KeyStore.NativeWidth, 1);
-        //     return (
-        //         <div className="imageBox-cont" onPointerDown={this.onPointerDown} ref={this._ref} >
-        //             <img src={path} width={nativeWidth} alt="Image not found" ref={this._imgRef} onLoad={this.onLoad} />
-        //             {this.lightbox(path)}
-        //         </div>)
-        console.log("bleh");
+
         return (<table>
-            <tr>
-                <th>Key</th>
-                <th>Fields</th>
-            </tr>
-            <tr>
-                <td>Jill</td>
-                <td>Smith</td>
-            </tr>
-            <tr>
-                <td>Eve</td>
-                <td>Jackson</td>
-            </tr>
-            <tr>
-                <td>John</td>
-                <td>Doe</td>
-            </tr>
+            <tbody>
+                <tr>
+                    <th>Key</th>
+                    <th>Fields</th>
+                </tr>
+                {this.createTable()}
+            </tbody>
         </table>)
     }
 }
\ No newline at end of file
diff --git a/src/fields/KVPField b/src/fields/KVPField
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/fields/KVPField.ts b/src/fields/KVPField.ts
new file mode 100644
index 000000000..a7ecc0768
--- /dev/null
+++ b/src/fields/KVPField.ts
@@ -0,0 +1,30 @@
+import { BasicField } from "./BasicField"
+import { FieldId } from "./Field";
+import { Types } from "../server/Message";
+import { Document } from "./Document"
+
+export class KVPField extends BasicField<Document> {
+    constructor(data: Document | undefined = undefined, id?: FieldId, save: boolean = true) {
+        super(data == undefined ? new Document() : data, save, id);
+    }
+
+    toString(): string {
+        return this.Data.Title;
+    }
+
+    ToScriptString(): string {
+        return `new KVPField("${this.Data}")`;
+    }
+
+    Copy() {
+        return new KVPField(this.Data);
+    }
+
+    ToJson(): { type: Types, data: Document, _id: string } {
+        return {
+            type: Types.Text,
+            data: this.Data,
+            _id: this.Id
+        }
+    }
+}
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From 9c9aea92d9a330f5826735c3c3e07ec35b325cc2 Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Thu, 28 Feb 2019 00:55:04 -0500
Subject: Added GetOrCreateAsync

---
 src/fields/Document.ts | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

(limited to 'src/fields')

diff --git a/src/fields/Document.ts b/src/fields/Document.ts
index 5b91de6ed..0c156b282 100644
--- a/src/fields/Document.ts
+++ b/src/fields/Document.ts
@@ -102,6 +102,25 @@ export class Document extends Field {
         return false;
     }
 
+    GetOrCreateAsync<T extends Field>(key: Key, ctor: { new(): T }, callback: (field: T) => void): void {
+        //This currently doesn't deal with prototypes
+        if (this._proxies.has(key.Id)) {
+            Server.GetDocumentField(this, key, (field) => {
+                if (field && field instanceof ctor) {
+                    callback(field);
+                } else {
+                    let newField = new ctor();
+                    this.Set(key, newField);
+                    callback(newField);
+                }
+            });
+        } else {
+            let newField = new ctor();
+            this.Set(key, newField);
+            callback(newField);
+        }
+    }
+
     GetT<T extends Field = Field>(key: Key, ctor: { new(...args: any[]): T }, ignoreProto: boolean = false): FieldValue<T> {
         var getfield = this.Get(key, ignoreProto);
         if (getfield != FieldWaiting) {
-- 
cgit v1.2.3-70-g09d2


From 5e01c84f8545ce85e288c49562aa61b26e1bf00d Mon Sep 17 00:00:00 2001
From: Tyler Schicke <tyler_schicke@brown.edu>
Date: Tue, 5 Mar 2019 00:35:54 -0500
Subject: Started adding some comments

---
 src/client/views/EditableView.tsx | 23 +++++++++++++++++++++--
 src/fields/Document.ts            | 39 +++++++++++++++++++++++++++++++++++++++
 2 files changed, 60 insertions(+), 2 deletions(-)

(limited to 'src/fields')

diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx
index 88ef67afa..84b1b91c3 100644
--- a/src/client/views/EditableView.tsx
+++ b/src/client/views/EditableView.tsx
@@ -3,12 +3,30 @@ import { observer } from 'mobx-react';
 import { observable, action } from 'mobx';
 
 export interface EditableProps {
+    /**
+     * Called to get the initial value for editing
+     *  */
     GetValue(): string;
+
+    /**
+     * Called to apply changes
+     * @param value - The string entered by the user to set the value to
+     * @returns `true` if setting the value was successful, `false` otherwise
+     *  */
     SetValue(value: string): boolean;
+
+    /**
+     * The contents to render when not editing
+     */
     contents: any;
     height: number
 }
 
+/**
+ * Customizable view that can be given an arbitrary view to render normally,
+ * but can also be edited with customizable functions to get a string version
+ * of the content, and set the value based on the entered string.
+ */
 @observer
 export class EditableView extends React.Component<EditableProps> {
     @observable
@@ -17,8 +35,9 @@ export class EditableView extends React.Component<EditableProps> {
     @action
     onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
         if (e.key == "Enter" && !e.ctrlKey) {
-            this.props.SetValue(e.currentTarget.value);
-            this.editing = false;
+            if (this.props.SetValue(e.currentTarget.value)) {
+                this.editing = false;
+            }
         } else if (e.key == "Escape") {
             this.editing = false;
         }
diff --git a/src/fields/Document.ts b/src/fields/Document.ts
index 0c156b282..2e873439c 100644
--- a/src/fields/Document.ts
+++ b/src/fields/Document.ts
@@ -38,6 +38,22 @@ export class Document extends Field {
         return this.GetText(KeyStore.Title, "<untitled>");
     }
 
+    /**
+     * Get the field in the document associated with the given key. If the
+     * associated field has not yet been filled in from the server, a request
+     * to the server will automatically be sent, the value will be filled in 
+     * when the request is completed, and {@link Field.ts#FieldWaiting} will be returned.
+     * @param key - The key of the value to get
+     * @param ignoreProto - If true, ignore any prototype this document
+     * might have and only search for the value on this immediate document.
+     * If false (default), search up the prototype chain, starting at this document,
+     * for a document that has a field associated with the given key, and return the first
+     * one found.
+     * 
+     * @returns If the document does not have a field associated with the given key, returns `undefined`.
+     * If the document does have an associated field, but the field has not been fetched from the server, returns {@link Field.ts#FieldWaiting}.
+     * If the document does have an associated field, and the field has not been fetched from the server, returns the associated field.
+     */
     Get(key: Key, ignoreProto: boolean = false): FieldValue<Field> {
         let field: FieldValue<Field>;
         if (ignoreProto) {
@@ -93,7 +109,17 @@ export class Document extends Field {
         return field;
     }
 
+    /**
+     * Tries to get the field associated with the given key, and if there is an
+     * associated field, calls the given callback with that field.
+     * @param key - The key of the value to get
+     * @param callback - A function that will be called with the associated field, if it exists,
+     * once it is fetched from the server (this may be immediately if the field has already been fetched).
+     * Note: The callback will not be called if there is no associated field.
+     * @returns `true` if the field exists on the document and `callback` will be called, and `false` otherwise
+     */
     GetAsync(key: Key, callback: (field: Field) => void): boolean {
+        //TODO: This should probably check if this.fields contains the key before calling Server.GetDocumentField
         //This currently doesn't deal with prototypes
         if (this._proxies.has(key.Id)) {
             Server.GetDocumentField(this, key, callback);
@@ -102,6 +128,12 @@ export class Document extends Field {
         return false;
     }
 
+    /**
+     * Same as {@link Document#GetAsync}, except a field of the given type
+     * will be created if there is no field associated with the given key,
+     * or the field associated with the given key is not of the given type.
+     * @param ctor - Constructor of the field type to get. E.g., TextField, ImageField, etc.
+     */
     GetOrCreateAsync<T extends Field>(key: Key, ctor: { new(): T }, callback: (field: T) => void): void {
         //This currently doesn't deal with prototypes
         if (this._proxies.has(key.Id)) {
@@ -121,6 +153,13 @@ export class Document extends Field {
         }
     }
 
+    /**
+     * Same as {@link Document#Get}, except that it will additionally
+     * check if the field is of the given type.
+     * @param ctor - Constructor of the field type to get. E.g., `TextField`, `ImageField`, etc.
+     * @returns Same as {@link Document#Get}, except will return `undefined`
+     * if there is an associated field but it is of the wrong type.
+     */
     GetT<T extends Field = Field>(key: Key, ctor: { new(...args: any[]): T }, ignoreProto: boolean = false): FieldValue<T> {
         var getfield = this.Get(key, ignoreProto);
         if (getfield != FieldWaiting) {
-- 
cgit v1.2.3-70-g09d2