diff options
| -rw-r--r-- | src/client/util/Scripting.ts | 7 | ||||
| -rw-r--r-- | src/client/views/MainView.tsx | 9 | ||||
| -rw-r--r-- | src/client/views/ScriptBox.scss | 7 | ||||
| -rw-r--r-- | src/client/views/ScriptBox.tsx | 49 | ||||
| -rw-r--r-- | src/server/authentication/models/current_user_utils.ts | 2 |
5 files changed, 59 insertions, 15 deletions
diff --git a/src/client/util/Scripting.ts b/src/client/util/Scripting.ts index 0fa96963e..ca770f897 100644 --- a/src/client/util/Scripting.ts +++ b/src/client/util/Scripting.ts @@ -89,9 +89,9 @@ const _scriptingGlobals: { [name: string]: any } = {}; let scriptingGlobals: { [name: string]: any } = _scriptingGlobals; 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 ((options.typecheck !== false && errors) || !script) { - return { compiled: false, errors: diagnostics }; + const errors = diagnostics.filter(diag => diag.category === ts.DiagnosticCategory.Error); + if ((options.typecheck !== false && errors.length) || !script) { + return { compiled: false, errors }; } const paramNames = Object.keys(scriptingGlobals); @@ -273,6 +273,7 @@ export function CompileScript(script: string, options: ScriptOptions = {}): Comp const result = Run(outputText, paramNames, diagnostics, script, options); + if (options.globals) { Scripting.resetScriptingGlobals(); } diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index ff35593fe..f30d17d94 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -1,7 +1,7 @@ import { library } from '@fortawesome/fontawesome-svg-core'; import { faFileAlt, faStickyNote, faArrowDown, faBullseye, faFilter, faArrowUp, faBolt, faCaretUp, faCat, faCheck, faChevronRight, faClone, faCloudUploadAlt, faCommentAlt, faCut, faEllipsisV, faExclamation, faFilePdf, faFilm, faFont, faGlobeAsia, faLongArrowAltRight, - faMusic, faObjectGroup, faPause, faMousePointer, faPenNib, faFileAudio, faPen, faEraser, faPlay, faPortrait, faRedoAlt, faThumbtack, faTree, faTv, faUndoAlt, faHighlighter, faMicrophone, faCompressArrowsAlt, faPhone, faStamp, faClipboard, faVideo, + faMusic, faObjectGroup, faPause, faMousePointer, faPenNib, faFileAudio, faPen, faEraser, faPlay, faPortrait, faRedoAlt, faThumbtack, faTree, faTv, faUndoAlt, faHighlighter, faMicrophone, faCompressArrowsAlt, faPhone, faStamp, faClipboard, faVideo, faTerminal, } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { action, computed, configure, observable, reaction, runInAction } from 'mobx'; @@ -57,7 +57,7 @@ export class MainView extends React.Component { @observable private _panelHeight: number = 0; @observable private _flyoutTranslate: boolean = true; @observable public flyoutWidth: number = 250; - private get darkScheme() { return BoolCast(Cast(this.userDoc.activeWorkspace, Doc, null)?.darkScheme); } + private get darkScheme() { return BoolCast(Cast(this.userDoc.activeWorkspace, Doc, null) ?.darkScheme); } @computed private get userDoc() { return Doc.UserDoc(); } @computed private get mainContainer() { return this.userDoc ? FieldValue(Cast(this.userDoc.activeWorkspace, Doc)) : CurrentUserUtils.GuestWorkspace; } @@ -148,6 +148,7 @@ export class MainView extends React.Component { library.add(faPhone); library.add(faClipboard); library.add(faStamp); + library.add(faTerminal); this.initEventListeners(); this.initAuthenticationRouters(); } @@ -389,7 +390,7 @@ export class MainView extends React.Component { mainContainerXf = () => new Transform(0, -this._buttonBarHeight, 1); @computed get flyout() { - const sidebarContent = this.userDoc?.sidebarContainer; + const sidebarContent = this.userDoc ?.sidebarContainer; if (!(sidebarContent instanceof Doc)) { return (null); } @@ -505,7 +506,7 @@ export class MainView extends React.Component { return new Transform(-translateX, -translateY, 1 / scale); } @computed get docButtons() { - const expandingBtns = Doc.UserDoc()?.expandingButtons; + const expandingBtns = Doc.UserDoc() ?.expandingButtons; if (expandingBtns instanceof Doc) { return <div className="mainView-docButtons" ref={this._docBtnRef} style={{ height: !expandingBtns.linearViewIsExpanded ? "42px" : undefined }} > diff --git a/src/client/views/ScriptBox.scss b/src/client/views/ScriptBox.scss index c67295c90..b91a36c1f 100644 --- a/src/client/views/ScriptBox.scss +++ b/src/client/views/ScriptBox.scss @@ -4,6 +4,8 @@ display: flex; flex-direction: column; pointer-events: all; + background-color: rgb(241, 239, 235); + padding: 10px; } .scriptBox-toolbar { @@ -15,4 +17,9 @@ height: 100%; box-sizing: border-box; resize: none; + padding: 7px; +} + +.scriptBox-button { + width: 50% }
\ No newline at end of file diff --git a/src/client/views/ScriptBox.tsx b/src/client/views/ScriptBox.tsx index cafa09f41..48f4c8163 100644 --- a/src/client/views/ScriptBox.tsx +++ b/src/client/views/ScriptBox.tsx @@ -7,7 +7,7 @@ import { OverlayView } from "./OverlayView"; import { DocumentIconContainer } from "./nodes/DocumentIcon"; import { Opt, Doc } from "../../new_fields/Doc"; import { emptyFunction } from "../../Utils"; -import { ScriptCast } from "../../new_fields/Types"; +import { ScriptCast, StrCast } from "../../new_fields/Types"; import { CompileScript } from "../util/Scripting"; import { ScriptField } from "../../new_fields/ScriptField"; import { DragManager } from "../util/DragManager"; @@ -17,6 +17,8 @@ import { DocAnnotatableComponent } from "./DocComponent"; import { makeInterface } from "../../new_fields/Schema"; import { documentSchema } from "../../new_fields/documentSchemas"; import { CompileResult } from "../northstar/model/idea/idea"; +import { red } from "colors"; +import { forEach } from "typescript-collections/dist/lib/arrays"; export interface ScriptBoxProps { onSave?: (text: string, onError: (error: string) => void) => void; @@ -37,9 +39,18 @@ export class ScriptBox extends DocAnnotatableComponent<FieldViewProps & ScriptBo @observable private _scriptText: string; + @observable + private _errorMessage: string; + constructor(props: ScriptBoxProps) { super(props); this._scriptText = props.initialText || ""; + this._errorMessage = ""; + } + + @action + componentDidMount() { + this._scriptText = StrCast(this.props.Document.documentText) || this.props.initialText || ""; } @action @@ -48,8 +59,10 @@ export class ScriptBox extends DocAnnotatableComponent<FieldViewProps & ScriptBo } @action - onError = (error: string) => { - console.log(error); + onError = (error: any) => { + for (const entry of error) { + this._errorMessage = this._errorMessage + " " + entry.messageText; + } } overlayDisposer?: () => void; @@ -64,15 +77,35 @@ export class ScriptBox extends DocAnnotatableComponent<FieldViewProps & ScriptBo this.overlayDisposer && this.overlayDisposer(); } + @action onCompile = () => { const result = CompileScript(this._scriptText, {}); + this._errorMessage = ""; + if (result.compiled) { + this._errorMessage = ""; + this.props.Document.data = new ScriptField(result); + } + else { + this.onError(result.errors); + } + this.props.Document.documentText = this._scriptText; + } + + @action + onRun = () => { + const result = CompileScript(this._scriptText, {}); + this._errorMessage = ""; if (result.compiled) { - // this automatically saves + result.run({}, (err: any) => { + this._errorMessage = ""; + this.onError(err); + }); this.props.Document.data = new ScriptField(result); } else { - // error message + this.onError(result.errors); } + this.props.Document.documentText = this._scriptText; } render() { @@ -93,11 +126,13 @@ export class ScriptBox extends DocAnnotatableComponent<FieldViewProps & ScriptBo return ( <div className="scriptBox-outerDiv"> <div style={{ display: "flex", flexDirection: "column", height: "100%" }}> - <textarea className="scriptBox-textarea" onChange={this.onChange} value={this._scriptText} onFocus={onFocus} onBlur={onBlur}></textarea> + <textarea className="scriptBox-textarea" placeholder="write your script here" onChange={this.onChange} value={this._scriptText} onFocus={onFocus} onBlur={onBlur}></textarea> + <div className="errorMessage">{this._errorMessage}</div> <div style={{ background: "beige" }} >{params}</div> </div> <div className="scriptBox-toolbar"> - <button onPointerDown={e => { this.onCompile(); e.stopPropagation(); }}>Compile</button> + <button className="scriptBox-button" onPointerDown={e => { this.onCompile(); e.stopPropagation(); }}>Compile</button> + <button className="scriptBox-button" onPointerDown={e => { this.onRun(); e.stopPropagation(); }}>Run</button> </div> </div> ); diff --git a/src/server/authentication/models/current_user_utils.ts b/src/server/authentication/models/current_user_utils.ts index 3a6d5f0f3..34f7a6507 100644 --- a/src/server/authentication/models/current_user_utils.ts +++ b/src/server/authentication/models/current_user_utils.ts @@ -63,7 +63,7 @@ export class CurrentUserUtils { { title: "preview", icon: "expand", ignoreClick: true, drag: 'Docs.Create.DocumentDocument(ComputedField.MakeFunction("selectedDocs(this,true,[_last_])?.[0]"), { _width: 250, _height: 250, title: "container" })' }, { title: "web page", icon: "globe-asia", ignoreClick: true, drag: 'Docs.Create.WebDocument("https://en.wikipedia.org/wiki/Hedgehog", {_width: 300, _height: 300, title: "New Webpage" })' }, { title: "cat image", icon: "cat", ignoreClick: true, drag: 'Docs.Create.ImageDocument("https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg", { _width: 200, title: "an image of a cat" })' }, - { title: "script", icon: "cat", ignoreClick: true, drag: 'Docs.Create.ScriptDocument({ _width: 200, _height: 250 title: "untitled script" })' }, + { title: "script", icon: "terminal", ignoreClick: true, drag: 'Docs.Create.ScriptDocument({ _width: 200, _height: 250 title: "untitled script" })' }, { title: "buxton", icon: "cloud-upload-alt", ignoreClick: true, drag: "Docs.Create.Buxton()" }, { title: "webcam", icon: "video", ignoreClick: true, drag: 'Docs.Create.WebCamDocument("", { width: 400, height: 400, title: "a test cam" })' }, { title: "record", icon: "microphone", ignoreClick: true, drag: `Docs.Create.AudioDocument("${nullAudio}", { _width: 200, title: "ready to record audio" })` }, |