From fca16fb81f470b43c72c1e24e530fdf66430dc7a Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Fri, 26 Apr 2019 21:41:16 -0400 Subject: KVP stuff --- src/client/views/nodes/KeyValueBox.tsx | 35 ++++++++----------- src/client/views/nodes/KeyValuePair.tsx | 59 ++++++++++++--------------------- src/new_fields/Doc.ts | 8 +++++ src/new_fields/Types.ts | 6 ++-- 4 files changed, 46 insertions(+), 62 deletions(-) (limited to 'src') 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 { @@ -19,7 +17,7 @@ export class KeyValueBox extends React.Component { 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 { 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 { 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 { } 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 Loading...; } 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 { let rows: JSX.Element[] = []; let i = 0; for (let key in ids) { - rows.push(); + rows.push(); } return rows; } @@ -116,7 +109,7 @@ export class KeyValueBox extends React.Component { @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 { - @observable private key: Opt; - - constructor(props: KeyValuePairProps) { - super(props); - Server.GetField(this.props.fieldId, - action((field: Opt) => field instanceof Key && (this.key = field))); - - } - - render() { - if (!this.key) { - return error; - } 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 { active: returnFalse, whenActiveChanged: emptyFunction, ScreenToLocalTransform: Transform.Identity, - focus: emptyDocFunction, + focus: emptyFunction, + PanelWidth: returnZero, + PanelHeight: returnZero, }; let contents = ; return ( @@ -58,21 +45,23 @@ export class KeyValuePair extends React.Component {
-
{this.key.Name}
+
{this.props.keyName}
{ - 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 { 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 | undefined; export type FieldWaiting = T extends undefined ? never : Promise; @@ -48,6 +55,7 @@ export class Doc extends RefField { const doc = new Proxy(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 = undefine type WithoutList = T extends List ? R[] : T; -export function FieldValue>(field: Opt | Promise>, defaultValue: U): WithoutList; -export function FieldValue(field: Opt | Promise>): Opt; -export function FieldValue(field: Opt | Promise>, defaultValue?: T): Opt { +export function FieldValue>(field: FieldResult, defaultValue: U): WithoutList; +export function FieldValue(field: FieldResult): Opt; +export function FieldValue(field: FieldResult, defaultValue?: T): Opt { return field instanceof Promise ? defaultValue : field; } -- cgit v1.2.3-70-g09d2