KVP stuff

4 files changed, 46 insertions, 62 deletions

diff --git a/src/client/views/nodes/KeyValueBox.tsx b/src/client/views/nodes/KeyValueBox.tsx
index ddbec014b..ae39ebe2d 100644
--- a/src/client/views/nodes/KeyValueBox.tsx
+++ b/src/client/views/nodes/KeyValueBox.tsx
@@ -2,15 +2,13 @@
 import { action, computed, observable } from "mobx";
 import { observer } from "mobx-react";
 import 'react-image-lightbox/style.css'; // This only needs to be imported once in your app
-import { Document } from '../../../fields/Document';
-import { Field, FieldWaiting } from '../../../fields/Field';
-import { Key } from '../../../fields/Key';
-import { KeyStore } from '../../../fields/KeyStore';
-import { CompileScript, ToField } from "../../util/Scripting";
+import { CompileScript } from "../../util/Scripting";
 import { FieldView, FieldViewProps } from './FieldView';
 import "./KeyValueBox.scss";
 import { KeyValuePair } from "./KeyValuePair";
 import React = require("react");
+import { NumCast, Cast, FieldValue } from "../../../new_fields/Types";
+import { Doc, IsField } from "../../../new_fields/Doc";
 
 @observer
 export class KeyValueBox extends React.Component<FieldViewProps> {
@@ -19,7 +17,7 @@ export class KeyValueBox extends React.Component<FieldViewProps> {
     public static LayoutString(fieldStr: string = "DataKey") { return FieldView.LayoutString(KeyValueBox, fieldStr); }
     @observable private _keyInput: string = "";
     @observable private _valueInput: string = "";
-    @computed get splitPercentage() { return this.props.Document.GetNumber(KeyStore.SchemaSplitPercentage, 50); }
+    @computed get splitPercentage() { return NumCast(this.props.Document.schemaSplitPercentage, 50); }
 
 
     constructor(props: FieldViewProps) {
@@ -30,8 +28,8 @@ export class KeyValueBox extends React.Component<FieldViewProps> {
     onEnterKey = (e: React.KeyboardEvent): void => {
         if (e.key === 'Enter') {
             if (this._keyInput && this._valueInput) {
-                let doc = this.props.Document.GetT(KeyStore.Data, Document);
-                if (!doc || doc === FieldWaiting) {
+                let doc = FieldValue(Cast(this.props.Document.data, Doc));
+                if (!doc) {
                     return;
                 }
                 let realDoc = doc;
@@ -43,13 +41,8 @@ export class KeyValueBox extends React.Component<FieldViewProps> {
                 let res = script.run();
                 if (!res.success) return;
                 const field = res.result;
-                if (field instanceof Field) {
-                    realDoc.Set(new Key(this._keyInput), field);
-                } else {
-                    let dataField = ToField(field);
-                    if (dataField) {
-                        realDoc.Set(new Key(this._keyInput), dataField);
-                    }
+                if (IsField(field)) {
+                    realDoc[this._keyInput] = field;
                 }
                 this._keyInput = "";
                 this._valueInput = "";
@@ -67,16 +60,16 @@ export class KeyValueBox extends React.Component<FieldViewProps> {
     }
 
     createTable = () => {
-        let doc = this.props.Document.GetT(KeyStore.Data, Document);
-        if (!doc || doc === FieldWaiting) {
+        let doc = FieldValue(Cast(this.props.Document.data, Doc));
+        if (!doc) {
             return <tr><td>Loading...</td></tr>;
         }
         let realDoc = doc;
 
         let ids: { [key: string]: string } = {};
-        let protos = doc.GetAllPrototypes();
+        let protos = Doc.GetAllPrototypes(doc);
         for (const proto of protos) {
-            proto._proxies.forEach((val: any, key: string) => {
+            Object.keys(proto).forEach(key => {
                 if (!(key in ids)) {
                     ids[key] = key;
                 }
@@ -86,7 +79,7 @@ export class KeyValueBox extends React.Component<FieldViewProps> {
         let rows: JSX.Element[] = [];
         let i = 0;
         for (let key in ids) {
-            rows.push(<KeyValuePair doc={realDoc} keyWidth={100 - this.splitPercentage} rowStyle={"keyValueBox-" + (i++ % 2 ? "oddRow" : "evenRow")} fieldId={key} key={key} />);
+            rows.push(<KeyValuePair doc={realDoc} keyWidth={100 - this.splitPercentage} rowStyle={"keyValueBox-" + (i++ % 2 ? "oddRow" : "evenRow")} key={key} keyName={key} />);
         }
         return rows;
     }
@@ -116,7 +109,7 @@ export class KeyValueBox extends React.Component<FieldViewProps> {
     @action
     onDividerMove = (e: PointerEvent): void => {
         let nativeWidth = this._mainCont.current!.getBoundingClientRect();
-        this.props.Document.SetNumber(KeyStore.SchemaSplitPercentage, Math.max(0, 100 - Math.round((e.clientX - nativeWidth.left) / nativeWidth.width * 100)));
+        this.props.Document.schemaSplitPercentage = Math.max(0, 100 - Math.round((e.clientX - nativeWidth.left) / nativeWidth.width * 100));
     }
     @action
     onDividerUp = (e: PointerEvent): void => {
diff --git a/src/client/views/nodes/KeyValuePair.tsx b/src/client/views/nodes/KeyValuePair.tsx
index d480eb5af..235792cbe 100644
--- a/src/client/views/nodes/KeyValuePair.tsx
+++ b/src/client/views/nodes/KeyValuePair.tsx
@@ -1,48 +1,33 @@
 import { action, observable } from 'mobx';
 import { observer } from "mobx-react";
 import 'react-image-lightbox/style.css'; // This only needs to be imported once in your app
-import { Document } from '../../../fields/Document';
-import { Field, Opt } from '../../../fields/Field';
-import { Key } from '../../../fields/Key';
-import { emptyDocFunction, emptyFunction, returnFalse } from '../../../Utils';
-import { Server } from "../../Server";
-import { CompileScript, ToField } from "../../util/Scripting";
+import { emptyFunction, returnFalse, returnZero } from '../../../Utils';
+import { CompileScript } from "../../util/Scripting";
 import { Transform } from '../../util/Transform';
 import { EditableView } from "../EditableView";
 import { FieldView, FieldViewProps } from './FieldView';
 import "./KeyValueBox.scss";
 import "./KeyValuePair.scss";
 import React = require("react");
+import { Doc, Opt, IsField } from '../../../new_fields/Doc';
+import { FieldValue } from '../../../new_fields/Types';
 
 // Represents one row in a key value plane
 
 export interface KeyValuePairProps {
     rowStyle: string;
-    fieldId: string;
-    doc: Document;
+    keyName: string;
+    doc: Doc;
     keyWidth: number;
 }
 @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>) => field instanceof Key && (this.key = field)));
-
-    }
-
-
     render() {
-        if (!this.key) {
-            return <tr><td>error</td><td /></tr>;
-        }
         let props: FieldViewProps = {
             Document: this.props.doc,
             ContainingCollectionView: undefined,
-            fieldKey: this.key,
+            fieldKey: this.props.keyName,
             isSelected: returnFalse,
             select: emptyFunction,
             isTopMost: false,
@@ -50,7 +35,9 @@ export class KeyValuePair extends React.Component<KeyValuePairProps> {
             active: returnFalse,
             whenActiveChanged: emptyFunction,
             ScreenToLocalTransform: Transform.Identity,
-            focus: emptyDocFunction,
+            focus: emptyFunction,
+            PanelWidth: returnZero,
+            PanelHeight: returnZero,
         };
         let contents = <FieldView {...props} />;
         return (
@@ -58,21 +45,23 @@ export class KeyValuePair extends React.Component<KeyValuePairProps> {
                 <td className="keyValuePair-td-key" style={{ width: `${this.props.keyWidth}%` }}>
                     <div className="keyValuePair-td-key-container">
                         <button className="keyValuePair-td-key-delete" onClick={() => {
-                            let field = props.Document.Get(props.fieldKey);
-                            field && field instanceof Field && props.Document.Set(props.fieldKey, undefined);
+                            let field = FieldValue(props.Document[props.fieldKey]);
+                            field && (props.Document[props.fieldKey] = undefined);
                         }}>
                             X
                         </button>
-                        <div className="keyValuePair-keyField">{this.key.Name}</div>
+                        <div className="keyValuePair-keyField">{this.props.keyName}</div>
                     </div>
                 </td>
                 <td className="keyValuePair-td-value" style={{ width: `${100 - this.props.keyWidth}%` }}>
                     <EditableView contents={contents} height={36} GetValue={() => {
-                        let field = props.Document.Get(props.fieldKey);
-                        if (field && field instanceof Field) {
-                            return field.ToScriptString();
+                        let field = FieldValue(props.Document[props.fieldKey]);
+                        if (field) {
+                            //TODO Types
+                            return String(field);
+                            // return field.ToScriptString();
                         }
-                        return field || "";
+                        return "";
                     }}
                         SetValue={(value: string) => {
                             let script = CompileScript(value, { addReturn: true });
@@ -82,15 +71,9 @@ export class KeyValuePair extends React.Component<KeyValuePairProps> {
                             let res = script.run();
                             if (!res.success) return false;
                             const field = res.result;
-                            if (field instanceof Field) {
-                                props.Document.Set(props.fieldKey, field);
+                            if (IsField(field)) {
+                                props.Document[props.fieldKey] = field;
                                 return true;
-                            } else {
-                                let dataField = ToField(field);
-                                if (dataField) {
-                                    props.Document.Set(props.fieldKey, dataField);
-                                    return true;
-                                }
                             }
                             return false;
                         }}>
diff --git a/src/new_fields/Doc.ts b/src/new_fields/Doc.ts
index 6dfa37c1b..a1515fe49 100644
--- a/src/new_fields/Doc.ts
+++ b/src/new_fields/Doc.ts
@@ -34,6 +34,13 @@ export class ObjectField {
     readonly [Id] = "";
 }
 
+export function IsField(field: any): field is Field {
+    return (typeof field === "string")
+        || (typeof field === "number")
+        || (typeof field === "boolean")
+        || (field instanceof ObjectField)
+        || (field instanceof RefField);
+}
 export type Field = number | string | boolean | ObjectField | RefField;
 export type Opt<T> = T | undefined;
 export type FieldWaiting<T extends RefField = RefField> = T extends undefined ? never : Promise<T | undefined>;
@@ -48,6 +55,7 @@ export class Doc extends RefField {
         const doc = new Proxy<this>(this, {
             set: setter,
             get: getter,
+            ownKeys: target => Object.keys(target.__fields),
             deleteProperty: () => { throw new Error("Currently properties can't be deleted from documents, assign to undefined instead"); },
             defineProperty: () => { throw new Error("Currently properties can't be defined on documents using Object.defineProperty"); },
         });
diff --git a/src/new_fields/Types.ts b/src/new_fields/Types.ts
index 649dfdc3e..4808d6e46 100644
--- a/src/new_fields/Types.ts
+++ b/src/new_fields/Types.ts
@@ -73,9 +73,9 @@ export function BoolCast(field: FieldResult, defaultVal: Opt<boolean> = undefine
 
 type WithoutList<T extends Field> = T extends List<infer R> ? R[] : T;
 
-export function FieldValue<T extends Field, U extends WithoutList<T>>(field: Opt<T> | Promise<Opt<T>>, defaultValue: U): WithoutList<T>;
-export function FieldValue<T extends Field>(field: Opt<T> | Promise<Opt<T>>): Opt<T>;
-export function FieldValue<T extends Field>(field: Opt<T> | Promise<Opt<T>>, defaultValue?: T): Opt<T> {
+export function FieldValue<T extends Field, U extends WithoutList<T>>(field: FieldResult<T>, defaultValue: U): WithoutList<T>;
+export function FieldValue<T extends Field>(field: FieldResult<T>): Opt<T>;
+export function FieldValue<T extends Field>(field: FieldResult<T>, defaultValue?: T): Opt<T> {
     return field instanceof Promise ? defaultValue : field;
 }