From 823b8728b5506697b7d305a8c07979984b8351c8 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Mon, 1 Jun 2020 15:27:57 -0500 Subject: adding descriptions and params to methods --- src/client/util/CurrentUserUtils.ts | 3 +- src/client/util/Scripting.ts | 1 - src/client/views/nodes/ScriptingBox.scss | 76 +++++++------- src/client/views/nodes/ScriptingBox.tsx | 168 ++++++++++++++++++++++++++----- 4 files changed, 180 insertions(+), 68 deletions(-) (limited to 'src') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 1fdf50dd4..632187b49 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -737,5 +737,6 @@ export class CurrentUserUtils { } Scripting.addGlobal("setupMobileInkingDoc", function setupMobileInkingDoc(userDoc: Doc) { return CurrentUserUtils.setupMobileInkingDoc(userDoc); }); -Scripting.addGlobal(function setupMobileUploadDoc(userDoc: Doc) { return CurrentUserUtils.setupMobileUploadDoc(userDoc); }); +Scripting.addGlobal(function setupMobileUploadDoc(userDoc: Doc) { return CurrentUserUtils.setupMobileUploadDoc(userDoc); }, + "initializes the Mobile upload document", "{ userDoc: the document to initialize }"); Scripting.addGlobal(function createNewWorkspace() { return MainView.Instance.createNewWorkspace(); }); \ No newline at end of file diff --git a/src/client/util/Scripting.ts b/src/client/util/Scripting.ts index 817e6b29d..00b01a75a 100644 --- a/src/client/util/Scripting.ts +++ b/src/client/util/Scripting.ts @@ -49,7 +49,6 @@ export function isCompileError(toBeDetermined: CompileResult): toBeDetermined is export namespace Scripting { export function addGlobal(global: { name: string }): void; export function addGlobal(name: string, global: any): void; - export function addGlobal(global: { name: string }, decription?: string, params?: any): void; export function addGlobal(nameOrGlobal: any, global?: any, params?: any) { diff --git a/src/client/views/nodes/ScriptingBox.scss b/src/client/views/nodes/ScriptingBox.scss index 256119809..6113efbb5 100644 --- a/src/client/views/nodes/ScriptingBox.scss +++ b/src/client/views/nodes/ScriptingBox.scss @@ -22,7 +22,7 @@ display: flex; flex-direction: row; justify-content: center; - overflow-y: scroll; + overflow-y: hidden; .scriptingBox-textArea { flex: 70; @@ -32,53 +32,43 @@ resize: none; padding: 7px; overflow-y: scroll; + overflow-x: hidden; body { font-family: Arial, Helvetica, sans-serif; border: 1px solid red; - } - + } + .rta { position: relative; - font-size: 18px; + font-size: 12px; width: 100%; height: 100%; margin-bottom: 60px !important; - } - .rta__loader.rta__loader--empty-suggestion-data { - border-radius: 3px; - box-shadow: 0 0 5px rgba(27, 31, 35, 0.1); - padding: 5px; - } - .rta--loading .rta__loader.rta__loader--suggestion-data { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: rgba(255, 255, 255, 0.8); - } - .rta--loading .rta__loader.rta__loader--suggestion-data > * { - position: relative; - top: 50%; - } - .rta__textarea { + overflow-y: scroll; + font-size: 9px; + } + + .rta__textarea { width: 100%; height: 100%; - font-size: 1em; - } - .rta__autocomplete { + font-size: 10px; + } + + .rta__autocomplete { position: absolute; display: block; margin-top: 1em; - } - .rta__autocomplete--top { + } + + .rta__autocomplete--top { margin-top: 0; margin-bottom: 1em; max-height: 100px; overflow-y: auto; - } - .rta__list { + } + + .rta__list { margin: 0; padding: 0; background: #fff; @@ -86,28 +76,30 @@ border-radius: 3px; box-shadow: 0 0 5px rgba(27, 31, 35, 0.1); list-style: none; - } - .rta__entity { + overflow-y: scroll; + } + + .rta__entity { background: white; width: 100%; text-align: left; outline: none; - } - .rta__entity:hover { + } + + .rta__entity:hover { cursor: pointer; - } - .rta__item:not(:last-child) { - border-bottom: 1px solid #dfe2e5; - } - .rta__entity > * { + } + + .rta__entity>* { padding-left: 4px; padding-right: 4px; - } - .rta__entity--selected { + } + + .rta__entity--selected { color: #fff; text-decoration: none; background: #0366d6; - } + } } .scriptingBox-plist { diff --git a/src/client/views/nodes/ScriptingBox.tsx b/src/client/views/nodes/ScriptingBox.tsx index b0f7b3993..72c92f00b 100644 --- a/src/client/views/nodes/ScriptingBox.tsx +++ b/src/client/views/nodes/ScriptingBox.tsx @@ -38,18 +38,62 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent p.split(":")[0].trim()); } - @computed get paramsTypes() { return this.compileParams.map(p => p.split(":")[1].trim()); } - @computed get rawScript() { return StrCast(this.dataDoc[this.props.fieldKey + "-rawScript"], ""); } - @computed get compileParams() { return Cast(this.dataDoc[this.props.fieldKey + "-params"], listSpec("string"), []); } + @computed({ keepAlive: true }) get paramsNames() { return this.compileParams.map(p => p.split(":")[0].trim()); } + @computed({ keepAlive: true }) get paramsTypes() { return this.compileParams.map(p => p.split(":")[1].trim()); } + @computed({ keepAlive: true }) get rawScript() { return StrCast(this.dataDoc[this.props.fieldKey + "-rawScript"], ""); } + @computed({ keepAlive: true }) get compileParams() { return Cast(this.dataDoc[this.props.fieldKey + "-params"], listSpec("string"), []); } set rawScript(value) { this.dataDoc[this.props.fieldKey + "-rawScript"] = value; } set compileParams(value) { this.dataDoc[this.props.fieldKey + "-params"] = new List(value); } + // WORK ON THIS + // in: global, description, params + @computed get _descriptions() { + const descrip: string[] = []; + let value = ""; + this._scriptKeys.forEach((element: any) => { + const result = this._scriptGlobals[element]; + if (typeof result === "object") { + const d = result[1]; + if (d !== undefined) { + value = d; + } else { + value = ""; + } + } else { + value = ""; + } + descrip.push(value); + }); + return descrip; + } + + @computed get _scriptParams() { + const params: string[] = []; + let value = ""; + this._scriptKeys.forEach((element: any) => { + const result = this._scriptGlobals[element]; + if (typeof result === "object") { + const p = result[2]; + if (p !== undefined) { + value = StrCast(p); + } else { + value = ""; + } + } else { + value = ""; + } + params.push(value); + }); + return params; + } + @action componentDidMount() { this.rawScript = ScriptCast(this.dataDoc[this.props.fieldKey])?.script?.originalScript ?? this.rawScript; @@ -307,16 +351,32 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent { + // if (element.indexOf(this._currWord) >= 0) { + // this._suggestions.push(StrCast(element)); + // } + // }); + + // console.log(this._suggestions); + // return (this._suggestions); + // } + + @action + handleToken(str: string) { + + this._currWord = str; this._suggestions = []; this._scriptKeys.forEach((element: string) => { - if (element.indexOf(this._currWord) >= 0) { + if (element.toLowerCase().indexOf(this._currWord.toLowerCase()) >= 0) { this._suggestions.push(StrCast(element)); } }); @@ -326,23 +386,67 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent { - if (element.indexOf(this._currWord) >= 0) { - this._suggestions.push(StrCast(element)); - } - }); + const index = this._scriptKeys.indexOf(this._currWord); + const params = StrCast(this._scriptParams[index]); + + this._suggestions.push(params); console.log(this._suggestions); + return (this._suggestions); } + + getDescription(value: string) { + const index = this._scriptKeys.indexOf(value); + const descrip = this._descriptions[index]; + let display = ""; + if (descrip !== undefined) { + if (descrip.length > 0) { + display = descrip; + } + } + return display; + } + + getParams(value: string) { + const index = this._scriptKeys.indexOf(value); + const descrip = this._scriptParams[index]; + let display = ""; + if (descrip !== undefined) { + if (descrip.length > 0) { + display = descrip; + } + } + return display; + } + + setHovered(bool: boolean) { + this._hovered = bool; + } + + returnParam(item: string) { + const params = item.split(","); + let value = ""; + let first = true; + params.forEach((element) => { + if (first) { + value = element.split(":")[0].trim(); + first = false; + } else { + value = value + ", " + element.split(":")[0].trim(); + } + }); + return value; + } + textarea: any; - @computed get renderScriptingBox() { + @computed({ keepAlive: true }) get renderScriptingBox() { return 0 ? "70%" : "100%", resize: "none", height: "100%" }} movePopupAsYouType={true} loadingComponent={() => Loading} - ref={(rta: any) => { this.rta = rta; }} + + ref={(rta) => { this.rta = rta; }} //innerRef={textarea => { this.rawScript = textarea.value; }} minChar={0} - // ISSUE IS HEERE, doesn't display entity in a menu, prints hello for reach item in the list trigger={{ " ": { dataProvider: (token: any) => this.handleToken(token), + component: ({ entity: value }) => +
this.setHovered(true)} + onMouseLeave={() => this.setHovered(false)}> + {value} +
+ {this._hovered ?
{this.getDescription(value)}
: (null)} + {this._hovered ?
{this.getParams(value)}
: (null)} +
+ , + output: (item: any, trigger) => trigger + item.trim(), + }, + + "(": { + dataProvider: (token: any) => this.handleFunc(this.rta.getCaretPosition()), component: ({ entity: value }) =>
{value}
, - //afterWhitespace: true, - output: (item: any) => item, + output: (item: any) => "(" + this.returnParam(item) + ")", } + }} onCaretPositionChange={(number: any) => null} //this.handleKeyPress(number)} @@ -374,7 +494,7 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent @@ -467,7 +587,7 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent
this.props.isSelected(true) && e.stopPropagation()}> - {!this._applied ? this.renderScriptingInputs() : this.renderParamsInputs()} + {!this._applied ? this.renderScriptingInputs : this.renderParamsInputs()} {!this._applied ? this.renderScriptingTools() : this.renderParamsTools()}
-- cgit v1.2.3-70-g09d2