From 551ef2a117325faf90fd9f8087e9ffba39f7322e Mon Sep 17 00:00:00 2001 From: Zachary Zhang Date: Thu, 6 Jun 2024 15:18:42 -0400 Subject: bug fixes --- src/client/views/nodes/DiagramBox.scss | 27 ++++++++++------- src/client/views/nodes/DiagramBox.tsx | 54 +++++++++++++++++++++++++++++----- 2 files changed, 64 insertions(+), 17 deletions(-) (limited to 'src') diff --git a/src/client/views/nodes/DiagramBox.scss b/src/client/views/nodes/DiagramBox.scss index d2749f1ad..58a98cc59 100644 --- a/src/client/views/nodes/DiagramBox.scss +++ b/src/client/views/nodes/DiagramBox.scss @@ -1,4 +1,4 @@ -.DIYNodeBox { +.DiagramBox { width: 100%; height: 100%; display: flex; @@ -6,7 +6,7 @@ align-items: center; justify-content: center; - .DIYNodeBox-wrapper { + .DiagramBox-wrapper { width: 100%; height: 100%; display: flex; @@ -26,18 +26,27 @@ .search-bar { display: flex; + flex-wrap: wrap; justify-content: center; align-items: center; width: 100%; padding: 10px; - input[type="text"] { + textarea { flex: 1; + height:5px; margin-right: 10px; + min-height: 20px; + height:auto; + resize:none; + overflow: hidden; } button { padding: 5px 10px; + width:80px; + height:30px; + border-radius: 10px; } } @@ -56,18 +65,16 @@ width:100%; height:100%; svg{ - flex: 1; - display: flex; - justify-content: center; - align-items: center; - width:100%; - height:100%; + max-width: none !important; } } } .loading-circle { - position: relative; + position: absolute; + display:flex; + align-items: center; + justify-content: center; width: 50px; height: 50px; border-radius: 50%; diff --git a/src/client/views/nodes/DiagramBox.tsx b/src/client/views/nodes/DiagramBox.tsx index 32969fa53..cd58ef846 100644 --- a/src/client/views/nodes/DiagramBox.tsx +++ b/src/client/views/nodes/DiagramBox.tsx @@ -33,7 +33,7 @@ export class DiagramBox extends ViewBoxAnnotatableComponent() { @observable errorMessage = ''; @observable mermaidCode = ''; - @action handleInputChange = (e: React.ChangeEvent) => { + @action handleInputChange = (e: React.ChangeEvent) => { this.inputValue = e.target.value; }; async componentDidMount() { @@ -41,9 +41,11 @@ export class DiagramBox extends ViewBoxAnnotatableComponent() { mermaid.initialize({ securityLevel: 'loose', startOnLoad: true, - flowchart: { useMaxWidth: true, htmlLabels: true, curve: 'cardinal' }, + darkMode: true, + flowchart: { useMaxWidth: false, htmlLabels: true, curve: 'cardinal' }, + gantt: { barGap: 1 }, }); - this.mermaidCode = 'asdasdasd'; + this.mermaidCode = 'a'; const docArray: Doc[] = DocListCast(this.Document.data); let mermaidCodeDoc = docArray.filter(doc => doc.type === 'rich text'); mermaidCodeDoc = mermaidCodeDoc.filter(doc => (doc.text as RichTextField).Text === 'mermaidCodeTitle'); @@ -68,12 +70,21 @@ export class DiagramBox extends ViewBoxAnnotatableComponent() { }); } console.log(this.Document.title); + this.renderMermaidAsync(this.timeline); // this is so that ever time a new doc, text node or ink node, is created, this.createMermaidCode will run which will create a save reaction( () => DocListCast(this.Document.data), () => this.convertDrawingToMermaidCode(), { fireImmediately: true } ); + reaction( + () => + DocListCast(this.Document.data) + .filter(doc => doc.type === 'rich text') + .map(doc => (doc.text as RichTextField).Text), + () => this.convertDrawingToMermaidCode(), + { fireImmediately: true } + ); } renderMermaid = async (str: string) => { try { @@ -101,6 +112,7 @@ export class DiagramBox extends ViewBoxAnnotatableComponent() { } } @action handleRenderClick = () => { + this.mermaidCode = ''; this.generateMermaidCode(); }; @action async generateMermaidCode() { @@ -261,13 +273,41 @@ export class DiagramBox extends ViewBoxAnnotatableComponent() { } return false; }; - + autoResize(element: HTMLTextAreaElement): void { + element.style.height = '5px'; + element.style.height = element.scrollHeight + 'px'; + } + timeline = `gantt + title College Timeline + dateFormat YYYY-MM-DD + section Semester 1 + Orientation :done, des1, 2023-08-01, 2023-08-03 + Classes Start :active, des2, 2023-08-04, 2023-12-15 + Midterm Exams : des3, 2023-10-15, 2023-10-20 + End of Semester : des4, 2023-12-16, 2023-12-20 + section Semester 2 + Classes Start : des5, 2024-01-10, 2024-05-15 + Spring Break : des6, 2024-03-15, 2024-03-22 + Midterm Exams : des7, 2024-03-25, 2024-03-30 + Final Exams : des8, 2024-05-10, 2024-05-15 + section Summer Break + Internship : des9, 2024-06-01, 2024-08-31 + section Semester 3 + Classes Start : des10, 2024-09-01, 2025-12-15 + Midterm Exams : des11, 2024-11-15, 2024-11-20 + End of Semester : des12, 2025-12-16, 2025-12-20 + section Semester 4 + Classes Start : des13, 2025-01-10, 2025-05-15 + Spring Break : des14, 2025-03-15, 2025-03-22 + Midterm Exams : des15, 2025-03-25, 2025-03-30 + Final Exams : des16, 2025-05-10, 2025-05-15 + Graduation : des17, 2025-05-20, 2025-05-21`; render() { return ( -
-
+
+
- + + readOnly={this._frontSide}> {this._loading ? (
@@ -812,7 +757,7 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent() Evaluate Pronunciation - {!this.frontSide ? ( + {!this._frontSide ? ( diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index ae9e70e8d..509a0c8d7 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -25,7 +25,7 @@ import { Networking } from '../../Network'; import { DragManager } from '../../util/DragManager'; import { dropActionType } from '../../util/DropActionTypes'; import { SnappingManager } from '../../util/SnappingManager'; -import { undoBatch } from '../../util/UndoManager'; +import { undoable, undoBatch } from '../../util/UndoManager'; import { CollectionFreeFormView } from '../collections/collectionFreeForm/CollectionFreeFormView'; import { ContextMenu } from '../ContextMenu'; import { ContextMenuProps } from '../ContextMenuItem'; @@ -195,8 +195,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent() { const images = await this.fetchImages(); }; - @undoBatch - drop = (e: Event, de: DragManager.DropEvent) => { + drop = undoable((e: Event, de: DragManager.DropEvent) => { if (de.complete.docDragData) { let added: boolean | undefined; const targetIsBullseye = (ele: HTMLElement): boolean => { @@ -225,7 +224,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent() { return added; } return false; - }; + }, 'image drop'); @undoBatch resolution = () => { -- cgit v1.2.3-70-g09d2 From 509c0a3735b324dec2aa18732bb6c5d0172e36f8 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 08:38:13 -0400 Subject: restored typescriptlib --- src/client/util/Scripting.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/client/util/Scripting.ts b/src/client/util/Scripting.ts index 68dab8f99..c63d3d7cb 100644 --- a/src/client/util/Scripting.ts +++ b/src/client/util/Scripting.ts @@ -1,7 +1,7 @@ // export const ts = (window as any).ts; // import * as typescriptlib from '!!raw-loader!../../../node_modules/typescript/lib/lib.d.ts' // import * as typescriptes5 from '!!raw-loader!../../../node_modules/typescript/lib/lib.es5.d.ts' -//import typescriptlib from 'type_decls.d'; +import typescriptlib from 'type_decls.d'; import * as ts from 'typescript'; import { Doc, FieldType } from '../../fields/Doc'; import { RefField } from '../../fields/RefField'; @@ -248,7 +248,7 @@ export function CompileScript(script: string, options: ScriptOptions = {}): Comp const funcScript = `(function(${paramString})${reqTypes} { ${body} })`; host.writeFile('file.ts', funcScript); - //if (typecheck) host.writeFile('node_modules/typescript/lib/lib.d.ts', typescriptlib); + if (typecheck) host.writeFile('node_modules/typescript/lib/lib.d.ts', typescriptlib); const program = ts.createProgram(['file.ts'], {}, host); const testResult = program.emit(); const outputText = host.readFile('file.js'); -- cgit v1.2.3-70-g09d2 From fa17eee93e43e2a06565045557e01a3687fb2505 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 08:51:21 -0400 Subject: fixed contextmenu issue with nothing selected. --- src/client/views/ContextMenu.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx index 5edb5fc0d..399e8a238 100644 --- a/src/client/views/ContextMenu.tsx +++ b/src/client/views/ContextMenu.tsx @@ -252,7 +252,7 @@ export class ContextMenu extends ObservableReactComponent<{ noexpand?: boolean } this._selectedIndex--; } e.preventDefault(); - } else if (e.key === 'Enter' || e.key === 'Tab') { + } else if ((e.key === 'Enter' || e.key === 'Tab') && this._selectedIndex >= 0) { const item = this.flatItems[this._selectedIndex]; if (item.event) { item.event({ x: this.pageX, y: this.pageY }); -- cgit v1.2.3-70-g09d2 From e1d26d7d98962572f020e55c88e6c9e63a7dfa8a Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 11:58:55 -0400 Subject: fixed eraser mode button to show current eraser and to show options. --- package-lock.json | 8 ++++---- package.json | 2 +- src/client/util/CurrentUserUtils.ts | 14 ++++++-------- src/client/views/MainView.tsx | 1 - src/client/views/global/globalScripts.ts | 5 +++-- src/client/views/nodes/FontIconBox/FontIconBox.tsx | 4 ++-- src/client/views/nodes/formattedText/RichTextMenu.tsx | 12 +++++++----- src/fields/InkField.ts | 1 + 8 files changed, 24 insertions(+), 23 deletions(-) (limited to 'src') diff --git a/package-lock.json b/package-lock.json index 7e89f8bb6..c5b251164 100644 --- a/package-lock.json +++ b/package-lock.json @@ -70,7 +70,7 @@ "body-parser": "^1.20.2", "bootstrap": "^5.3.2", "brotli": "^1.3.3", - "browndash-components": "^0.1.49", + "browndash-components": "^0.1.50", "browser-assert": "^1.2.1", "bson": "^6.2.0", "canvas": "^2.11.2", @@ -11491,9 +11491,9 @@ } }, "node_modules/browndash-components": { - "version": "0.1.49", - "resolved": "https://registry.npmjs.org/browndash-components/-/browndash-components-0.1.49.tgz", - "integrity": "sha512-XSW7XLSIml4qhDCHROzVTCzNgd878ndNQU8zC/M+UZqTyFCDLPGV5eo546IZ8QqEFOjUCp7jmzJS6jUcOeQ4HQ==", + "version": "0.1.50", + "resolved": "https://registry.npmjs.org/browndash-components/-/browndash-components-0.1.50.tgz", + "integrity": "sha512-8EgU82os8/Tg3gayh+nYXCQZ8P7GGQWnibz0U2RM0sXTbc3BWTSYiC1Sj1VpL7HPkZ1KMGHzWynCo9QKIOWZBg==", "dependencies": { "@emotion/react": "^11.11.1", "@emotion/styled": "^11.11.0", diff --git a/package.json b/package.json index cb4491497..4ede14770 100644 --- a/package.json +++ b/package.json @@ -149,7 +149,7 @@ "body-parser": "^1.20.2", "bootstrap": "^5.3.2", "brotli": "^1.3.3", - "browndash-components": "^0.1.49", + "browndash-components": "^0.1.50", "browser-assert": "^1.2.1", "bson": "^6.2.0", "canvas": "^2.11.2", diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index a340ea4e3..b316944d1 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -381,9 +381,7 @@ pie title Minerals in my tap water ]; emptyThings.forEach( - thing =>{ DocUtils.AssignDocField(doc, "empty"+thing.key, (opts) => thing.creator(opts), {...standardOps(thing.key), ...thing.opts}, undefined, thing.scripts, thing.funcs); - console.log(thing.key) - }); + thing => DocUtils.AssignDocField(doc, "empty"+thing.key, (opts) => thing.creator(opts), {...standardOps(thing.key), ...thing.opts}, undefined, thing.scripts, thing.funcs)); return [ { toolTip: "Tap or drag to create a note", title: "Note", icon: "sticky-note", dragFactory: doc.emptyNote as Doc, clickFactory: DocCast(doc.emptyNote)}, @@ -740,12 +738,12 @@ pie title Minerals in my tap water static inkTools():Button[] { return [ - { title: "Pen", toolTip: "Pen (Ctrl+P)", btnType: ButtonType.ToggleButton, icon: "pen-nib", toolType: "pen", scripts: {onClick:'{ return setActiveTool(this.toolType, false, _readOnly_);}' }}, - { title: "Write", toolTip: "Write (Ctrl+Shift+P)", btnType: ButtonType.ToggleButton, icon: "pen", toolType: "write", scripts: {onClick:'{ return setActiveTool(this.toolType, false, _readOnly_);}' }, funcs: {hidden:"IsNoviceMode()" }}, - { title: "Eraser", toolTip: "Eraser (Ctrl+E)", btnType: ButtonType.MultiToggleButton, scripts: {onClick: '{ return setActiveTool(this.toolType, false, _readOnly_);}'}, funcs: {toolType:"activeEraserTool()"}, + { title: "Pen", toolTip: "Pen (Ctrl+P)", btnType: ButtonType.ToggleButton, icon: "pen-nib", toolType: "pen", scripts: {onClick:'{ return setActiveTool(this.toolType, false, _readOnly_);}' }}, + { title: "Write", toolTip: "Write (Ctrl+Shift+P)", btnType: ButtonType.ToggleButton, icon: "pen", toolType: "write", scripts: {onClick:'{ return setActiveTool(this.toolType, false, _readOnly_);}' }, funcs: {hidden:"IsNoviceMode()" }}, + { title: "Eraser", toolTip: "Eraser (Ctrl+E)", btnType: ButtonType.MultiToggleButton, toolType: InkTool.Eraser, scripts: {onClick:'{ return setActiveTool(this.toolType, false, _readOnly_);}' }, subMenu: [ { title: "Stroke", toolTip: "Stroke Erase", btnType: ButtonType.ToggleButton, icon: "eraser", toolType:InkTool.StrokeEraser, ignoreClick: true, scripts: {onClick: '{ return setActiveTool(this.toolType, false, _readOnly_);}'} }, - { title: "Segment", toolTip: "Segment Erase", btnType: ButtonType.ToggleButton, icon: "xmark",toolType:InkTool.SegmentEraser,ignoreClick: true, scripts: {onClick: '{ return setActiveTool(this.toolType, false, _readOnly_);}'} }, + { title: "Segment", toolTip: "Segment Erase", btnType: ButtonType.ToggleButton, icon: "xmark", toolType:InkTool.SegmentEraser,ignoreClick: true, scripts: {onClick: '{ return setActiveTool(this.toolType, false, _readOnly_);}'} }, { title: "Radius", toolTip: "Radius Erase", btnType: ButtonType.ToggleButton, icon: "circle-xmark",toolType:InkTool.RadiusEraser, ignoreClick: true, scripts: {onClick: '{ return setActiveTool(this.toolType, false, _readOnly_);}'} }, ]}, { title: "Eraser Width", toolTip: "Eraser Width", btnType: ButtonType.NumberSliderButton, toolType: "eraserWidth", ignoreClick: true, scripts: {script: '{ return setInkProperty(this.toolType, value, _readOnly_);}'}, numBtnMin: 1, funcs: {hidden:"NotRadiusEraser()"}}, @@ -801,7 +799,7 @@ pie title Minerals in my tap water { title: "Num", icon:"", toolTip: "Frame # (click to toggle edit mode)",btnType: ButtonType.TextButton, expertMode: true, toolType:CollectionViewType.Freeform, funcs: {hidden: '!SelectedDocType(this.toolType, this.expertMode)', buttonText: 'selectedDocs()?.lastElement()?.currentFrame?.toString()'}, width: 20, scripts: { onClick: '{ return curKeyFrame(_readOnly_);}'}}, { title: "Fwd", icon: "chevron-right", toolTip: "Next Animation Frame", btnType: ButtonType.ClickButton, expertMode: true, toolType:CollectionViewType.Freeform, funcs: {hidden: '!SelectedDocType(this.toolType, this.expertMode)'}, width: 30, scripts: { onClick: 'nextKeyFrame(_readOnly_)'}}, - { title: "Filter", icon: "=", toolTip: "Filter cards by tags", subMenu: CurrentUserUtils.tagGroupTools(),ignoreClick:true, toolType:DocumentType.COL, funcs: {hidden: '!SelectedDocType(this.toolType, this.expertMode)'}, btnType: ButtonType.MultiToggleButton, width: 30, backgroundColor: doc.userVariantColor}, + { title: "Filter", icon: "=", toolTip: "Filter cards by tags", subMenu: CurrentUserUtils.tagGroupTools(),ignoreClick:true, toolType:DocumentType.COL, funcs: {hidden: '!SelectedDocType(this.toolType, this.expertMode)'}, btnType: ButtonType.MultiToggleButton, width: 30, backgroundColor: doc.userVariantColor as string}, { title: "Text", icon: "Text", toolTip: "Text functions", subMenu: CurrentUserUtils.textTools(), expertMode: false, toolType:DocumentType.RTF, funcs: { linearView_IsOpen: `SelectedDocType(this.toolType, this.expertMode)`} }, // Always available { title: "Ink", icon: "Ink", toolTip: "Ink functions", subMenu: CurrentUserUtils.inkTools(), expertMode: false, toolType:DocumentType.INK, funcs: {hidden: `IsExploreMode()`, linearView_IsOpen: `SelectedDocType(this.toolType, this.expertMode)`}, scripts: { onClick: 'setInkToolDefaults()'} }, // Always available { title: "Doc", icon: "Doc", toolTip: "Freeform Doc tools", subMenu: CurrentUserUtils.freeTools(), expertMode: false, toolType:CollectionViewType.Freeform, funcs: {hidden: `!SelectedDocType(this.toolType, this.expertMode, true)`, linearView_IsOpen: `SelectedDocType(this.toolType, this.expertMode)`} }, // Always available diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index 5285e67f6..a956f084d 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -838,7 +838,6 @@ export class MainView extends ObservableReactComponent { }; @computed get mainInnerContent() { - trace(); const leftMenuFlyoutWidth = this._leftMenuFlyoutWidth + this.leftMenuWidth(); const width = this.propertiesWidth() + leftMenuFlyoutWidth; return ( diff --git a/src/client/views/global/globalScripts.ts b/src/client/views/global/globalScripts.ts index 7f6c726d6..695f929d8 100644 --- a/src/client/views/global/globalScripts.ts +++ b/src/client/views/global/globalScripts.ts @@ -451,10 +451,11 @@ export function createInkGroup(/* inksToGroup?: Doc[], isSubGroup?: boolean */) CollectionFreeFormView.collectionsWithUnprocessedInk.clear(); } -function setActiveTool(tool: InkTool | Gestures, keepPrim: boolean, checkResult?: boolean) { +function setActiveTool(toolIn: InkTool | Gestures, keepPrim: boolean, checkResult?: boolean) { InkTranscription.Instance?.createInkGroup(); + const tool = toolIn === InkTool.Eraser ? Doc.UserDoc().activeEraserTool : toolIn; if (checkResult) { - return (Doc.ActiveTool === tool && !GestureOverlay.Instance?.InkShape) || GestureOverlay.Instance?.InkShape === tool + return ((Doc.ActiveTool === tool || (Doc.UserDoc().activeEraserTool === tool && (tool === toolIn || Doc.ActiveTool === tool))) && !GestureOverlay.Instance?.InkShape) || GestureOverlay.Instance?.InkShape === tool ? GestureOverlay.Instance?.KeepPrimitiveMode || ![Gestures.Circle, Gestures.Line, Gestures.Rectangle].includes(tool as Gestures) : false; } diff --git a/src/client/views/nodes/FontIconBox/FontIconBox.tsx b/src/client/views/nodes/FontIconBox/FontIconBox.tsx index aa40b14aa..b7e1350ca 100644 --- a/src/client/views/nodes/FontIconBox/FontIconBox.tsx +++ b/src/client/views/nodes/FontIconBox/FontIconBox.tsx @@ -262,7 +262,7 @@ export class FontIconBox extends ViewBoxBaseComponent() { const tooltip: string = StrCast(this.Document.toolTip); const script = ScriptCast(this.Document.onClick)?.script; - const toggleStatus = script?.run({ this: this.Document, self: this.Document, value: undefined, _readOnly_: true }).result as boolean; + const toggleStatus = script?.run({ this: this.Document, value: undefined, _readOnly_: true }).result as boolean; // Colors const color = this._props.styleProvider?.(this.layoutDoc, this._props, StyleProp.Color) as string; const background = this._props.styleProvider?.(this.layoutDoc, this._props, StyleProp.BackgroundColor) as string; @@ -276,7 +276,7 @@ export class FontIconBox extends ViewBoxBaseComponent() { background={background === SnappingManager.userBackgroundColor ? undefined : background} multiSelect={true} onPointerDown={e => script && !toggleStatus && setupMoveUpEvents(this, e, returnFalse, emptyFunction, () => script.run({ this: this.Document, value: undefined, _readOnly_: false }))} - isToggle={script ? true : false} + isToggle={false} toggleStatus={toggleStatus} label={this.label} items={items.map(item => ({ diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx index 738f6d699..1560d51a1 100644 --- a/src/client/views/nodes/formattedText/RichTextMenu.tsx +++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx @@ -1,6 +1,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { Tooltip } from '@mui/material'; -import { action, computed, IReactionDisposer, makeObservable, observable } from 'mobx'; +import { action, computed, IReactionDisposer, makeObservable, observable, runInAction } from 'mobx'; import { observer } from 'mobx-react'; import { lift, toggleMark, wrapIn } from 'prosemirror-commands'; import { Mark, MarkType } from 'prosemirror-model'; @@ -68,10 +68,12 @@ export class RichTextMenu extends AntimodeMenu { constructor(props: AntimodeMenuProps) { super(props); makeObservable(this); - RichTextMenu._instance.menu = this; - this.updateMenu(undefined, undefined, props, this.layoutDoc); - this._canFade = false; - this.Pinned = true; + runInAction(() => { + RichTextMenu._instance.menu = this; + this.updateMenu(undefined, undefined, props, this.layoutDoc); + this._canFade = false; + this.Pinned = true; + }); } @computed get noAutoLink() { diff --git a/src/fields/InkField.ts b/src/fields/InkField.ts index ad524f73f..dc3e08414 100644 --- a/src/fields/InkField.ts +++ b/src/fields/InkField.ts @@ -14,6 +14,7 @@ export enum InkTool { StrokeEraser = 'strokeeraser', SegmentEraser = 'segmenteraser', RadiusEraser = 'radiuseraser', + Eraser = 'eraser', // not a real tool, but a class of tools Stamp = 'stamp', Write = 'write', PresentationPin = 'presentationpin', -- cgit v1.2.3-70-g09d2 From 8c1f6f03de08e442df90dfbb6c9049e1c15ae353 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 12:27:20 -0400 Subject: don't unset activeTool in smartDraw handler and don't do anything if smartDraw is not shown --- src/client/views/smartdraw/SmartDrawHandler.tsx | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) (limited to 'src') diff --git a/src/client/views/smartdraw/SmartDrawHandler.tsx b/src/client/views/smartdraw/SmartDrawHandler.tsx index e362c0c89..d45baa7c5 100644 --- a/src/client/views/smartdraw/SmartDrawHandler.tsx +++ b/src/client/views/smartdraw/SmartDrawHandler.tsx @@ -148,15 +148,16 @@ export class SmartDrawHandler extends ObservableReactComponent { */ @action hideSmartDrawHandler = () => { - this.ShowRegenerate = false; - this._display = false; - this._isLoading = false; - this._showOptions = false; - this._userInput = ''; - this._complexity = 5; - this._size = 350; - this._autoColor = true; - Doc.ActiveTool = InkTool.None; + if (this._display) { + this.ShowRegenerate = false; + this._display = false; + this._isLoading = false; + this._showOptions = false; + this._userInput = ''; + this._complexity = 5; + this._size = 350; + this._autoColor = true; + } }; /** -- cgit v1.2.3-70-g09d2 From a42cb938460f02aff22b0600ffde9dc70b6888ed Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 12:28:02 -0400 Subject: from last --- src/client/views/smartdraw/SmartDrawHandler.tsx | 1 + 1 file changed, 1 insertion(+) (limited to 'src') diff --git a/src/client/views/smartdraw/SmartDrawHandler.tsx b/src/client/views/smartdraw/SmartDrawHandler.tsx index d45baa7c5..a77092a1a 100644 --- a/src/client/views/smartdraw/SmartDrawHandler.tsx +++ b/src/client/views/smartdraw/SmartDrawHandler.tsx @@ -157,6 +157,7 @@ export class SmartDrawHandler extends ObservableReactComponent { this._complexity = 5; this._size = 350; this._autoColor = true; + Doc.ActiveTool = InkTool.None; } }; -- cgit v1.2.3-70-g09d2 From fd114aefcbff5ad7b62aae914ca3336bc17da9d2 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 12:31:43 -0400 Subject: resotre typesriptlib --- src/client/util/Scripting.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/client/util/Scripting.ts b/src/client/util/Scripting.ts index cb314e3f1..c63d3d7cb 100644 --- a/src/client/util/Scripting.ts +++ b/src/client/util/Scripting.ts @@ -1,7 +1,7 @@ // export const ts = (window as any).ts; // import * as typescriptlib from '!!raw-loader!../../../node_modules/typescript/lib/lib.d.ts' // import * as typescriptes5 from '!!raw-loader!../../../node_modules/typescript/lib/lib.es5.d.ts' -// import typescriptlib from 'type_decls.d'; +import typescriptlib from 'type_decls.d'; import * as ts from 'typescript'; import { Doc, FieldType } from '../../fields/Doc'; import { RefField } from '../../fields/RefField'; @@ -248,7 +248,7 @@ export function CompileScript(script: string, options: ScriptOptions = {}): Comp const funcScript = `(function(${paramString})${reqTypes} { ${body} })`; host.writeFile('file.ts', funcScript); - // if (typecheck) host.writeFile('node_modules/typescript/lib/lib.d.ts', typescriptlib); + if (typecheck) host.writeFile('node_modules/typescript/lib/lib.d.ts', typescriptlib); const program = ts.createProgram(['file.ts'], {}, host); const testResult = program.emit(); const outputText = host.readFile('file.js'); -- cgit v1.2.3-70-g09d2 From bb40454262a2d915a334d7a26555d25d649d4317 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 12:59:36 -0400 Subject: fixed ink transcription to appear in the correct place. added transcription of selected ink. --- src/client/views/DocumentButtonBar.tsx | 1 - src/client/views/InkTranscription.tsx | 18 ++++++------------ src/client/views/InkingStroke.tsx | 18 ++++++++++++++++-- 3 files changed, 22 insertions(+), 15 deletions(-) (limited to 'src') diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx index 28424c711..32bf67df1 100644 --- a/src/client/views/DocumentButtonBar.tsx +++ b/src/client/views/DocumentButtonBar.tsx @@ -28,7 +28,6 @@ import { DocumentLinksButton } from './nodes/DocumentLinksButton'; import { DocumentView } from './nodes/DocumentView'; import { OpenWhere } from './nodes/OpenWhere'; import { DashFieldView } from './nodes/formattedText/DashFieldView'; -import { AnnotationPalette } from './smartdraw/AnnotationPalette'; @observer export class DocumentButtonBar extends ObservableReactComponent<{ views: () => (DocumentView | undefined)[]; stack?: unknown }> { diff --git a/src/client/views/InkTranscription.tsx b/src/client/views/InkTranscription.tsx index 8698a6962..c6b55d55a 100644 --- a/src/client/views/InkTranscription.tsx +++ b/src/client/views/InkTranscription.tsx @@ -386,21 +386,15 @@ export class InkTranscription extends React.Component { ); docView.props.removeDocument?.(selected); // Gets a collection based on the selected nodes using a marquee view ref - const newCollection = MarqueeView.getCollection(selected, undefined, true, { top: 1, left: 1, width: 1, height: 1 }); - if (newCollection) { - newCollection.width = NumCast(newCollection._width); - newCollection.height = NumCast(newCollection._height); - // if the grouping we are creating is an individual word - if (word) { - newCollection.title = word; - } + const newCollection = MarqueeView.getCollection(selected, undefined, true, marqViewRef?.Bounds ?? { top: 1, left: 1, width: 1, height: 1 }); + // if the grouping we are creating is an individual word + if (word) { + newCollection.title = word; } // nda - bug: when deleting a stroke before leaving writing mode, delete the stroke from unprocessed ink docs - if (newCollection) { - docView.props.addDocument?.(newCollection); - newCollection.hasTextBox = false; - } + docView.props.addDocument?.(newCollection); + newCollection.hasTextBox = false; return newCollection; } diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx index 177400882..bc2b4badb 100644 --- a/src/client/views/InkingStroke.tsx +++ b/src/client/views/InkingStroke.tsx @@ -48,6 +48,9 @@ import { FormattedTextBox, FormattedTextBoxProps } from './nodes/formattedText/F import { PinDocView, PinProps } from './PinFuncs'; import { StyleProp } from './StyleProp'; import { ViewBoxInterface } from './ViewBoxInterface'; +import { InkTranscription } from './InkTranscription'; +import { CollectionFreeFormView } from './collections/collectionFreeForm'; +import { DocumentView } from './nodes/DocumentView'; // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports const { INK_MASK_SIZE } = require('./global/globalCssVariables.module.scss'); // prettier-ignore @@ -108,8 +111,19 @@ export class InkingStroke extends ViewBoxAnnotatableComponent() * and the recognized words to the 'handwriting' */ analyzeStrokes = () => { - const data: InkData = this.inkScaledData().inkData ?? []; - CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ['inkAnalysis', 'handwriting'], [data]); + const ffView = CollectionFreeFormView.from(this.DocumentView?.()); + if (ffView) { + const selected = DocumentView.SelectedDocs(); + const newCollection = InkTranscription.Instance.groupInkDocs( + selected.filter(doc => doc.embedContainer), + ffView + ); + ffView.unprocessedDocs = []; + + InkTranscription.Instance.transcribeInk(newCollection, selected, false); + } + // const data: InkData = this.inkScaledData().inkData ?? []; + // CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ['inkAnalysis', 'handwriting'], [data]); }; /** -- cgit v1.2.3-70-g09d2 From 19f0184da33b5080f301baf78cf8e6f6d113d79a Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 14:03:00 -0400 Subject: fixed some lint errors. fixed how drawings are added to pdfs. fixed testing for ink in propertiesView. --- src/client/views/PropertiesView.tsx | 23 ++++++++++------------- src/client/views/pdf/PDFViewer.tsx | 2 +- 2 files changed, 11 insertions(+), 14 deletions(-) (limited to 'src') diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx index fcac4d464..722086aea 100644 --- a/src/client/views/PropertiesView.tsx +++ b/src/client/views/PropertiesView.tsx @@ -18,11 +18,12 @@ import { Id } from '../../fields/FieldSymbols'; import { InkField } from '../../fields/InkField'; import { List } from '../../fields/List'; import { ComputedField } from '../../fields/ScriptField'; -import { BoolCast, Cast, DocCast, NumCast, StrCast } from '../../fields/Types'; +import { Cast, DocCast, NumCast, StrCast } from '../../fields/Types'; import { GetEffectiveAcl, SharingPermissions, normalizeEmail } from '../../fields/util'; import { CollectionViewType, DocumentType } from '../documents/DocumentTypes'; import { GroupManager } from '../util/GroupManager'; import { LinkManager } from '../util/LinkManager'; +import { SettingsManager } from '../util/SettingsManager'; import { SharingManager } from '../util/SharingManager'; import { SnappingManager } from '../util/SnappingManager'; import { Transform } from '../util/Transform'; @@ -30,6 +31,7 @@ import { UndoManager, undoBatch, undoable } from '../util/UndoManager'; import { EditableView } from './EditableView'; import { FilterPanel } from './FilterPanel'; import { InkStrokeProperties } from './InkStrokeProperties'; +import { InkingStroke } from './InkingStroke'; import { ObservableReactComponent } from './ObservableReactComponent'; import { PropertiesButtons } from './PropertiesButtons'; import { PropertiesDocBacklinksSelector } from './PropertiesDocBacklinksSelector'; @@ -41,9 +43,6 @@ import { DocumentView } from './nodes/DocumentView'; import { StyleProviderFuncType } from './nodes/FieldView'; import { OpenWhere } from './nodes/OpenWhere'; import { PresBox, PresEffect, PresEffectDirection } from './nodes/trails'; -import { InkingStroke } from './InkingStroke'; -import { SettingsManager } from '../util/SettingsManager'; -import { MarqueeOptionsMenu } from './collections/collectionFreeForm'; import { SmartDrawHandler } from './smartdraw/SmartDrawHandler'; interface PropertiesViewProps { @@ -75,6 +74,10 @@ export class PropertiesView extends ObservableReactComponent { this.openFilters = bool; })} onDoubleClick={this.CloseAll}>
- ); + ); // prettier-ignore } @computed get inkSubMenu() { - this.containsInkDoc = false; return ( - // prettier-ignore <> { this.openAppearance = bool; }} onDoubleClick={this.CloseAll}> {this.selectedLayoutDoc?.layout_isSvg ? this.appearanceEditor : null} @@ -1297,7 +1296,7 @@ export class PropertiesView extends ObservableReactComponent - ); + ); // prettier-ignore } /** @@ -1306,14 +1305,12 @@ export class PropertiesView extends ObservableReactComponent { const childDocs: Doc[] = DocListCast(selectedDoc[DocData].data); - for (var i = 0; i < childDocs.length; i++) { + for (let i = 0; i < childDocs.length; i++) { if (DocumentView.getDocumentView(childDocs[i])?.layoutDoc?.layout_isSvg) { this.inkDoc = childDocs[i]; - this.containsInkDoc = true; return true; } } - this.containsInkDoc = false; return false; }; diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 20719442a..01242ba48 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -430,7 +430,7 @@ export class PDFViewer extends ObservableReactComponent { addDrawingAnnotation = (drawing: Doc) => { // drawing[DocData].x = this._props.pdfBox.ScreenToLocalBoxXf().TranslateX // const scaleX = this._mainCont.current.offsetWidth / boundingRect.width; - drawing.y = (drawing.y as number) + (this._props.Document.data_sidebar_panY as number); + drawing.y = NumCast(drawing.y) + NumCast(this._props.Document.layout_scrollTop); this._props.addDocument?.(drawing); }; -- cgit v1.2.3-70-g09d2 From b4d9626be5dd3fc158fd05589b5deca59a08dd4f Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 14:39:42 -0400 Subject: cleaning up smart drawing menu options. --- src/client/views/InkTranscription.tsx | 4 +- .../collectionFreeForm/CollectionFreeFormView.tsx | 4 +- .../collections/collectionFreeForm/MarqueeView.tsx | 17 +++--- src/client/views/global/globalScripts.ts | 69 +--------------------- src/client/views/smartdraw/SmartDrawHandler.tsx | 5 +- 5 files changed, 14 insertions(+), 85 deletions(-) (limited to 'src') diff --git a/src/client/views/InkTranscription.tsx b/src/client/views/InkTranscription.tsx index c6b55d55a..b4f4ebf63 100644 --- a/src/client/views/InkTranscription.tsx +++ b/src/client/views/InkTranscription.tsx @@ -344,7 +344,7 @@ export class InkTranscription extends React.Component { const bounds: { x: number; y: number; width?: number; height?: number }[] = []; // calculate the necessary bounds from the selected ink docs - selected.map( + selected.forEach( action(d => { const x = NumCast(d.x); const y = NumCast(d.y); @@ -367,7 +367,7 @@ export class InkTranscription extends React.Component { } // map through all the selected ink strokes and create the groupings - selected.map( + selected.forEach( action(d => { const dx = NumCast(d.x); const dy = NumCast(d.y); diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index fe5ced29e..cdcc2328f 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -1246,9 +1246,7 @@ export class CollectionFreeFormView extends CollectionSubView { - // TODO: nda - will probably want to go through ffView unprocessed docs and then see if any of the inksToGroup docs are in it and only use those - const selected = ffView.unprocessedDocs; - // loop through selected an get the bound - const bounds: { x: number; y: number; width?: number; height?: number }[] = []; - - selected.map( - action(d => { - const x = NumCast(d.x); - const y = NumCast(d.y); - const width = NumCast(d._width); - const height = NumCast(d._height); - bounds.push({ x, y, width, height }); - }) - ); - - const aggregBounds = aggregateBounds(bounds, 0, 0); - const marqViewRef = ffView._marqueeViewRef.current; - - // set the vals for bounds in marqueeView - if (marqViewRef) { - marqViewRef._downX = aggregBounds.x; - marqViewRef._downY = aggregBounds.y; - marqViewRef._lastX = aggregBounds.r; - marqViewRef._lastY = aggregBounds.b; - } - - selected.map( - action(d => { - const dx = NumCast(d.x); - const dy = NumCast(d.y); - delete d.x; - delete d.y; - delete d.activeFrame; - delete d._timecodeToShow; // bcz: this should be automatic somehow.. along with any other properties that were logically associated with the original collection - delete d._timecodeToHide; // bcz: this should be automatic somehow.. along with any other properties that were logically associated with the original collection - // calculate pos based on bounds - if (marqViewRef?.Bounds) { - d.x = dx - marqViewRef.Bounds.left - marqViewRef.Bounds.width / 2; - d.y = dy - marqViewRef.Bounds.top - marqViewRef.Bounds.height / 2; - } - return d; - }) - ); - ffView._props.removeDocument?.(selected); - // TODO: nda - this is the code to actually get a new grouped collection - const newCollection = MarqueeView.getCollection(selected, undefined, true, { top: 1, left: 1, width: 1, height: 1 }); - if (newCollection) { - newCollection.height = NumCast(newCollection._height); - newCollection.width = NumCast(newCollection._width); - } - - // nda - bug: when deleting a stroke before leaving writing mode, delete the stroke from unprocessed ink docs - newCollection && ffView._props.addDocument?.(newCollection); - // TODO: nda - will probably need to go through and only remove the unprocessed selected docs - ffView.unprocessedDocs = []; - - // InkTranscription.Instance.transcribeInk(newCollection, selected, false); - }); - } - CollectionFreeFormView.collectionsWithUnprocessedInk.clear(); -} - function setActiveTool(toolIn: InkTool | Gestures, keepPrim: boolean, checkResult?: boolean) { InkTranscription.Instance?.createInkGroup(); const tool = toolIn === InkTool.Eraser ? Doc.UserDoc().activeEraserTool : toolIn; diff --git a/src/client/views/smartdraw/SmartDrawHandler.tsx b/src/client/views/smartdraw/SmartDrawHandler.tsx index a77092a1a..6d1277a08 100644 --- a/src/client/views/smartdraw/SmartDrawHandler.tsx +++ b/src/client/views/smartdraw/SmartDrawHandler.tsx @@ -228,9 +228,8 @@ export class SmartDrawHandler extends ObservableReactComponent { console.error('GPT call failed'); return; } - console.log(res); const strokeData = await this.parseSvg(res, startPt, false, autoColor); - const drawingDoc = strokeData && this.CreateDrawingDoc(strokeData?.data, strokeData?.lastInput, strokeData?.lastRes); + const drawingDoc = strokeData && this.CreateDrawingDoc(strokeData.data, strokeData.lastInput, strokeData.lastRes); drawingDoc && this.AddDrawing(drawingDoc, this._lastInput, res); this._errorOccurredOnce = false; @@ -261,7 +260,7 @@ export class SmartDrawHandler extends ObservableReactComponent { } const strokeData = await this.parseSvg(res, { X: this._lastInput.x, Y: this._lastInput.y }, true, lastInput?.autoColor || this._autoColor); this.RemoveDrawing !== unimplementedFunction && this.RemoveDrawing(true, this._selectedDoc); - const drawingDoc = strokeData && this.CreateDrawingDoc(strokeData?.data, strokeData?.lastInput, strokeData?.lastRes); + const drawingDoc = strokeData && this.CreateDrawingDoc(strokeData.data, strokeData.lastInput, strokeData.lastRes); drawingDoc && this.AddDrawing(drawingDoc, this._lastInput, res); return strokeData; } catch (err) { -- cgit v1.2.3-70-g09d2 From b56d2c2ae115e81fbf7aeaae0d2fed9ba073f11d Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 15:19:52 -0400 Subject: more annopalette related cleanup --- src/client/util/DropConverter.ts | 39 ++++------------------ src/client/views/DocumentDecorations.tsx | 14 ++++---- src/client/views/InkingStroke.tsx | 3 -- .../views/collections/CollectionCarouselView.tsx | 3 +- src/client/views/nodes/DocumentView.tsx | 4 +-- .../views/nodes/formattedText/FormattedTextBox.tsx | 2 +- src/client/views/smartdraw/AnnotationPalette.tsx | 4 +-- src/client/views/smartdraw/SmartDrawHandler.tsx | 23 +++++++++---- 8 files changed, 37 insertions(+), 55 deletions(-) (limited to 'src') diff --git a/src/client/util/DropConverter.ts b/src/client/util/DropConverter.ts index 0ede44298..71cdaa58b 100644 --- a/src/client/util/DropConverter.ts +++ b/src/client/util/DropConverter.ts @@ -5,7 +5,7 @@ import { RichTextField } from '../../fields/RichTextField'; import { ComputedField, ScriptField } from '../../fields/ScriptField'; import { StrCast } from '../../fields/Types'; import { ImageField } from '../../fields/URLField'; -import { Docs } from '../documents/Documents'; +import { Docs, DocumentOptions } from '../documents/Documents'; import { DocumentType } from '../documents/DocumentTypes'; import { ButtonType, FontIconBox } from '../views/nodes/FontIconBox/FontIconBox'; import { DragManager } from './DragManager'; @@ -64,49 +64,24 @@ export function MakeTemplate(doc: Doc) { return doc; } -export function makeUserTemplateButton(doc: Doc) { - const layoutDoc = doc; // doc.layout instanceof Doc && doc.layout.isTemplateForField ? doc.layout : doc; - if (layoutDoc.type !== DocumentType.FONTICON) { - !layoutDoc.isTemplateDoc && makeTemplate(layoutDoc); - } - layoutDoc.isTemplateDoc = true; - const dbox = Docs.Create.FontIconDocument({ - _nativeWidth: 100, - _nativeHeight: 100, - _width: 100, - _height: 100, - backgroundColor: StrCast(doc.backgroundColor), - title: StrCast(layoutDoc.title), - btnType: ButtonType.ClickButton, - icon: 'bolt', - isSystem: false, - }); - dbox.title = ComputedField.MakeFunction('this.dragFactory.title'); - dbox.dragFactory = layoutDoc; - dbox.dropPropertiesToRemove = doc.dropPropertiesToRemove instanceof ObjectField ? ObjectField.MakeCopy(doc.dropPropertiesToRemove) : undefined; - dbox.onDragStart = ScriptField.MakeFunction('getCopy(this.dragFactory)'); - return dbox; -} - /** - * Similar to makeUserTemplateButton, but rather than creating a draggable button for the template, it takes in - * an ImageField that will display. + * Makes a draggable button or image that will create a template doc Instance */ -export function makeUserTemplateImage(doc: Doc, imageHref: string | undefined) { - const image = imageHref ?? 'http://www.cs.brown.edu/~bcz/noImage.png'; +export function makeUserTemplateButtonOrImage(doc: Doc, image: string | undefined) { const layoutDoc = doc; // doc.layout instanceof Doc && doc.layout.isTemplateForField ? doc.layout : doc; if (layoutDoc.type !== DocumentType.FONTICON) { !layoutDoc.isTemplateDoc && makeTemplate(layoutDoc); } layoutDoc.isTemplateDoc = true; - const dbox = Docs.Create.ImageDocument(image, { + const docOptions: DocumentOptions = { _nativeWidth: 100, _nativeHeight: 100, _width: 100, _height: 100, title: StrCast(layoutDoc.title), isSystem: false, - }); + }; + const dbox = image ? Docs.Create.ImageDocument(image, docOptions) : Docs.Create.FontIconDocument({ ...docOptions, backgroundColor: StrCast(doc.backgroundColor), btnType: ButtonType.ClickButton, icon: 'bolt' }); dbox.title = ComputedField.MakeFunction('this.dragFactory.title'); dbox.dragFactory = layoutDoc; dbox.dropPropertiesToRemove = doc.dropPropertiesToRemove instanceof ObjectField ? ObjectField.MakeCopy(doc.dropPropertiesToRemove) : undefined; @@ -129,7 +104,7 @@ export function convertDropDataToButtons(data: DragManager.DocumentDragData) { }); } } else if (!doc.onDragStart && !doc.isButtonBar) { - dbox = makeUserTemplateButton(doc); + dbox = makeUserTemplateButtonOrImage(doc); } else if (doc.isButtonBar) { dbox.ignoreClick = true; } diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index df9ec1bbf..e569c7dc8 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -231,15 +231,17 @@ export class DocumentDecorations extends ObservableReactComponent { const iconViewDoc = iconView.Document; Doc.setNativeView(iconViewDoc); + // bcz: hacky ... when closing a Doc do different things depending on the contet ... if (iconViewDoc.activeFrame) { - iconViewDoc.opacity = 0; // bcz: hacky ... allows inkMasks and other documents to be "turned off" without removing them from the animated collection which allows them to function properly in a presenation. + iconViewDoc.opacity = 0; // if in an animation collection, set opacity to 0 to allow inkMasks and other documents to remain in the collection and to smoothly animate when they are activated in a different animation frame } else { - // to mark annotations as no longer saved if they're deleted from the palette - const dragFactory: Doc = DocCast(iconView.Document.dragFactory); - if (dragFactory && DocCast(dragFactory.cloneOf).savedAsAnno) { - DocCast(dragFactory.cloneOf).savedAsAnno = undefined; - } + // if Doc is in the annotation palette, remove the flag indicating that it's saved + const dragFactory = DocCast(iconView.Document.dragFactory); + if (dragFactory && DocCast(dragFactory.cloneOf).savedAsAnno) DocCast(dragFactory.cloneOf).savedAsAnno = undefined; + + // if this is a face Annotation doc, then just hide it. if (iconView.Document.annotationOn && iconView.Document.face) iconView.Document.hidden = true; + // otherwise actually remove the Doc from its parent collection else iconView._props.removeDocument?.(iconView.Document); } }); diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx index bc2b4badb..f44c1720d 100644 --- a/src/client/views/InkingStroke.tsx +++ b/src/client/views/InkingStroke.tsx @@ -30,7 +30,6 @@ import { InkData, InkField } from '../../fields/InkField'; import { BoolCast, Cast, NumCast, RTFCast, StrCast } from '../../fields/Types'; import { TraceMobx } from '../../fields/util'; import { Gestures } from '../../pen-gestures/GestureTypes'; -import { CognitiveServices } from '../cognitive_services/CognitiveServices'; import { Docs } from '../documents/Documents'; import { DocumentType } from '../documents/DocumentTypes'; import { InteractionUtils } from '../util/InteractionUtils'; @@ -122,8 +121,6 @@ export class InkingStroke extends ViewBoxAnnotatableComponent() InkTranscription.Instance.transcribeInk(newCollection, selected, false); } - // const data: InkData = this.inkScaledData().inkData ?? []; - // CognitiveServices.Inking.Appliers.ConcatenateHandwriting(this.dataDoc, ['inkAnalysis', 'handwriting'], [data]); }; /** diff --git a/src/client/views/collections/CollectionCarouselView.tsx b/src/client/views/collections/CollectionCarouselView.tsx index 143cfe0e8..db75c9e8b 100644 --- a/src/client/views/collections/CollectionCarouselView.tsx +++ b/src/client/views/collections/CollectionCarouselView.tsx @@ -144,7 +144,6 @@ export class CollectionCarouselView extends CollectionSubView() { revealItems.push({description: 'Quiz Cards', event: () => {this.layoutDoc.filterOp = cardMode.QUIZ;}, icon: 'pencil',}); // prettier-ignore !revealOptions && cm.addItem({ description: 'Filter Flashcards', addDivider: false, noexpand: true, subitems: revealItems, icon: 'layer-group' }); }; - childFitWidth = (doc: Doc) => Cast(this.Document.childLayoutFitWidth, 'boolean', this._props.childLayoutFitWidth?.(doc) ?? Cast(doc.layout_fitWidth, 'boolean', null)); isChildContentActive = () => this._props.isContentActive?.() === false @@ -165,7 +164,7 @@ export class CollectionCarouselView extends CollectionSubView() { Document={doc} NativeWidth={returnZero} NativeHeight={returnZero} - fitWidth={undefined} + fitWidth={this._props.childLayoutFitWidth} showTags={true} containerViewPath={this.childContainerViewPath} setContentViewBox={undefined} diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 85fd42ddf..80b61b6a9 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -27,7 +27,7 @@ import { CollectionViewType, DocumentType } from '../../documents/DocumentTypes' import { Docs } from '../../documents/Documents'; import { DragManager } from '../../util/DragManager'; import { dropActionType } from '../../util/DropActionTypes'; -import { MakeTemplate, makeUserTemplateButton } from '../../util/DropConverter'; +import { MakeTemplate, makeUserTemplateButtonOrImage } from '../../util/DropConverter'; import { UPDATE_SERVER_CACHE } from '../../util/LinkManager'; import { ScriptingGlobals } from '../../util/ScriptingGlobals'; import { SearchUtil } from '../../util/SearchUtil'; @@ -1348,7 +1348,7 @@ export class DocumentView extends DocComponent() { tempDoc = view.Document; MakeTemplate(tempDoc); Doc.AddDocToList(Doc.UserDoc(), 'template_user', tempDoc); - Doc.AddDocToList(DocListCast(Doc.MyTools.data)[1], 'data', makeUserTemplateButton(tempDoc)); + Doc.AddDocToList(DocListCast(Doc.MyTools.data)[1], 'data', makeUserTemplateButtonOrImage(tempDoc)); tempDoc && Doc.AddDocToList(Cast(Doc.UserDoc().template_user, Doc, null), 'data', tempDoc); } else { tempDoc = DocCast(view.Document[StrCast(view.Document.layout_fieldKey)]); diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 84d3fc748..d1b0dc7bf 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -268,7 +268,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent { this._canInteract = false; if (this.ShowRegenerate) { await this.regenerate(); - this._regenInput = ''; - this._showEditBox = false; + runInAction(() => { + this._regenInput = ''; + this._showEditBox = false; + }); } else { - this._showOptions = false; + runInAction(() => { + this._showOptions = false; + }); try { await this.drawWithGPT({ X: this._pageX, Y: this._pageY }, this._userInput, this._complexity, this._size, this._autoColor); this.hideSmartDrawHandler(); - this.ShowRegenerate = true; + + runInAction(() => { + this.ShowRegenerate = true; + }); } catch (err) { if (this._errorOccurredOnce) { console.error('GPT call failed', err); @@ -212,8 +219,10 @@ export class SmartDrawHandler extends ObservableReactComponent { } } } - this._isLoading = false; - this._canInteract = true; + runInAction(() => { + this._isLoading = false; + this._canInteract = true; + }); }; /** -- cgit v1.2.3-70-g09d2 From fe3c2d841b8c112f7f22ac9f7209d46b0c6b9669 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 15:48:45 -0400 Subject: fixed saving to anno palette. --- src/client/views/smartdraw/AnnotationPalette.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/client/views/smartdraw/AnnotationPalette.tsx b/src/client/views/smartdraw/AnnotationPalette.tsx index 4421547be..1c17469c3 100644 --- a/src/client/views/smartdraw/AnnotationPalette.tsx +++ b/src/client/views/smartdraw/AnnotationPalette.tsx @@ -10,7 +10,7 @@ import { returnEmptyFilter, returnFalse, returnTrue } from '../../../ClientUtils import { emptyFunction } from '../../../Utils'; import { Doc, DocListCast, returnEmptyDoclist } from '../../../fields/Doc'; import { DocData } from '../../../fields/DocSymbols'; -import { ImageCast } from '../../../fields/Types'; +import { ImageCast, NumCast } from '../../../fields/Types'; import { DocumentType } from '../../documents/DocumentTypes'; import { Docs } from '../../documents/Documents'; import { makeUserTemplateButtonOrImage } from '../../util/DropConverter'; @@ -178,7 +178,7 @@ export class AnnotationPalette extends ObservableReactComponent { - const cIndex: number = this._props.Document.carousel_index as number; + const cIndex = NumCast(this._props.Document.carousel_index); const focusedDrawing = DocListCast(this._props.Document.data)[cIndex]; const docData = focusedDrawing[DocData]; docData.title = this._opts.text.match(/^(.*?)~~~.*$/)?.[1] || this._opts.text; -- cgit v1.2.3-70-g09d2 From 8d7bf0588ca63c2d505a494865dcf9921eb1383d Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 15:57:57 -0400 Subject: more lint fixes --- src/client/util/CurrentUserUtils.ts | 2 +- src/client/util/DropConverter.ts | 2 +- src/client/util/Scripting.ts | 5 ----- src/client/views/DocumentDecorations.tsx | 2 +- src/client/views/InkTranscription.tsx | 1 + src/client/views/InkingStroke.tsx | 4 +--- src/client/views/LightboxView.tsx | 2 -- src/client/views/Main.tsx | 1 - src/client/views/MainView.tsx | 19 +++++++------------ .../views/collections/CollectionCarousel3DView.tsx | 2 +- .../views/collections/CollectionCarouselView.tsx | 4 ++-- .../collectionFreeForm/CollectionFreeFormView.tsx | 11 ++++++----- .../collections/collectionFreeForm/MarqueeView.tsx | 3 +-- src/client/views/nodes/FontIconBox/FontIconBox.tsx | 1 - src/client/views/nodes/ImageBox.tsx | 1 - src/client/views/nodes/PDFBox.tsx | 5 +---- .../views/nodes/formattedText/FormattedTextBox.tsx | 8 -------- src/client/views/nodes/formattedText/RichTextMenu.tsx | 1 - src/client/views/pdf/PDFViewer.tsx | 2 -- src/client/views/smartdraw/AnnotationPalette.tsx | 4 +--- src/client/views/smartdraw/SmartDrawHandler.tsx | 3 ++- src/fields/SchemaHeaderField.ts | 1 - 22 files changed, 26 insertions(+), 58 deletions(-) (limited to 'src') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 59760ba32..96d69e7a1 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -2,7 +2,7 @@ import { reaction, runInAction } from "mobx"; import * as rp from 'request-promise'; import { ClientUtils, OmitKeys } from "../../ClientUtils"; -import { Doc, DocListCast, DocListCastAsync, FieldType, Opt, StrListCast } from "../../fields/Doc"; +import { Doc, DocListCast, DocListCastAsync, FieldType, Opt } from "../../fields/Doc"; import { DocData } from "../../fields/DocSymbols"; import { InkTool } from "../../fields/InkField"; import { List } from "../../fields/List"; diff --git a/src/client/util/DropConverter.ts b/src/client/util/DropConverter.ts index 71cdaa58b..b5d29be4c 100644 --- a/src/client/util/DropConverter.ts +++ b/src/client/util/DropConverter.ts @@ -67,7 +67,7 @@ export function MakeTemplate(doc: Doc) { /** * Makes a draggable button or image that will create a template doc Instance */ -export function makeUserTemplateButtonOrImage(doc: Doc, image: string | undefined) { +export function makeUserTemplateButtonOrImage(doc: Doc, image?: string) { const layoutDoc = doc; // doc.layout instanceof Doc && doc.layout.isTemplateForField ? doc.layout : doc; if (layoutDoc.type !== DocumentType.FONTICON) { !layoutDoc.isTemplateDoc && makeTemplate(layoutDoc); diff --git a/src/client/util/Scripting.ts b/src/client/util/Scripting.ts index c63d3d7cb..c7b86815a 100644 --- a/src/client/util/Scripting.ts +++ b/src/client/util/Scripting.ts @@ -60,7 +60,6 @@ function Run(script: string | undefined, customParams: string[], diagnostics: ts // let params: any[] = [Docs, ...fieldTypes]; const compiledFunction = (() => { try { - // eslint-disable-next-line no-new-func return new Function(...paramNames, `return ${script}`); } catch (e) { console.log(e); @@ -69,10 +68,8 @@ function Run(script: string | undefined, customParams: string[], diagnostics: ts })(); if (!compiledFunction) return { compiled: false, errors }; const { capturedVariables = {} } = options; - // eslint-disable-next-line default-param-last const run = (args: { [name: string]: unknown } = {}, onError?: (e: string) => void, errorVal?: ts.Diagnostic): ScriptResult => { const argsArray: unknown[] = []; - // eslint-disable-next-line no-restricted-syntax for (const name of customParams) { if (name !== 'this') { argsArray.push(name in args ? args[name] : capturedVariables[name]); @@ -224,7 +221,6 @@ export function CompileScript(script: string, options: ScriptOptions = {}): Comp if ('this' in params || 'this' in capturedVariables) { paramNames.push('this'); } - // eslint-disable-next-line no-restricted-syntax for (const key in params) { if (key !== 'this') { paramNames.push(key); @@ -234,7 +230,6 @@ export function CompileScript(script: string, options: ScriptOptions = {}): Comp const val = params[key]; return `${key}: ${val}`; }); - // eslint-disable-next-line no-restricted-syntax for (const key in capturedVariables) { if (key !== 'this') { const val = capturedVariables[key]; diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index e569c7dc8..1c0d51e17 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -2,7 +2,7 @@ import { IconProp } from '@fortawesome/fontawesome-svg-core'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { Tooltip } from '@mui/material'; import { IconButton } from 'browndash-components'; -import { action, computed, makeObservable, observable, runInAction, trace } from 'mobx'; +import { action, computed, makeObservable, observable, runInAction } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; import { FaUndo } from 'react-icons/fa'; diff --git a/src/client/views/InkTranscription.tsx b/src/client/views/InkTranscription.tsx index b4f4ebf63..24d53a8c8 100644 --- a/src/client/views/InkTranscription.tsx +++ b/src/client/views/InkTranscription.tsx @@ -18,6 +18,7 @@ import { URLField } from '../../fields/URLField'; * Class component that handles inking in writing mode */ export class InkTranscription extends React.Component { + // eslint-disable-next-line no-use-before-define static Instance: InkTranscription; // eslint-disable-next-line @typescript-eslint/no-explicit-any diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx index f44c1720d..270266a94 100644 --- a/src/client/views/InkingStroke.tsx +++ b/src/client/views/InkingStroke.tsx @@ -51,7 +51,7 @@ import { InkTranscription } from './InkTranscription'; import { CollectionFreeFormView } from './collections/collectionFreeForm'; import { DocumentView } from './nodes/DocumentView'; -// eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports +// eslint-disable-next-line @typescript-eslint/no-require-imports const { INK_MASK_SIZE } = require('./global/globalCssVariables.module.scss'); // prettier-ignore @observer @@ -473,7 +473,6 @@ export class InkingStroke extends ViewBoxAnnotatableComponent() // mixBlendMode: this.layoutDoc.tool === InkTool.Highlighter ? 'multiply' : 'unset', cursor: this._props.isSelected() ? 'default' : undefined, }} - // eslint-disable-next-line react/jsx-props-no-spreading {...interactions}> {clickableLine(this.onPointerDown, isInkMask)} {isInkMask ? null : inkLine} @@ -490,7 +489,6 @@ export class InkingStroke extends ViewBoxAnnotatableComponent() // top: (this._props.PanelHeight() - (lineHeightGuess * fsize + 20) * (this._props.NativeDimScaling?.() || 1)) / 2, }}> { ); } // prettier-ignore public static LightboxDoc = () => LightboxView.Instance?._doc; - // eslint-disable-next-line no-use-before-define static Instance: LightboxView; private _path: { doc: Opt; // @@ -341,7 +340,6 @@ export class LightboxView extends ObservableReactComponent { } interface LightboxTourBtnProps { navBtn: (left: Opt, bottom: Opt, top: number, icon: IconProp, display: boolean, click: () => void, color?: string) => JSX.Element; - // eslint-disable-next-line react/no-unused-prop-types future: () => Opt; stepInto: () => void; lightboxDoc: () => Opt; diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index 94294e97a..73d2872d1 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -1,4 +1,3 @@ -/* eslint-disable no-new */ // if ((module as any).hot) { // (module as any).hot.accept(); // } diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index 8e921ca5e..fa2e94d12 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -3,7 +3,7 @@ import { faBuffer, faHireAHelper } from '@fortawesome/free-brands-svg-icons'; import * as far from '@fortawesome/free-regular-svg-icons'; import * as fa from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { action, computed, configure, makeObservable, observable, reaction, runInAction, trace } from 'mobx'; +import { action, computed, configure, makeObservable, observable, reaction, runInAction } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; import ResizeObserver from 'resize-observer-polyfill'; @@ -77,7 +77,7 @@ import { TopBar } from './topbar/TopBar'; import { SmartDrawHandler } from './smartdraw/SmartDrawHandler'; import { InkTranscription } from './InkTranscription'; -// eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports +// eslint-disable-next-line @typescript-eslint/no-require-imports const { LEFT_MENU_WIDTH, TOPBAR_HEIGHT } = require('./global/globalCssVariables.module.scss'); // prettier-ignore @observer @@ -977,13 +977,11 @@ export class MainView extends ObservableReactComponent {
{[ - ...SnappingManager.HorizSnapLines.map((l, i) => ( - // eslint-disable-next-line react/no-array-index-key - + ...SnappingManager.HorizSnapLines.map(l => ( + )), - ...SnappingManager.VertSnapLines.map((l, i) => ( - // eslint-disable-next-line react/no-array-index-key - + ...SnappingManager.VertSnapLines.map(l => ( + )), ]} @@ -1071,10 +1069,7 @@ export class MainView extends ObservableReactComponent { docView={DocButtonState.Instance.LinkEditorDocView} /> ) : null} - {LinkInfo.Instance?.LinkInfo ? ( - // eslint-disable-next-line react/jsx-props-no-spreading - - ) : null} + {LinkInfo.Instance?.LinkInfo ? : null} {((page: string) => { // prettier-ignore switch (page) { diff --git a/src/client/views/collections/CollectionCarousel3DView.tsx b/src/client/views/collections/CollectionCarousel3DView.tsx index cf86a0a4e..c5da8e037 100644 --- a/src/client/views/collections/CollectionCarousel3DView.tsx +++ b/src/client/views/collections/CollectionCarousel3DView.tsx @@ -16,6 +16,7 @@ import './CollectionCarousel3DView.scss'; import { CollectionSubView, SubCollectionViewProps } from './CollectionSubView'; import { Transform } from '../../util/Transform'; +// eslint-disable-next-line @typescript-eslint/no-require-imports const { CAROUSEL3D_CENTER_SCALE, CAROUSEL3D_SIDE_SCALE, CAROUSEL3D_TOP } = require('../global/globalCssVariables.module.scss'); @observer @@ -88,7 +89,6 @@ export class CollectionCarousel3DView extends CollectionSubView() { const currentIndex = NumCast(this.layoutDoc._carousel_index); const displayDoc = (childPair: { layout: Doc; data: Doc }, dxf: () => Transform) => ( this.showSmartDraw(e.pageX, e.pageY), hit !== -1); + setupMoveUpEvents(this, e, this.onPointerMove, emptyFunction, () => this.showSmartDraw(e.pageX, e.pageY), hit !== -1); e.stopPropagation(); + break; case InkTool.None: if (!(this._props.layoutEngine?.() || StrCast(this.layoutDoc._layoutEngine))) { - const hit = this._clusters.handlePointerDown(this.screenToFreeformContentsXf.transformPoint(e.clientX, e.clientY)); - setupMoveUpEvents(this, e, this.onPointerMove, emptyFunction, emptyFunction, hit !== -1, false); + const ahit = this._clusters.handlePointerDown(this.screenToFreeformContentsXf.transformPoint(e.clientX, e.clientY)); + setupMoveUpEvents(this, e, this.onPointerMove, emptyFunction, emptyFunction, ahit !== -1, false); } break; default: @@ -655,13 +656,13 @@ export class CollectionFreeFormView extends CollectionSubView { + onEraserClick = (e: PointerEvent) => { e.preventDefault(); e.stopImmediatePropagation(); this.erase(e, [0, 0]); }; - forceStrokeGesture = (e: PointerEvent, gesture: Gestures, points: InkData, text?: any) => { + forceStrokeGesture = (e: PointerEvent, gesture: Gestures, points: InkData, text?: string) => { this.onGesture(e, new GestureUtils.GestureEvent(gesture, points, InkField.getBounds(points), text)); }; diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index 7614b5337..b1f6815b3 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -57,6 +57,7 @@ export class MarqueeView extends ObservableReactComponent tl[0] && truePoint[0] < r1.left && truePoint[1] > r1.top && truePoint[1] < r1.top + r1.height); diff --git a/src/client/views/nodes/FontIconBox/FontIconBox.tsx b/src/client/views/nodes/FontIconBox/FontIconBox.tsx index b7e1350ca..feaf84b7b 100644 --- a/src/client/views/nodes/FontIconBox/FontIconBox.tsx +++ b/src/client/views/nodes/FontIconBox/FontIconBox.tsx @@ -1,4 +1,3 @@ -/* eslint-disable react/jsx-props-no-spreading */ import { IconProp } from '@fortawesome/fontawesome-svg-core'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { Button, ColorPicker, Dropdown, DropdownType, IconButton, IListItemProps, MultiToggle, NumberDropdown, NumberDropdownType, Popup, Size, Toggle, ToggleType, Type } from 'browndash-components'; diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index aa4376bb2..ec5e062c8 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -493,7 +493,6 @@ export class ImageBox extends ViewBoxAnnotatableComponent() { }}> () { return ComponentTag === CollectionStackingView ? ( () { ) : (
setupMoveUpEvents(this, e, returnFalse, emptyFunction, () => this._props.select(false), true)}> () { top: 0, }}> -1) { const sel = new TextSelection(pm.state.doc.resolve(ep.from + index + blockOffset + foundAt + 1), pm.state.doc.resolve(ep.from + index + blockOffset + foundAt + find.length + 1)); ret.push(sel); @@ -714,7 +713,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent addStyleSheetRule(FormattedTextBox._userStyleSheet, 'UM-hr-' + (hr - i), { opacity: ((10 - i - 1) / 10).toString() })); } - // eslint-disable-next-line operator-assignment this.layoutDoc[DocCss] = this.layoutDoc[DocCss] + 1; // css changes happen outside of react/mobx. so we need to set a flag that will notify anyone interested in layout changes triggered by css changes (eg., CollectionLinkView) }; @@ -1131,7 +1129,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent { - // eslint-disable-next-line no-use-before-define const examinedNode = findAnchorNode(node, editor); if (examinedNode?.node && (examinedNode.node.textContent || examinedNode.node.type === this._editorView?.state.schema.nodes.dashDoc || examinedNode.node.type === this._editorView?.state.schema.nodes.audiotag)) { nodes.push(examinedNode.node); @@ -1285,7 +1282,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent { this.prepareForTyping(); if (FormattedTextBox._globalHighlights.has('Bold Text')) { - // eslint-disable-next-line operator-assignment this.layoutDoc[DocCss] = this.layoutDoc[DocCss] + 1; // css change happens outside of mobx/react, so this will notify anyone interested in the layout that it has changed } if (RichTextMenu.Instance?.view === this._editorView && !selected) { @@ -1711,7 +1707,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent kids?.reduce((p, child) => p + toHgt(child), margins) ?? 0; const toNum = (val: string) => Number(val.replace('px', '')); const toHgt = (node: Element): number => { @@ -1880,7 +1874,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent setupMoveUpEvents(this, e, returnFalse, emptyFunction, () => DocumentView.SelectView(this.DocumentView?.(), false), true)}> { - // eslint-disable-next-line react/no-unused-class-component-methods update(view: EditorView & { TextView?: FormattedTextBox }, lastState: EditorState | undefined) { RichTextMenu.Instance?.updateMenu(view, lastState, this.props.editorProps, view.TextView?.layoutDoc); } diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 01242ba48..7a86ee802 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -504,7 +504,6 @@ export class PDFViewer extends ObservableReactComponent { return (
{inlineAnnos.map(anno => ( - // eslint-disable-next-line react/jsx-props-no-spreading ))}
@@ -537,7 +536,6 @@ export class PDFViewer extends ObservableReactComponent { pointerEvents: Doc.ActiveTool !== InkTool.None ? 'all' : undefined, }}> { + // eslint-disable-next-line no-use-before-define static Instance: SmartDrawHandler; private _lastInput: DrawingOptions = { text: '', complexity: 5, size: 350, autoColor: true, x: 0, y: 0 }; @@ -395,7 +396,7 @@ export class SmartDrawHandler extends ObservableReactComponent { defaultChecked={true} value={this._autoColor} size="small" - onChange={action(e => this._canInteract && (this._autoColor = !this._autoColor))} + onChange={action(() => this._canInteract && (this._autoColor = !this._autoColor))} />
diff --git a/src/fields/SchemaHeaderField.ts b/src/fields/SchemaHeaderField.ts index 0a8dd1d9e..5f4d59cf9 100644 --- a/src/fields/SchemaHeaderField.ts +++ b/src/fields/SchemaHeaderField.ts @@ -79,7 +79,6 @@ export class SchemaHeaderField extends ObjectField { @serializable(primitive()) desc: boolean | undefined; // boolean determines sort order, undefined when no sort - // eslint-disable-next-line default-param-last constructor(heading: string = '', color: string = RandomPastel(), type?: ColumnType, width?: number, desc?: boolean, collapsed?: boolean) { super(); -- cgit v1.2.3-70-g09d2 From 39dc004c0f8e4bcc21ca0c2ecb0b665037f3d1ad Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 16:25:08 -0400 Subject: fixed setting ink multiselections in properties view --- src/client/views/PropertiesView.tsx | 21 ++++++++++----------- 1 file changed, 10 insertions(+), 11 deletions(-) (limited to 'src') diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx index 722086aea..229ceffe2 100644 --- a/src/client/views/PropertiesView.tsx +++ b/src/client/views/PropertiesView.tsx @@ -816,7 +816,7 @@ export class PropertiesView extends ObservableReactComponent doc.layout_isSvg); } @computed get shapeXps() { return NumCast(this.selectedDoc?.x); } // prettier-ignore set shapeXps(value) { this.selectedDoc && (this.selectedDoc.x = Math.round(value * 100) / 100); } // prettier-ignore @@ -1015,7 +1015,9 @@ export class PropertiesView extends ObservableReactComponent { + doc[DocData].stroke_width = Number(value); + }); } @computed get markScal() { return Number(this.getField('stroke_markerScale') || '1'); } // prettier-ignore set markScal(value) { @@ -1025,7 +1027,9 @@ export class PropertiesView extends ObservableReactComponent { + doc[DocData].stroke_smoothAmount = Number(value); + }); } @computed get markHead() { return this.getField('stroke_startMarker') || ''; } // prettier-ignore set markHead(value) { @@ -1315,14 +1319,9 @@ export class PropertiesView extends ObservableReactComponent - { this.openAppearance = bool; }} onDoubleClick={this.CloseAll}> - {this.isGroup && this.containsInk(this.selectedDoc) ? this.appearanceEditor : null} - - - ); + return { this.openAppearance = bool; }} onDoubleClick={this.CloseAll}> + {this.isGroup && this.containsInk(this.selectedDoc) ? this.appearanceEditor : null} + ; // prettier-ignore } @computed get fieldsSubMenu() { -- cgit v1.2.3-70-g09d2 From 06ab521c759e44a26be58fdf7ffc8d790e551236 Mon Sep 17 00:00:00 2001 From: eleanor-park Date: Tue, 1 Oct 2024 18:45:01 -0400 Subject: working on image bug for a while --- src/.DS_Store | Bin 10244 -> 10244 bytes src/client/views/MainView.tsx | 1 + .../views/nodes/generativeFill/GenerativeFill.tsx | 104 ++++++++++++++++++--- .../nodes/generativeFill/GenerativeFillButtons.tsx | 34 ++++++- .../generativeFillUtils/BrushHandler.ts | 16 +++- 5 files changed, 138 insertions(+), 17 deletions(-) (limited to 'src') diff --git a/src/.DS_Store b/src/.DS_Store index 426a2ee90..9b66f8d8e 100644 Binary files a/src/.DS_Store and b/src/.DS_Store differ diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index 41a933431..54e049c04 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -408,6 +408,7 @@ export class MainView extends ObservableReactComponent { fa.faArrowsAltV, fa.faTimesCircle, fa.faThumbtack, + fa.faScissors, fa.faTree, fa.faTv, fa.faUndoAlt, diff --git a/src/client/views/nodes/generativeFill/GenerativeFill.tsx b/src/client/views/nodes/generativeFill/GenerativeFill.tsx index 6d8ba9222..261eb4bb4 100644 --- a/src/client/views/nodes/generativeFill/GenerativeFill.tsx +++ b/src/client/views/nodes/generativeFill/GenerativeFill.tsx @@ -21,19 +21,16 @@ import { CollectionFreeFormView } from '../../collections/collectionFreeForm'; import { ImageEditorData } from '../ImageBox'; import { OpenWhereMod } from '../OpenWhere'; import './GenerativeFill.scss'; -import Buttons from './GenerativeFillButtons'; -import { BrushHandler } from './generativeFillUtils/BrushHandler'; +import { EditButtons, CutButtons } from './GenerativeFillButtons'; +import { BrushHandler, BrushType } from './generativeFillUtils/BrushHandler'; import { APISuccess, ImageUtility } from './generativeFillUtils/ImageHandler'; import { PointerHandler } from './generativeFillUtils/PointerHandler'; import { activeColor, canvasSize, eraserColor, freeformRenderSize, newCollectionSize, offsetDistanceY, offsetX } from './generativeFillUtils/generativeFillConstants'; import { CursorData, ImageDimensions, Point } from './generativeFillUtils/generativeFillInterfaces'; import { DocumentView } from '../DocumentView'; - -// enum BrushStyle { -// ADD, -// SUBTRACT, -// MARQUEE, -// } +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { ImageField } from '../../../../fields/URLField'; +import { resolve } from 'url'; interface GenerativeFillProps { imageEditorOpen: boolean; @@ -82,6 +79,9 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD const parentDoc = useRef(null); const childrenDocs = useRef([]); + // constants for image cutting + const cutPts = useRef([]); + // Undo and Redo const handleUndo = () => { const ctx = ImageUtility.getCanvasContext(canvasRef); @@ -161,7 +161,8 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD x: currPoint.x - e.movementX / canvasScale, y: currPoint.y - e.movementY / canvasScale, }; - BrushHandler.createBrushPathOverlay(lastPoint, currPoint, cursorData.width / 2 / canvasScale, ctx, eraserColor /* , brushStyle === BrushStyle.SUBTRACT */); + const pts = BrushHandler.createBrushPathOverlay(lastPoint, currPoint, cursorData.width / 2 / canvasScale, ctx, eraserColor, BrushType.CUT); + cutPts.current.push(...pts); }; drawingAreaRef.current?.addEventListener('pointermove', handlePointerMove); @@ -278,7 +279,6 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD const maskBlob = await ImageUtility.canvasToBlob(canvasMask); const imgBlob = await ImageUtility.canvasToBlob(canvasOriginalImg); const res = await ImageUtility.getEdit(imgBlob, maskBlob, input !== '' ? input + ' in the same style' : 'Fill in the image in the same style', 2); - // const res = await ImageUtility.mockGetEdit(img.src); // create first image if (!newCollectionRef.current) { @@ -334,6 +334,68 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD setLoading(false); }; + const cutImage = async () => { + const img = currImg.current; + const canvas = canvasRef.current; + if (!canvas || !img) return; + canvas.width = img.naturalWidth; + canvas.height = img.naturalHeight; + const ctx = ImageUtility.getCanvasContext(canvasRef); + if (!ctx) return; + ctx.globalCompositeOperation = 'source-over'; + setLoading(true); + setEdited(true); + // get the original image + const canvasOriginalImg = ImageUtility.getCanvasImg(img); + if (!canvasOriginalImg) return; + // draw the image onto the canvas + ctx.drawImage(img, 0, 0); + // get the mask which i assume is the thing the user draws on + // const canvasMask = ImageUtility.getCanvasMask(canvas, canvasOriginalImg); + // if (!canvasMask) return; + // canvasMask.width = canvas.width; + // canvasMask.height = canvas.height; + // now put the user's path around the mask + if (cutPts.current.length) { + ctx.beginPath(); + ctx.moveTo(cutPts.current[0].x, cutPts.current[0].y); // later check edge case where cutPts is empty + for (let i = 0; i < cutPts.current.length; i++) { + ctx.lineTo(cutPts.current[i].x, cutPts.current[i].y); + } + ctx.closePath(); + ctx.stroke(); + ctx.fill(); + // ctx.clip(); + } + const url = canvas.toDataURL(); // this does the same thing as convert img to canvasurl + if (!newCollectionRef.current) { + if (!isNewCollection && imageRootDoc) { + // if the parent hasn't been set yet + if (!parentDoc.current) parentDoc.current = imageRootDoc; + } else { + if (!(originalImg.current && imageRootDoc)) return; + // create new collection and add it to the view + newCollectionRef.current = Docs.Create.FreeformDocument([], { + x: NumCast(imageRootDoc.x) + NumCast(imageRootDoc._width) + offsetX, + y: NumCast(imageRootDoc.y), + _width: newCollectionSize, + _height: newCollectionSize, + title: 'Image edit collection', + }); + DocUtils.MakeLink(imageRootDoc, newCollectionRef.current, { link_relationship: 'Image Edit Version History' }); + // opening new tab + CollectionDockingView.AddSplit(newCollectionRef.current, OpenWhereMod.right); + } + } + const image = new Image(); + image.src = url; + await createNewImgDoc(image, true); + // add the doc to the main freeform + // eslint-disable-next-line no-use-before-define + setLoading(false); + cutPts.current.length = 0; + }; + // adjusts all the img positions to be aligned const adjustImgPositions = () => { if (!parentDoc.current) return; @@ -439,6 +501,7 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD

Image Editor

+ {/* } /> */}
- + + } onClick={handleViewClose} />
@@ -526,6 +590,24 @@ const GenerativeFill = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addD }} />
+
e.stopPropagation()} style={{ height: 225, width: '100%', display: 'flex', justifyContent: 'center', cursor: 'pointer' }}> + { + setCursorData(prev => ({ ...prev, width: val as number })); + }} + /> +
{/* Edits thumbnails */}
diff --git a/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx b/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx index d1f68ee0e..fe22b273d 100644 --- a/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx +++ b/src/client/views/nodes/generativeFill/GenerativeFillButtons.tsx @@ -6,12 +6,12 @@ import { AiOutlineInfo } from 'react-icons/ai'; import { activeColor } from './generativeFillUtils/generativeFillConstants'; interface ButtonContainerProps { - getEdit: () => Promise; + onClick: () => Promise; loading: boolean; onReset: () => void; } -function Buttons({ loading, getEdit, onReset }: ButtonContainerProps) { +export function EditButtons({ loading, onClick: getEdit, onReset }: ButtonContainerProps) { return (
+ ); +} diff --git a/src/client/views/nodes/generativeFill/generativeFillUtils/BrushHandler.ts b/src/client/views/nodes/generativeFill/generativeFillUtils/BrushHandler.ts index 16d529d93..8a66d7347 100644 --- a/src/client/views/nodes/generativeFill/generativeFillUtils/BrushHandler.ts +++ b/src/client/views/nodes/generativeFill/generativeFillUtils/BrushHandler.ts @@ -1,6 +1,12 @@ import { GenerativeFillMathHelpers } from './GenerativeFillMathHelpers'; import { eraserColor } from './generativeFillConstants'; import { Point } from './generativeFillInterfaces'; +import { points } from '@turf/turf'; + +export enum BrushType { + GEN_FILL, + CUT, +} export class BrushHandler { static brushCircleOverlay = (x: number, y: number, brushRadius: number, ctx: CanvasRenderingContext2D, fillColor: string /* , erase: boolean */) => { @@ -14,12 +20,16 @@ export class BrushHandler { ctx.closePath(); }; - static createBrushPathOverlay = (startPoint: Point, endPoint: Point, brushRadius: number, ctx: CanvasRenderingContext2D, fillColor: string /* , erase: boolean */) => { + static createBrushPathOverlay = (startPoint: Point, endPoint: Point, brushRadius: number, ctx: CanvasRenderingContext2D, fillColor: string, brushType: BrushType) => { const dist = GenerativeFillMathHelpers.distanceBetween(startPoint, endPoint); - + const pts: Point[] = []; for (let i = 0; i < dist; i += 5) { const s = i / dist; - BrushHandler.brushCircleOverlay(startPoint.x * (1 - s) + endPoint.x * s, startPoint.y * (1 - s) + endPoint.y * s, brushRadius, ctx, fillColor /* , erase */); + const x = startPoint.x * (1 - s) + endPoint.x * s; + const y = startPoint.y * (1 - s) + endPoint.y * s; + pts.push({ x: startPoint.x, y: startPoint.y }); + BrushHandler.brushCircleOverlay(x, y, brushRadius, ctx, fillColor); } + return pts; }; } -- cgit v1.2.3-70-g09d2 From 3d6c5b151cebc74df4b8fc79e5bb755c51ad65a2 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 1 Oct 2024 19:03:05 -0400 Subject: changed how smoothing curves works - got rid of simplify.js dependency --- package-lock.json | 6 -- package.json | 1 - src/client/documents/Documents.ts | 9 --- src/client/views/InkStrokeProperties.ts | 49 ++++++------- src/client/views/PropertiesView.tsx | 117 ++++++++++++++------------------ 5 files changed, 76 insertions(+), 106 deletions(-) (limited to 'src') diff --git a/package-lock.json b/package-lock.json index 571076db0..751787548 100644 --- a/package-lock.json +++ b/package-lock.json @@ -221,7 +221,6 @@ "sass-loader": "^16.0.1", "serializr": "^3.0.2", "shelljs": "^0.8.5", - "simplify-js": "^1.2.4", "socket.io": "^4.7.2", "socket.io-client": "^4.7.2", "standard-http-error": "^2.0.1", @@ -30995,11 +30994,6 @@ "node": ">=20.12.2" } }, - "node_modules/simplify-js": { - "version": "1.2.4", - "resolved": "https://registry.npmjs.org/simplify-js/-/simplify-js-1.2.4.tgz", - "integrity": "sha512-vITfSlwt7h/oyrU42R83mtzFpwYk3+mkH9bOHqq/Qw6n8rtR7aE3NZQ5fbcyCUVVmuMJR6ynsAhOfK2qoah8Jg==" - }, "node_modules/skmeans": { "version": "0.9.7", "resolved": "https://registry.npmjs.org/skmeans/-/skmeans-0.9.7.tgz", diff --git a/package.json b/package.json index 4583ca679..364afc826 100644 --- a/package.json +++ b/package.json @@ -300,7 +300,6 @@ "sass-loader": "^16.0.1", "serializr": "^3.0.2", "shelljs": "^0.8.5", - "simplify-js": "^1.2.4", "socket.io": "^4.7.2", "socket.io-client": "^4.7.2", "standard-http-error": "^2.0.1", diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index bf72a4bd4..b0a1e767e 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -1,5 +1,3 @@ -/* eslint-disable prefer-destructuring */ -/* eslint-disable default-param-last */ /* eslint-disable no-use-before-define */ import { reaction } from 'mobx'; import { basename } from 'path'; @@ -671,7 +669,6 @@ export namespace Docs { * only when creating a DockDocument from the current user's already existing * main document. */ - // eslint-disable-next-line default-param-last function InstanceFromProto(proto: Doc, data: FieldType | undefined, options: DocumentOptions, delegId?: string, fieldKey: string = 'data', protoId?: string, placeholderDocIn?: Doc, noView?: boolean) { const placeholderDoc = placeholderDocIn; const viewKeys = ['x', 'y', 'isSystem']; // keys that should be addded to the view document even though they don't begin with an "_" @@ -732,7 +729,6 @@ export namespace Docs { return dataDoc; } - // eslint-disable-next-line default-param-last export function ImageDocument(url: string | ImageField, options: DocumentOptions = {}, overwriteDoc?: Doc) { const imgField = url instanceof ImageField ? url : url ? new ImageField(url) : undefined; return InstanceFromProto(Prototypes.get(DocumentType.IMG), imgField, { title: basename(imgField?.url.href ?? '-no image-'), ...options }, undefined, undefined, undefined, overwriteDoc); @@ -751,7 +747,6 @@ export namespace Docs { * @param fieldKey the field that the compiled script is written into. * @returns the Scripting Doc */ - // eslint-disable-next-line default-param-last export function ScriptingDocument(script: Opt | null, options: DocumentOptions = {}, fieldKey?: string) { return InstanceFromProto(Prototypes.get(DocumentType.SCRIPTING), script || undefined, { ...options, layout: fieldKey ? `` /* ScriptingBox.LayoutString(fieldKey) */ : undefined }); } @@ -759,7 +754,6 @@ export namespace Docs { export function ChatDocument(options?: DocumentOptions) { return InstanceFromProto(Prototypes.get(DocumentType.CHAT), undefined, { ...(options || {}) }); } - // eslint-disable-next-line default-param-last export function VideoDocument(url: string, options: DocumentOptions = {}, overwriteDoc?: Doc) { return InstanceFromProto(Prototypes.get(DocumentType.VID), new VideoField(url), options, undefined, undefined, undefined, overwriteDoc); } @@ -779,7 +773,6 @@ export namespace Docs { return InstanceFromProto(Prototypes.get(DocumentType.DIAGRAM), undefined, options); } - // eslint-disable-next-line default-param-last export function AudioDocument(url: string, options: DocumentOptions = {}, overwriteDoc?: Doc) { return InstanceFromProto(Prototypes.get(DocumentType.AUDIO), new AudioField(url), options, undefined, undefined, undefined, overwriteDoc); } @@ -834,7 +827,6 @@ export namespace Docs { return InstanceFromProto(Prototypes.get(DocumentType.RTF), field, options, undefined, fieldKey); } - // eslint-disable-next-line default-param-last export function LinkDocument(source: Doc, target: Doc, options: DocumentOptions = {}, id?: string) { const linkDoc = InstanceFromProto( Prototypes.get(DocumentType.LINK), @@ -878,7 +870,6 @@ export namespace Docs { return ink; } - // eslint-disable-next-line default-param-last export function PdfDocument(url: string, options: DocumentOptions = {}, overwriteDoc?: Doc) { const width = options._width || undefined; const height = options._height || undefined; diff --git a/src/client/views/InkStrokeProperties.ts b/src/client/views/InkStrokeProperties.ts index 5cacde0d4..358274f0e 100644 --- a/src/client/views/InkStrokeProperties.ts +++ b/src/client/views/InkStrokeProperties.ts @@ -1,19 +1,18 @@ import { Bezier } from 'bezier-js'; +import * as fitCurve from 'fit-curve'; import * as _ from 'lodash'; import { action, makeObservable, observable, reaction, runInAction } from 'mobx'; -import simplify from 'simplify-js'; import { Doc, NumListCast, Opt } from '../../fields/Doc'; +import { DocData } from '../../fields/DocSymbols'; import { InkData, InkField, InkTool } from '../../fields/InkField'; import { List } from '../../fields/List'; import { listSpec } from '../../fields/Schema'; import { Cast, NumCast } from '../../fields/Types'; -import { Gestures, PointData } from '../../pen-gestures/GestureTypes'; -import { GestureUtils } from '../../pen-gestures/GestureUtils'; +import { PointData } from '../../pen-gestures/GestureTypes'; import { Point } from '../../pen-gestures/ndollar'; import { DocumentType } from '../documents/DocumentTypes'; import { undoable } from '../util/UndoManager'; import { FitOneCurve } from '../util/bezierFit'; -import { GestureOverlay } from './GestureOverlay'; import { InkingStroke } from './InkingStroke'; import { CollectionFreeFormView } from './collections/collectionFreeForm'; import { DocumentView } from './nodes/DocumentView'; @@ -322,7 +321,6 @@ export class InkStrokeProperties { let nearestSeg = -1; let nearestPt = { X: 0, Y: 0 }; for (let i = 0; i < ctrlPoints.length - 3; i += 4) { - // eslint-disable-next-line no-continue if (excludeSegs?.includes(i)) continue; const array = [ctrlPoints[i], ctrlPoints[i + 1], ctrlPoints[i + 2], ctrlPoints[i + 3]]; const point = new Bezier(array.map(p => ({ x: p.X, y: p.Y }))).project({ x: refInkSpacePt.X, y: refInkSpacePt.Y }); @@ -488,31 +486,34 @@ export class InkStrokeProperties { }); }, 'move ink tangent'); + sampleBezier = (curves: InkData) => { + const polylinePoints = [{ x: curves[0].X, y: curves[0].Y }]; + for (let i = 0; i < curves.length / 4; i++) { + const bez = new Bezier(curves.slice(i * 4, i * 4 + 4).map(p => ({ x: p.X, y: p.Y }))); + for (let t = 0.05; t < 1; t += 0.05) { + polylinePoints.push(bez.compute(t)); + } + polylinePoints.push(bez.points[3]); + } + return polylinePoints.length > 2 ? polylinePoints : undefined; + }; /** - * Function that "smooths" ink strokes by using the gesture recognizer to detect shapes and - * removing excess control points with the simplify-js package. + * Function that "smooths" ink strokes by sampling the curve, then fitting it with new bezier curves, subject to a + * maximum pixel error tolerance * @param inkDocs - * @param tolerance Determines how strong the smooth effect will be + * @param tolerance how many pixels of error are allowed */ - smoothInkStrokes = undoable((inkDocs: Doc[], tolerance: number = 5) => { + smoothInkStrokes = undoable((inkDocs: Doc[], tolerance = 5) => { inkDocs.forEach(inkDoc => { const inkView = DocumentView.getDocumentView(inkDoc); const inkStroke = inkView?.ComponentView as InkingStroke; - const { inkData } = inkStroke.inkScaledData(); - const polylinePoints = inkData.filter((pt, index) => { return index % 4 === 0 || pt === inkData.lastElement()}).map(pt => { return { x: pt.X, y: pt.Y }; }); // prettier-ignore - if (polylinePoints.length > 2) { - const toKeep = simplify(polylinePoints, tolerance).map(pt => {return { X: pt.x, Y: pt.y }}); // prettier-ignore - for (var i = 4; i < inkData.length - 3; i += 4) { - const contains = toKeep.find(pt => pt.X === inkData[i].X && pt.Y === inkData[i].Y); - if (!contains) { - this._currentPoint = i; - inkView && this.deletePoints(inkView, false); - } - } - // close the curve if the first and last points are really close (based on tolerance) - if (!InkingStroke.IsClosed(inkData) && Math.sqrt((inkData.lastElement().X - inkData[0].X) ** 2 + (inkData.lastElement().Y - inkData[0].Y) ** 2) <= tolerance * 2) { - inkData[inkData.length - 1] = inkData[0]; - } + const polylinePoints = this.sampleBezier(inkStroke?.inkScaledData().inkData ?? [])?.map(pt => [pt.x, pt.y]); + if (polylinePoints) { + inkDoc[DocData].stroke = new InkField( + fitCurve.default(polylinePoints, tolerance) + .reduce((cpts, bez) => + ({n: cpts.push(...bez.map(cpt => ({X:cpt[0], Y:cpt[1]}))), cpts}).cpts, + [] as {X:number, Y:number}[])); // prettier-ignore } }); }, 'smooth ink stroke'); diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx index 229ceffe2..d0c47875f 100644 --- a/src/client/views/PropertiesView.tsx +++ b/src/client/views/PropertiesView.tsx @@ -120,9 +120,6 @@ export class PropertiesView extends ObservableReactComponent { doc[DocData].stroke_width = Math.round(value * 100) / 100; @@ -868,7 +865,7 @@ export class PropertiesView extends ObservableReactComponent { const inkStroke = DocumentView.getDocumentView(doc)?.ComponentView as InkingStroke; @@ -878,7 +875,7 @@ export class PropertiesView extends ObservableReactComponent { doc[DocData].color = value || undefined; @@ -956,9 +953,21 @@ export class PropertiesView extends ObservableReactComponent { + !isNaN(val) && (this.smoothAmt = val); + }, + 10, + 1 + ); return (
- {!targetDoc.layout_isSvg && ( + {!targetDoc.layout_isSvg && this.containsInkDoc && (
{ - InkStrokeProperties.Instance.smoothInkStrokes(this.containsInkDoc ? DocListCast(targetDoc.data) : [targetDoc], this.smoothAmt); + InkStrokeProperties.Instance.smoothInkStrokes(this.selectedStrokes, this.smoothAmt); }, 'smoothStrokes')} />
-
- {this.getNumber( - 'Smooth Amount', - '', - 1, - Math.max(10, this.smoothAmt), - this.smoothAmt, - (val: number) => { - !isNaN(val) && (this.smoothAmt = val); - }, - 10, - 1 - )} -
+
{smoothNumber}
); } - @computed get dashdStk() { return this.containsInkDoc? this.inkDoc?.stroke_dash || '' : this.selectedDoc?.stroke_dash || ''; } // prettier-ignore + @computed get dashdStk() { return this.selectedStrokes[0]?.stroke_dash || ''; } // prettier-ignore set dashdStk(value) { value && (this._lastDash = value as string); this.selectedStrokes.forEach(doc => { @@ -1148,54 +1144,51 @@ export class PropertiesView extends ObservableReactComponent - {this.widthAndDash} - {this.strokeAndFill} - {this.smoothAndColor} -
- ); - } - @computed get inkEditor() { return (
{this.widthAndDash} {this.strokeAndFill} + {this.smoothAndColor}
); } _sliderBatch: UndoManager.Batch | undefined; + _sliderKey = ''; setFinalNumber = () => { + this._sliderKey = ''; this._sliderBatch?.end(); }; - getNumber = (label: string, unit: string, min: number, max: number, number: number, setNumber: (val: number) => void, autorange?: number, autorangeMinVal?: number) => ( -
- - { - this._sliderBatch = UndoManager.StartBatch('slider ' + label); - }} - multithumb={false} - color={this.color} - size={Size.XSMALL} - min={min} - max={max} - autorangeMinVal={autorangeMinVal} - autorange={autorange} - number={number} - unit={unit} - decimals={1} - setFinalNumber={this.setFinalNumber} - setNumber={setNumber} - fillWidth - /> -
- ); + getNumber = (label: string, unit: string, min: number, max: number, number: number, setNumber: (val: number) => void, autorange?: number, autorangeMinVal?: number) => { + const key = this._sliderKey || label + min + max + number; + return ( +
+ + { + this._sliderKey = key; + this._sliderBatch = UndoManager.StartBatch('slider ' + label); + }} + multithumb={false} + color={this.color} + size={Size.XSMALL} + min={min} + max={max} + autorangeMinVal={autorangeMinVal} + autorange={autorange} + number={number} + unit={unit} + decimals={1} + setFinalNumber={this.setFinalNumber} + setNumber={setNumber} + fillWidth + /> +
+ ); + }; setVal = (func: (doc: Doc, val: number) => void) => (val: number) => this.selectedDoc && !isNaN(val) && func(this.selectedDoc, val); @computed get transformEditor() { @@ -1294,7 +1287,7 @@ export class PropertiesView extends ObservableReactComponent { this.openAppearance = bool; }} onDoubleClick={this.CloseAll}> - {this.selectedLayoutDoc?.layout_isSvg ? this.appearanceEditor : null} + {this.selectedStrokes.length ? this.inkEditor : null} { this.openTransform = bool; }} onDoubleClick={this.CloseAll}> {this.transformEditor} @@ -1311,19 +1304,12 @@ export class PropertiesView extends ObservableReactComponent { this.openAppearance = bool; }} onDoubleClick={this.CloseAll}> - {this.isGroup && this.containsInk(this.selectedDoc) ? this.appearanceEditor : null} - ; // prettier-ignore - } - @computed get fieldsSubMenu() { return ( Date: Tue, 1 Oct 2024 19:26:16 -0400 Subject: set default radius eraser width --- src/client/views/nodes/DocumentView.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 80b61b6a9..d730e661b 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -1597,7 +1597,7 @@ export function ActiveArrowScale(): number { return NumCast(ActiveInkPen()?.acti export function ActiveDash(): string { return StrCast(ActiveInkPen()?.activeDash, '0'); } // prettier-ignore export function ActiveInkWidth(): number { return Number(ActiveInkPen()?.activeInkWidth); } // prettier-ignore export function ActiveInkBezierApprox(): string { return StrCast(ActiveInkPen()?.activeInkBezier); } // prettier-ignore -export function ActiveEraserWidth(): number { return Number(ActiveInkPen()?.eraserWidth); } // prettier-ignore +export function ActiveEraserWidth(): number { return Number(ActiveInkPen()?.eraserWidth ?? 25); } // prettier-ignore export function SetActiveInkWidth(width: string): void { !isNaN(parseInt(width)) && ActiveInkPen() && (ActiveInkPen().activeInkWidth = width); -- cgit v1.2.3-70-g09d2 From 22376ded1271629974bfafc31b77e3288d593c3d Mon Sep 17 00:00:00 2001 From: bobzel Date: Wed, 2 Oct 2024 12:24:11 -0400 Subject: added showTags button for cardView. fixed unnecessary invalidations of TagsView based on child screenToLocal changing when its not rendered. --- src/ClientUtils.ts | 7 ++----- src/client/util/CurrentUserUtils.ts | 5 +++-- src/client/views/DashboardView.tsx | 8 ++++---- src/client/views/TagsView.tsx | 10 ++++++++-- src/client/views/collections/CollectionCardDeckView.tsx | 10 ++++++---- src/client/views/collections/CollectionDockingView.tsx | 9 ++++----- .../views/collections/collectionFreeForm/MarqueeView.tsx | 3 +-- src/client/views/global/globalScripts.ts | 16 +++++++++++++--- src/client/views/nodes/LabelBox.tsx | 2 +- 9 files changed, 42 insertions(+), 28 deletions(-) (limited to 'src') diff --git a/src/ClientUtils.ts b/src/ClientUtils.ts index 01eda7e98..972910071 100644 --- a/src/ClientUtils.ts +++ b/src/ClientUtils.ts @@ -119,7 +119,6 @@ export namespace ClientUtils { } export function readUploadedFileAsText(inputFile: File) { - // eslint-disable-next-line no-undef const temporaryFileReader = new FileReader(); return new Promise((resolve, reject) => { @@ -163,7 +162,7 @@ export namespace ClientUtils { export function GetScreenTransform(ele?: HTMLElement | null): { scale: number; translateX: number; translateY: number } { if (!ele) { - return { scale: 1, translateX: 1, translateY: 1 }; + return { scale: 0, translateX: 1, translateY: 1 }; } const rect = ele.getBoundingClientRect(); const scale = ele.offsetWidth === 0 && rect.width === 0 ? 1 : rect.width / ele.offsetWidth; @@ -336,7 +335,7 @@ export namespace ClientUtils { try { document.execCommand('paste'); - } catch (err) { + } catch { /* empty */ } @@ -575,9 +574,7 @@ export function setupMoveUpEvents( moveEvent: (e: PointerEvent, down: number[], delta: number[]) => boolean, upEvent: (e: PointerEvent, movement: number[], isClick: boolean) => void, clickEvent: (e: PointerEvent, doubleTap?: boolean) => unknown, - // eslint-disable-next-line default-param-last stopPropagation: boolean = true, - // eslint-disable-next-line default-param-last stopMovePropagation: boolean = true, noDoubleTapTimeout?: () => void ) { diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 96d69e7a1..556c8f072 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -693,8 +693,9 @@ pie title Minerals in my tap water { title: "Type", icon:"eye", toolTip:"Sort by document type", btnType: ButtonType.ToggleButton, expertMode: false, toolType:"docType", funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}}, { title: "Color", icon:"palette", toolTip:"Sort by document color", btnType: ButtonType.ToggleButton, expertMode: false, toolType:"color", funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}}, { title: "Tags", icon:"bolt", toolTip:"Sort by document's tags", btnType: ButtonType.ToggleButton, expertMode: false, toolType:"tag", funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}}, - { title: "Pile", icon:"layer-group", toolTip:"View the cards as a pile in the free form view!",btnType: ButtonType.ClickButton, expertMode: false, toolType:"pile", funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}}, - { title: "Chat Popup",icon:"lightbulb", toolTip:"Toggle the chat popup's visibility!", width: 45, btnType: ButtonType.ToggleButton, expertMode: false, toolType:"toggle-chat",funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'} }, + { title: "Pile", icon:"layer-group", toolTip:"View the cards as a pile in the free form view", btnType: ButtonType.ClickButton, expertMode: false, toolType:"pile", funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'}}, + { title: "Chat Popup",icon:"lightbulb", toolTip:"Toggle the chat popup's visibility", width: 45, btnType: ButtonType.ToggleButton, expertMode: false, toolType:"toggle-chat",funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'} }, + { title: "Show Tags", icon:"id-card", toolTip:"Toggle tag annotation panel", width: 45, btnType: ButtonType.ToggleButton, expertMode: false, toolType:"toggle-tags",funcs: {}, scripts: { onClick: '{ return showFreeform(this.toolType, _readOnly_);}'} }, { title: "Sort", icon: "sort" , toolTip: "Manage sort order / lock status", btnType: ButtonType.MultiToggleButton, toolType:"alignment", ignoreClick: true, subMenu: [ diff --git a/src/client/views/DashboardView.tsx b/src/client/views/DashboardView.tsx index eced64524..448178397 100644 --- a/src/client/views/DashboardView.tsx +++ b/src/client/views/DashboardView.tsx @@ -433,15 +433,15 @@ export class DashboardView extends ObservableReactComponent { dashboardDoc[DocData].myPublishedDocs = new List(); dashboardDoc[DocData].myTagCollections = new List(); dashboardDoc[DocData].myUniqueFaces = new List(); - dashboardDoc[DocData].myTrails = DashboardView.SetupDashboardTrails(dashboardDoc); - dashboardDoc[DocData].myCalendars = DashboardView.SetupDashboardCalendars(dashboardDoc); + dashboardDoc[DocData].myTrails = DashboardView.SetupDashboardTrails(); + dashboardDoc[DocData].myCalendars = DashboardView.SetupDashboardCalendars(); // open this new dashboard Doc.ActiveDashboard = dashboardDoc; Doc.ActivePage = 'dashboard'; Doc.ActivePresentation = undefined; }; - public static SetupDashboardCalendars(dashboardDoc: Doc) { + public static SetupDashboardCalendars() { // this section is creating the button document itself === myTrails = new Button // create a a list of calendars (as a CalendarCollectionDocument) and store it on the new dashboard @@ -470,7 +470,7 @@ export class DashboardView extends ObservableReactComponent { return new PrefetchProxy(myCalendars); } - public static SetupDashboardTrails(dashboardDoc: Doc) { + public static SetupDashboardTrails() { // this section is creating the button document itself === myTrails = new Button const reqdBtnOpts: DocumentOptions = { _forceActive: true, diff --git a/src/client/views/TagsView.tsx b/src/client/views/TagsView.tsx index f44fd1d03..9858e7b61 100644 --- a/src/client/views/TagsView.tsx +++ b/src/client/views/TagsView.tsx @@ -274,12 +274,18 @@ export class TagsView extends ObservableReactComponent { @observable _currentInput = ''; @observable _isEditing = !StrListCast(this.View.dataDoc.tags).length; _heightDisposer: IReactionDisposer | undefined; + _lastXf = this.View.screenToContentsTransform(); componentDidMount() { this._heightDisposer = reaction( () => this.View.screenToContentsTransform(), - () => { - this._panelHeightDirty = this._panelHeightDirty + 1; + xf => { + if (xf.Scale === 0) return; + if (this.View.ComponentView?.isUnstyledView?.() || (!this.View.showTags && this._props.Views.length === 1)) return; + if (xf.TranslateX !== this._lastXf.TranslateX || xf.TranslateY !== this._lastXf.TranslateY || xf.Scale !== this._lastXf.Scale) { + this._panelHeightDirty = this._panelHeightDirty + 1; + } + this._lastXf = xf; } ); } diff --git a/src/client/views/collections/CollectionCardDeckView.tsx b/src/client/views/collections/CollectionCardDeckView.tsx index e5a6ebc7f..101cc8082 100644 --- a/src/client/views/collections/CollectionCardDeckView.tsx +++ b/src/client/views/collections/CollectionCardDeckView.tsx @@ -1,4 +1,4 @@ -import { IReactionDisposer, ObservableMap, action, computed, makeObservable, observable, reaction, trace } from 'mobx'; +import { IReactionDisposer, ObservableMap, action, computed, makeObservable, observable, reaction } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; import { ClientUtils, DashColor, returnFalse, returnZero } from '../../../ClientUtils'; @@ -139,7 +139,7 @@ export class CollectionCardView extends CollectionSubView() { * custom group */ @computed get childDocsWithoutLinks() { - return this.childDocs.filter(l => l.type !== DocumentType.LINK); + return this.childDocs.filter(l => !l.layout_isSvg); } /** @@ -402,7 +402,7 @@ export class CollectionCardView extends CollectionSubView() { PanelHeight={this.childPanelHeight} dontCenter="y" // Don't center it vertically, because the grid it's in is already doing that and we don't want to do it twice. dragAction={(this.Document.childDragAction ?? this._props.childDragAction) as dropActionType} - showTags={true} + showTags={BoolCast(this.layoutDoc.showChildTags)} dontHideOnDrag /> ); @@ -607,6 +607,8 @@ export class CollectionCardView extends CollectionSubView() { const dref = this._docRefs.get(doc); const { translateX, translateY, scale } = ClientUtils.GetScreenTransform(dref?.ContentDiv); + if (!scale) return new Transform(0, 0, 0); + return new Transform(-translateX + (dref?.centeringX || 0) * scale, -translateY + (dref?.centeringY || 0) * scale, 1) .scale(1 / scale).rotate(!isSelected ? -this.rotate(amCards, calcRowIndex) : 0); // prettier-ignore @@ -639,7 +641,7 @@ export class CollectionCardView extends CollectionSubView() { SnappingManager.SetIsResizing(undefined); this._forceChildXf++; }), - 600 + 1000 ); } })} diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx index 028133a6e..d1304b8f4 100644 --- a/src/client/views/collections/CollectionDockingView.tsx +++ b/src/client/views/collections/CollectionDockingView.tsx @@ -203,7 +203,6 @@ export class CollectionDockingView extends CollectionSubView() { } else if (instance._goldenLayout.root.contentItems[0].isRow) { // if row switch (pullSide) { - // eslint-disable-next-line default-case-last default: case OpenWhereMod.none: case OpenWhereMod.right: @@ -299,7 +298,7 @@ export class CollectionDockingView extends CollectionSubView() { this._goldenLayout.unbind('tabCreated', this.tabCreated); this._goldenLayout.unbind('tabDestroyed', this.tabDestroyed); this._goldenLayout.unbind('stackCreated', this.stackCreated); - } catch (e) { + } catch { /* empty */ } this.tabMap.clear(); @@ -380,7 +379,7 @@ export class CollectionDockingView extends CollectionSubView() { try { this._goldenLayout.unbind('stackCreated', this.stackCreated); this._goldenLayout.unbind('tabDestroyed', this.tabDestroyed); - } catch (e) { + } catch { /* empty */ } this._goldenLayout?.destroy(); @@ -507,8 +506,8 @@ export class CollectionDockingView extends CollectionSubView() { dashboardDoc.myOverlayDocs = new List(); dashboardDoc.myPublishedDocs = new List(); - DashboardView.SetupDashboardTrails(dashboardDoc); - DashboardView.SetupDashboardCalendars(dashboardDoc); // Zaul TODO: needed? + DashboardView.SetupDashboardTrails(); + DashboardView.SetupDashboardCalendars(); // Zaul TODO: needed? return DashboardView.openDashboard(dashboardDoc); } diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index b1f6815b3..10709cc00 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -685,8 +685,7 @@ export class MarqueeView extends ObservableReactComponent { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - r?.addEventListener('dashDragMovePause', this.onDragMovePause as any); + r?.addEventListener('dashDragMovePause', this.onDragMovePause as EventListenerOrEventListenerObject); this.MarqueeRef = r; }} style={{ diff --git a/src/client/views/global/globalScripts.ts b/src/client/views/global/globalScripts.ts index 0ab431740..423a2d6ef 100644 --- a/src/client/views/global/globalScripts.ts +++ b/src/client/views/global/globalScripts.ts @@ -18,7 +18,7 @@ import { InkTranscription } from '../InkTranscription'; import { InkingStroke } from '../InkingStroke'; import { MainView } from '../MainView'; import { PropertiesView } from '../PropertiesView'; -import { CollectionFreeFormView, MarqueeView } from '../collections/collectionFreeForm'; +import { CollectionFreeFormView } from '../collections/collectionFreeForm'; import { CollectionFreeFormDocumentView } from '../nodes/CollectionFreeFormDocumentView'; import { ActiveEraserWidth, @@ -135,7 +135,11 @@ ScriptingGlobals.add(function toggleOverlay(checkResult?: boolean) { }); // eslint-disable-next-line prefer-arrow-callback -ScriptingGlobals.add(function showFreeform(attr: 'hcenter' | 'vcenter' | 'grid' | 'snaplines' | 'clusters' | 'viewAll' | 'fitOnce', checkResult?: boolean, persist?: boolean) { +ScriptingGlobals.add(function showFreeform( + attr: 'flashcards' | 'hcenter' | 'vcenter' | 'grid' | 'snaplines' | 'clusters' | 'viewAll' | 'fitOnce' | 'time' | 'docType' | 'color' | 'chat' | 'up' | 'down' | 'pile' | 'toggle-chat' | 'toggle-tags' | 'tag', + checkResult?: boolean, + persist?: boolean +) { const selected = DocumentView.SelectedDocs().lastElement(); function isAttrFiltered(attribute: string) { @@ -143,7 +147,7 @@ ScriptingGlobals.add(function showFreeform(attr: 'hcenter' | 'vcenter' | 'grid' } // prettier-ignore - const map: Map<'flashcards' | 'hcenter' | 'vcenter' | 'grid' | 'snaplines' | 'clusters' | 'arrange' | 'viewAll' | 'fitOnce' | 'time' | 'docType' | 'color' | 'chat' | 'up' | 'down' | 'pile' | 'toggle-chat' | 'tag', + const map: Map<'flashcards' | 'hcenter' | 'vcenter' | 'grid' | 'snaplines' | 'clusters' | 'viewAll' | 'fitOnce' | 'time' | 'docType' | 'color' | 'chat' | 'up' | 'down' | 'pile' | 'toggle-chat' | 'toggle-tags' | 'tag', { waitForRender?: boolean; checkResult: (doc: Doc) => boolean; @@ -227,6 +231,12 @@ ScriptingGlobals.add(function showFreeform(attr: 'hcenter' | 'vcenter' | 'grid' }, }], + ['toggle-tags', { + checkResult: (doc: Doc) => BoolCast(doc?.showChildTags), + setDoc: (doc: Doc, dv: DocumentView) => { + doc.showChildTags = !doc.showChildTags; + }, + }], ['pile', { checkResult: (doc: Doc) => doc._type_collection == CollectionViewType.Freeform, setDoc: (doc: Doc, dv: DocumentView) => { diff --git a/src/client/views/nodes/LabelBox.tsx b/src/client/views/nodes/LabelBox.tsx index e39caecb6..8974cccaf 100644 --- a/src/client/views/nodes/LabelBox.tsx +++ b/src/client/views/nodes/LabelBox.tsx @@ -91,7 +91,7 @@ export class LabelBox extends ViewBoxBaseComponent() { }; if (r) { if (!r.offsetHeight || !r.offsetWidth) { - console.log("CAN'T FIT TO EMPTY BOX"); + //console.log("CAN'T FIT TO EMPTY BOX"); this._timeout && clearTimeout(this._timeout); this._timeout = setTimeout(() => this.fitTextToBox(r)); return textfitParams; -- cgit v1.2.3-70-g09d2 From 39935af9a1204e1afc20659172e5a1a26f65e35c Mon Sep 17 00:00:00 2001 From: bobzel Date: Wed, 2 Oct 2024 12:54:29 -0400 Subject: missing import --- src/client/views/collections/CollectionCarouselView.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/collections/CollectionCarouselView.tsx b/src/client/views/collections/CollectionCarouselView.tsx index bb757cc43..97d86393b 100644 --- a/src/client/views/collections/CollectionCarouselView.tsx +++ b/src/client/views/collections/CollectionCarouselView.tsx @@ -4,7 +4,7 @@ import { action, computed, makeObservable, observable } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; import { StopEvent, returnOne, returnZero } from '../../../ClientUtils'; -import { Doc, Opt } from '../../../fields/Doc'; +import { Doc, DocListCast, Opt } from '../../../fields/Doc'; import { BoolCast, DocCast, NumCast, ScriptCast, StrCast } from '../../../fields/Types'; import { DocumentType } from '../../documents/DocumentTypes'; import { Docs } from '../../documents/Documents'; -- cgit v1.2.3-70-g09d2 From 628ab7b5dc1b2d68469d07bc92bc086a44a9704e Mon Sep 17 00:00:00 2001 From: bobzel Date: Wed, 2 Oct 2024 13:00:36 -0400 Subject: from last --- src/client/views/collections/CollectionCarouselView.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/CollectionCarouselView.tsx b/src/client/views/collections/CollectionCarouselView.tsx index 97d86393b..7a3f1ae33 100644 --- a/src/client/views/collections/CollectionCarouselView.tsx +++ b/src/client/views/collections/CollectionCarouselView.tsx @@ -343,12 +343,12 @@ export class CollectionCarouselView extends CollectionSubView() { )}
-
this.togglePracticeMode(practiceMode.QUIZ)}> +
this.togglePracticeMode(practiceMode.QUIZ)}>
-
this.togglePracticeMode(practiceMode.PRACTICE)}> +
this.togglePracticeMode(practiceMode.PRACTICE)}>
-- cgit v1.2.3-70-g09d2 From 6f55a2dc0d00a50226c5ffa300d16723101f9ad7 Mon Sep 17 00:00:00 2001 From: bobzel Date: Wed, 2 Oct 2024 13:23:19 -0400 Subject: enabled creating falshcards from a text box selection. --- src/client/views/nodes/formattedText/FormattedTextBox.tsx | 1 + src/client/views/pdf/AnchorMenu.tsx | 1 - 2 files changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 9024d7e1d..a5380e6ac 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -231,6 +231,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent { AnchorMenu.Instance.Status = 'marquee'; AnchorMenu.Instance.gptFlashcards = this.gptPDFFlashcards; + AnchorMenu.Instance.addToCollection = this._props.DocumentView?.()._props.addDocument; AnchorMenu.Instance.OnClick = () => { !this.layoutDoc.layout_showSidebar && this.toggleSidebar(); setTimeout(() => this._sidebarRef.current?.anchorMenuClick(this.makeLinkAnchor(undefined, OpenWhere.addRight, undefined, 'Anchored Selection', true))); // give time for sidebarRef to be created diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx index d29e11593..bff112017 100644 --- a/src/client/views/pdf/AnchorMenu.tsx +++ b/src/client/views/pdf/AnchorMenu.tsx @@ -145,7 +145,6 @@ export class AnchorMenu extends AntimodeMenu { const senArr = text.trim().split('Question: '); const collectionArr: Doc[] = []; for (let i = 1; i < senArr.length; i++) { - console.log('Arr ' + i + ': ' + senArr[i]); const newDoc = Docs.Create.ComparisonDocument(senArr[i], { _layout_isFlashcard: true, _width: 300, _height: 300 }); newDoc.text = senArr[i]; -- cgit v1.2.3-70-g09d2 From fbea2a097191f22ae20a609760bd632fc98ca414 Mon Sep 17 00:00:00 2001 From: bobzel Date: Wed, 2 Oct 2024 17:53:50 -0400 Subject: added xMargin for carousel to prevent buttons from overlapping text, etc. Made showing tags an option for carouselViews that needs to be turned on with showChildTags. Gave text boxes extra height when show Tags is on. --- src/client/views/collections/CollectionCarouselView.tsx | 3 ++- src/client/views/nodes/formattedText/FormattedTextBox.tsx | 15 ++++++++++----- 2 files changed, 12 insertions(+), 6 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/CollectionCarouselView.tsx b/src/client/views/collections/CollectionCarouselView.tsx index 74cf580c9..8b3a699ed 100644 --- a/src/client/views/collections/CollectionCarouselView.tsx +++ b/src/client/views/collections/CollectionCarouselView.tsx @@ -165,7 +165,7 @@ export class CollectionCarouselView extends CollectionSubView() { NativeWidth={returnZero} NativeHeight={returnZero} fitWidth={this._props.childLayoutFitWidth} - showTags={true} + showTags={BoolCast(this.layoutDoc.showChildTags)} containerViewPath={this.childContainerViewPath} setContentViewBox={undefined} ScreenToLocalTransform={this.childScreenToLocalXf} @@ -178,6 +178,7 @@ export class CollectionCarouselView extends CollectionSubView() { LayoutTemplate={this._props.childLayoutTemplate} LayoutTemplateString={this._props.childLayoutString} TemplateDataDocument={DocCast(Doc.Layout(doc).resolvedDataDoc)} + xPadding={35} PanelHeight={this.panelHeight} /> ); diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index d3bc08bd3..1e6984e3d 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1194,6 +1194,10 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent ({ sidebarHeight: this.sidebarHeight, textHeight: this.textHeight, layoutAutoHeight: this.layout_autoHeight, marginsHeight: this.layout_autoHeightMargins }), - ({ sidebarHeight, textHeight, layoutAutoHeight, marginsHeight }) => { - const newHeight = this.contentScaling * (marginsHeight + Math.max(sidebarHeight, textHeight)); + () => ({ sidebarHeight: this.sidebarHeight, textHeight: this.textHeight, layoutAutoHeight: this.layout_autoHeight, marginsHeight: this.layout_autoHeightMargins, tagsHeight: this.tagsHeight }), + ({ sidebarHeight, textHeight, layoutAutoHeight, marginsHeight, tagsHeight }) => { + const newHeight = this.contentScaling * (tagsHeight + marginsHeight + Math.max(sidebarHeight, textHeight)); if ( (!Array.from(FormattedTextBox._globalHighlights).includes('Bold Text') || this._props.isSelected()) && // layoutAutoHeight && @@ -2003,8 +2007,8 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent !this._props.isContentActive() && FormattedTextBoxComment.textBox === this && FormattedTextBoxComment.Hide); - const paddingX = NumCast(this.layoutDoc._xMargin, this._props.xPadding || 0); - const paddingY = NumCast(this.layoutDoc._yMargin, this._props.yPadding || 0); + const paddingX = Math.max(this._props.xPadding ?? 0, NumCast(this.layoutDoc._xMargin)); + const paddingY = Math.max(this._props.yPadding ?? 0, NumCast(this.layoutDoc._yMargin)); const styleFromLayout = styleFromLayoutString(this.Document, this._props, scale); // this converts any expressions in the format string to style props. e.g., return styleFromLayout?.height === '0px' ? null : (
Date: Wed, 2 Oct 2024 18:01:54 -0400 Subject: fixed bottom padding in textbox for tags to depend on yMargins. --- src/client/views/nodes/formattedText/FormattedTextBox.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 1e6984e3d..5db854b69 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1195,7 +1195,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent