From af2346983eae1145167b70faf96a9aec0ca82427 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Mon, 20 May 2019 00:09:47 -0400 Subject: Fixed a bunch of demo bugs Moved Field Symbols to separate file Editing is mostly working in debug viewer --- src/debug/Viewer.tsx | 53 ++++++++++++++++++++++++++++++++++++++++++---------- 1 file changed, 43 insertions(+), 10 deletions(-) (limited to 'src/debug') diff --git a/src/debug/Viewer.tsx b/src/debug/Viewer.tsx index 720e1640a..4314e2132 100644 --- a/src/debug/Viewer.tsx +++ b/src/debug/Viewer.tsx @@ -3,11 +3,27 @@ import "normalize.css"; import * as React from 'react'; import * as ReactDOM from 'react-dom'; import { observer } from 'mobx-react'; -import { Doc, Field, FieldResult } from '../new_fields/Doc'; +import { Doc, Field, FieldResult, Opt } from '../new_fields/Doc'; import { DocServer } from '../client/DocServer'; -import { Id } from '../new_fields/RefField'; +import { Id } from '../new_fields/FieldSymbols'; import { List } from '../new_fields/List'; import { URLField } from '../new_fields/URLField'; +import { EditableView } from '../client/views/EditableView'; +import { CompileScript } from '../client/util/Scripting'; + +function applyToDoc(doc: { [index: string]: FieldResult }, key: string, scriptString: string): boolean; +function applyToDoc(doc: { [index: number]: FieldResult }, key: number, scriptString: string): boolean; +function applyToDoc(doc: any, key: string | number, scriptString: string): boolean { + let script = CompileScript(scriptString, { addReturn: true, params: { this: doc instanceof Doc ? Doc.name : List.name } }); + if (!script.compiled) { + return false; + } + const res = script.run({ this: doc }); + if (!res.success) return false; + if (!Field.IsField(res.result)) return false; + doc[key] = res.result; + return true; +} configure({ enforceActions: "observed" @@ -18,12 +34,18 @@ class ListViewer extends React.Component<{ field: List }>{ @observable expanded = false; + @action + onClick = (e: React.MouseEvent) => { + this.expanded = !this.expanded; + e.stopPropagation(); + } + render() { let content; if (this.expanded) { content = (
- {this.props.field.map((field, index) => )} + {this.props.field.map((field, index) => applyToDoc(this.props.field, index, value)} />)}
); } else { @@ -31,7 +53,7 @@ class ListViewer extends React.Component<{ field: List }>{ } return (
- + {content}
); @@ -42,6 +64,13 @@ class ListViewer extends React.Component<{ field: List }>{ class DocumentViewer extends React.Component<{ field: Doc }> { @observable expanded = false; + + @action + onClick = (e: React.MouseEvent) => { + this.expanded = !this.expanded; + e.stopPropagation(); + } + render() { let content; if (this.expanded) { @@ -50,7 +79,7 @@ class DocumentViewer extends React.Component<{ field: Doc }> { return (
({key}): - + applyToDoc(this.props.field, key, value)}>
); }); @@ -67,7 +96,7 @@ class DocumentViewer extends React.Component<{ field: Doc }> { } return (
- + {content}
); @@ -75,7 +104,7 @@ class DocumentViewer extends React.Component<{ field: Doc }> { } @observer -class DebugViewer extends React.Component<{ field: FieldResult }> { +class DebugViewer extends React.Component<{ field: FieldResult, setValue(value: string): boolean }> { render() { let content; @@ -90,10 +119,14 @@ class DebugViewer extends React.Component<{ field: FieldResult }> { content =

{field}

; } else if (field instanceof URLField) { content =

{field.url.href}

; + } else if (field instanceof Promise) { + return

Field loading

; } else { - content =

Unrecognized field type

; + return

Unrecognized field type

; } - return content; + + return Field.toScriptString(field)} SetValue={this.props.setValue} + contents={content}>; } } @@ -129,7 +162,7 @@ class Viewer extends React.Component { onChange={this.inputOnChange} onKeyDown={this.onKeyPress} />
- {this.fields.map((field, index) => )} + {this.fields.map((field, index) => false}>)}
); -- cgit v1.2.3-70-g09d2 From 6eb5234a0def9e5714319e512e8dd927bd894b82 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Tue, 21 May 2019 11:44:51 -0400 Subject: Fixed various scripting things --- src/client/util/type_decls.d | 33 ++++++++++++++++------ .../views/collections/CollectionSchemaView.tsx | 10 +++---- .../collectionFreeForm/CollectionFreeFormView.tsx | 2 +- src/client/views/nodes/KeyValuePair.tsx | 8 ++---- src/debug/Viewer.tsx | 2 +- src/new_fields/Doc.ts | 7 +++-- src/new_fields/URLField.ts | 9 ++++-- 7 files changed, 46 insertions(+), 25 deletions(-) (limited to 'src/debug') diff --git a/src/client/util/type_decls.d b/src/client/util/type_decls.d index 51114d0e2..557f6f574 100644 --- a/src/client/util/type_decls.d +++ b/src/client/util/type_decls.d @@ -140,33 +140,50 @@ declare const ToScriptString: unique symbol; declare abstract class RefField { readonly [Id]: FieldId; - constructor(id?: FieldId); - protected [HandleUpdate]?(diff: any): void; + constructor(); + // protected [HandleUpdate]?(diff: any): void; - abstract [ToScriptString](): string; + // abstract [ToScriptString](): string; } declare abstract class ObjectField { protected [OnUpdate](diff?: any): void; private [Parent]?: RefField | ObjectField; - abstract [Copy](): ObjectField; + // abstract [Copy](): ObjectField; - abstract [ToScriptString](): string; + // abstract [ToScriptString](): string; } + +declare abstract class URLField extends ObjectField { + readonly url: URL; + + constructor(url: string); + constructor(url: URL); +} + +declare class AudioField extends URLField { } +declare class VideoField extends URLField { } +declare class ImageField extends URLField { } +declare class WebField extends URLField { } +declare class PdfField extends URLField { } + declare type FieldId = string; declare type Field = number | string | boolean | ObjectField | RefField; declare type Opt = T | undefined; declare class Doc extends RefField { + constructor(); + [key: string]: Field | undefined; - [ToScriptString](): string; + // [ToScriptString](): string; } declare class ListImpl extends ObjectField { + constructor(fields?: T[]); [index: number]: T | (T extends RefField ? Promise : never); - [ToScriptString](): string; - [Copy](): ObjectField; + // [ToScriptString](): string; + // [Copy](): ObjectField; } // @ts-ignore diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx index b25b48339..488f7d6cb 100644 --- a/src/client/views/collections/CollectionSchemaView.tsx +++ b/src/client/views/collections/CollectionSchemaView.tsx @@ -115,22 +115,20 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) { height={Number(MAX_ROW_HEIGHT)} GetValue={() => { let field = props.Document[props.fieldKey]; - if (field) { - //TODO Types - // return field.ToScriptString(); - return String(field); + if (Field.IsField(field)) { + return Field.toScriptString(field); } return ""; }} SetValue={(value: string) => { - let script = CompileScript(value, { addReturn: true, params: { this: Document.name } }); + let script = CompileScript(value, { addReturn: true, params: { this: Doc.name } }); if (!script.compiled) { return false; } return applyToDoc(props.Document, script.run); }} OnFillDown={async (value: string) => { - let script = CompileScript(value, { addReturn: true, params: { this: Document.name } }); + let script = CompileScript(value, { addReturn: true, params: { this: Doc.name } }); if (!script.compiled) { return; } diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index ba6a4bbab..7a0a02318 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -183,7 +183,7 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) { return; } e.stopPropagation(); - const coefficient = 100; + const coefficient = 1000; if (e.ctrlKey) { let deltaScale = (1 - (e.deltaY / coefficient)); diff --git a/src/client/views/nodes/KeyValuePair.tsx b/src/client/views/nodes/KeyValuePair.tsx index 7a88985c0..2363553df 100644 --- a/src/client/views/nodes/KeyValuePair.tsx +++ b/src/client/views/nodes/KeyValuePair.tsx @@ -60,10 +60,8 @@ export class KeyValuePair extends React.Component { { let field = FieldValue(props.Document[props.fieldKey]); - if (field) { - //TODO Types - return String(field); - // return field.ToScriptString(); + if (Field.IsField(field)) { + return Field.toScriptString(field); } return ""; }} @@ -75,7 +73,7 @@ export class KeyValuePair extends React.Component { let res = script.run(); if (!res.success) return false; const field = res.result; - if (Field.IsField(field)) { + if (Field.IsField(field, true)) { props.Document[props.fieldKey] = field; return true; } diff --git a/src/debug/Viewer.tsx b/src/debug/Viewer.tsx index 4314e2132..b22300d0b 100644 --- a/src/debug/Viewer.tsx +++ b/src/debug/Viewer.tsx @@ -20,7 +20,7 @@ function applyToDoc(doc: any, key: string | number, scriptString: string): boole } const res = script.run({ this: doc }); if (!res.success) return false; - if (!Field.IsField(res.result)) return false; + if (!Field.IsField(res.result, true)) return false; doc[key] = res.result; return true; } diff --git a/src/new_fields/Doc.ts b/src/new_fields/Doc.ts index 08bc2ec4d..b0237d04d 100644 --- a/src/new_fields/Doc.ts +++ b/src/new_fields/Doc.ts @@ -19,12 +19,15 @@ export namespace Field { return field[ToScriptString](); } } - export function IsField(field: any): field is Field { + export function IsField(field: any): field is Field; + export function IsField(field: any, includeUndefined: true): field is Field | undefined; + export function IsField(field: any, includeUndefined: boolean = false): field is Field | undefined { return (typeof field === "string") || (typeof field === "number") || (typeof field === "boolean") || (field instanceof ObjectField) - || (field instanceof RefField); + || (field instanceof RefField) + || (includeUndefined && field === undefined); } } export type Field = number | string | boolean | ObjectField | RefField; diff --git a/src/new_fields/URLField.ts b/src/new_fields/URLField.ts index a6f8f1cc5..4a2841fb6 100644 --- a/src/new_fields/URLField.ts +++ b/src/new_fields/URLField.ts @@ -18,13 +18,18 @@ export abstract class URLField extends ObjectField { @serializable(url()) readonly url: URL; - constructor(url: URL) { + constructor(url: string); + constructor(url: URL); + constructor(url: URL | string) { super(); + if (typeof url === "string") { + url = new URL(url); + } this.url = url; } [ToScriptString]() { - return `new ${this.constructor.name}(new URL(${this.url.href}))`; + return `new ${this.constructor.name}("${this.url.href}")`; } [Copy](): this { -- cgit v1.2.3-70-g09d2 From dcfc5d77779117616503c31fc03f36841e25a3f9 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Fri, 24 May 2019 00:56:32 -0400 Subject: Added basic repl page --- deploy/debug/repl.html | 14 +++++++++++ src/client/util/Scripting.ts | 7 +++--- src/debug/Repl.tsx | 58 ++++++++++++++++++++++++++++++++++++++++++++ src/new_fields/Doc.ts | 15 +++++++++++- webpack.config.js | 1 + 5 files changed, 91 insertions(+), 4 deletions(-) create mode 100644 deploy/debug/repl.html create mode 100644 src/debug/Repl.tsx (limited to 'src/debug') diff --git a/deploy/debug/repl.html b/deploy/debug/repl.html new file mode 100644 index 000000000..8ab07ec49 --- /dev/null +++ b/deploy/debug/repl.html @@ -0,0 +1,14 @@ + + + + Debug REPL + + + + + +
+ + + + \ No newline at end of file diff --git a/src/client/util/Scripting.ts b/src/client/util/Scripting.ts index e45f61c11..beaf5cb03 100644 --- a/src/client/util/Scripting.ts +++ b/src/client/util/Scripting.ts @@ -41,7 +41,7 @@ export type CompileResult = CompiledScript | CompileError; function Run(script: string | undefined, customParams: string[], diagnostics: any[], originalScript: string, options: ScriptOptions): CompileResult { const errors = diagnostics.some(diag => diag.category === ts.DiagnosticCategory.Error); - if (errors || !script) { + if ((options.typecheck !== false && errors) || !script) { return { compiled: false, errors: diagnostics }; } @@ -131,10 +131,11 @@ export interface ScriptOptions { addReturn?: boolean; params?: { [name: string]: string }; capturedVariables?: { [name: string]: Field }; + typecheck?: boolean; } export function CompileScript(script: string, options: ScriptOptions = {}): CompileResult { - const { requiredType = "", addReturn = false, params = {}, capturedVariables = {} } = options; + const { requiredType = "", addReturn = false, params = {}, capturedVariables = {}, typecheck = true } = options; let host = new ScriptingCompilerHost; let paramNames: string[] = []; if ("this" in params || "this" in capturedVariables) { @@ -158,7 +159,7 @@ export function CompileScript(script: string, options: ScriptOptions = {}): Comp ${addReturn ? `return ${script};` : script} })`; host.writeFile("file.ts", funcScript); - host.writeFile('node_modules/typescript/lib/lib.d.ts', typescriptlib); + if (typecheck) host.writeFile('node_modules/typescript/lib/lib.d.ts', typescriptlib); let program = ts.createProgram(["file.ts"], {}, host); let testResult = program.emit(); let outputText = host.readFile("file.js"); diff --git a/src/debug/Repl.tsx b/src/debug/Repl.tsx new file mode 100644 index 000000000..16aef1925 --- /dev/null +++ b/src/debug/Repl.tsx @@ -0,0 +1,58 @@ +import * as React from 'react'; +import * as ReactDOM from 'react-dom'; +import { observer } from 'mobx-react'; +import { observable, computed } from 'mobx'; +import { CompileScript } from '../client/util/Scripting'; + +@observer +class Repl extends React.Component { + @observable text: string = ""; + + @observable executedCommands: { command: string, result: any }[] = []; + + onChange = (e: React.ChangeEvent) => { + this.text = e.target.value; + } + + onKeyDown = (e: React.KeyboardEvent) => { + if (e.key === "Enter") { + const script = CompileScript(this.text, { addReturn: true, typecheck: false }); + if (!script.compiled) { + this.executedCommands.push({ command: this.text, result: "Compile Error" }); + } else { + const result = script.run(); + if (result.success) { + this.executedCommands.push({ command: this.text, result: result.result }); + } else { + this.executedCommands.push({ command: this.text, result: result.error }); + } + } + this.text = ""; + } + } + + @computed + get commands() { + return this.executedCommands.map(command => { + return ( +
+

{command.command}

+

{JSON.stringify(command.result)}

+
+ ); + }); + } + + render() { + return ( +
+
+ {this.commands} +
+ +
+ ); + } +} + +ReactDOM.render(, document.getElementById("root")); \ No newline at end of file diff --git a/src/new_fields/Doc.ts b/src/new_fields/Doc.ts index 793a83750..0c74b8f65 100644 --- a/src/new_fields/Doc.ts +++ b/src/new_fields/Doc.ts @@ -62,6 +62,7 @@ export class Doc extends RefField { const doc = new Proxy(this, { set: setter, get: getter, + // getPrototypeOf: (target) => Cast(target[SelfProxy].proto, Doc) || null, // TODO this might be able to replace the proto logic in getter has: (target, key) => key in target.__fields, ownKeys: target => Object.keys(target.__fields), getOwnPropertyDescriptor: (target, prop) => { @@ -69,6 +70,7 @@ export class Doc extends RefField { return { configurable: true,//TODO Should configurable be true? enumerable: true, + value: target.__fields[prop] }; } return Reflect.getOwnPropertyDescriptor(target, prop); @@ -197,6 +199,18 @@ export namespace Doc { return Doc.GetT(doc, "isPrototype", "boolean", true) ? doc : doc.proto!; } + export function allKeys(doc: Doc): string[] { + const results: Set = new Set; + + let proto: Doc | undefined = doc; + while (proto) { + Object.keys(proto).forEach(key => results.add(key)); + proto = proto.proto; + } + + return Array.from(results); + } + export function MakeAlias(doc: Doc) { const proto = Object.getOwnPropertyNames(doc).indexOf("isPrototype") === -1 ? doc.proto : undefined; @@ -246,5 +260,4 @@ export namespace Doc { delegate.proto = doc; return delegate; } - export const Prototype = Symbol("Prototype"); } \ No newline at end of file diff --git a/webpack.config.js b/webpack.config.js index c08742272..5e0a6a883 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -8,6 +8,7 @@ module.exports = { entry: { bundle: ["./src/client/views/Main.tsx", 'webpack-hot-middleware/client?reload=true'], viewer: ["./src/debug/Viewer.tsx", 'webpack-hot-middleware/client?reload=true'], + repl: ["./src/debug/Repl.tsx", 'webpack-hot-middleware/client?reload=true'], test: ["./src/debug/Test.tsx", 'webpack-hot-middleware/client?reload=true'], inkControls: ["./src/mobile/InkControls.tsx", 'webpack-hot-middleware/client?reload=true'], imageUpload: ["./src/mobile/ImageUpload.tsx", 'webpack-hot-middleware/client?reload=true'], -- cgit v1.2.3-70-g09d2 From 568a3907a1277259eb9a0a5ae62cfcf5d7e60bf2 Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Fri, 24 May 2019 01:11:23 -0400 Subject: Fixed firefox user select stuff Made repl multi-line --- src/client/views/Main.scss | 3 +++ src/debug/Repl.tsx | 6 +++--- 2 files changed, 6 insertions(+), 3 deletions(-) (limited to 'src/debug') diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss index 385298e18..57a53c999 100644 --- a/src/client/views/Main.scss +++ b/src/client/views/Main.scss @@ -15,6 +15,9 @@ body { div { user-select: none; + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; } #dash-title { diff --git a/src/debug/Repl.tsx b/src/debug/Repl.tsx index 16aef1925..ef00ed466 100644 --- a/src/debug/Repl.tsx +++ b/src/debug/Repl.tsx @@ -10,12 +10,12 @@ class Repl extends React.Component { @observable executedCommands: { command: string, result: any }[] = []; - onChange = (e: React.ChangeEvent) => { + onChange = (e: React.ChangeEvent) => { this.text = e.target.value; } onKeyDown = (e: React.KeyboardEvent) => { - if (e.key === "Enter") { + if (e.ctrlKey && e.key === "Enter") { const script = CompileScript(this.text, { addReturn: true, typecheck: false }); if (!script.compiled) { this.executedCommands.push({ command: this.text, result: "Compile Error" }); @@ -49,7 +49,7 @@ class Repl extends React.Component {
{this.commands}
- +