From 0b0d50f197ca06ebd0e8e6a671b02cdb4032a219 Mon Sep 17 00:00:00 2001 From: bobzel Date: Fri, 5 Apr 2024 22:03:28 -0400 Subject: fixed opening up GAI ImageEditor --- src/client/views/nodes/ImageBox.tsx | 50 +++++++++++++++++++++---------------- 1 file changed, 29 insertions(+), 21 deletions(-) (limited to 'src/client/views/nodes/ImageBox.tsx') diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index 469869e21..cb799abd9 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -1,13 +1,15 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { Tooltip } from '@mui/material'; -import { action, computed, IReactionDisposer, makeObservable, observable, ObservableMap, reaction } from 'mobx'; +import { Colors } from 'browndash-components'; +import { action, computed, IReactionDisposer, makeObservable, observable, ObservableMap, reaction, runInAction } from 'mobx'; import { observer } from 'mobx-react'; import { extname } from 'path'; import * as React from 'react'; -import { Doc, DocListCast, Opt } from '../../../fields/Doc'; +import { Doc, Opt } from '../../../fields/Doc'; import { DocData } from '../../../fields/DocSymbols'; import { Id } from '../../../fields/FieldSymbols'; import { InkTool } from '../../../fields/InkField'; +import { List } from '../../../fields/List'; import { ObjectField } from '../../../fields/ObjectField'; import { Cast, ImageCast, NumCast, StrCast } from '../../../fields/Types'; import { ImageField } from '../../../fields/URLField'; @@ -15,6 +17,7 @@ import { TraceMobx } from '../../../fields/util'; import { DashColor, emptyFunction, returnEmptyString, returnFalse, returnOne, returnZero, setupMoveUpEvents, Utils } from '../../../Utils'; import { Docs, DocUtils } from '../../documents/Documents'; import { DocumentType } from '../../documents/DocumentTypes'; +import { Networking } from '../../Network'; import { DocumentManager } from '../../util/DocumentManager'; import { DragManager } from '../../util/DragManager'; import { undoBatch } from '../../util/UndoManager'; @@ -23,35 +26,40 @@ import { CollectionFreeFormView } from '../collections/collectionFreeForm/Collec import { ContextMenuProps } from '../ContextMenuItem'; import { ViewBoxAnnotatableComponent, ViewBoxInterface } from '../DocComponent'; import { MarqueeAnnotator } from '../MarqueeAnnotator'; +import { OverlayView } from '../OverlayView'; import { AnchorMenu } from '../pdf/AnchorMenu'; import { StyleProp } from '../StyleProvider'; import { OpenWhere } from './DocumentView'; -import { FocusViewOptions, FieldView, FieldViewProps } from './FieldView'; +import { FieldView, FieldViewProps, FocusViewOptions } from './FieldView'; import './ImageBox.scss'; import { PinProps, PresBox } from './trails'; -import { Colors } from 'browndash-components'; -import { listSpec } from '../../../fields/Schema'; -import { List } from '../../../fields/List'; -import { url } from 'inspector'; -import { OverlayView } from '../OverlayView'; -import { Networking } from '../../Network'; +export class ImageEditorData { + private static _instance: ImageEditorData; + private static get imageData() { return (ImageEditorData._instance ?? new ImageEditorData()).imageData; } // prettier-ignore + @observable imageData: { rootDoc: Doc | undefined; open: boolean; source: string } = observable({ rootDoc: undefined, open: false, source: '' }); + @action private static set = (open: boolean, rootDoc: Doc | undefined, source: string) => (this._instance.imageData = { open, rootDoc, source }); + + constructor() { + makeObservable(this); + ImageEditorData._instance = this; + } + + public static get Open() { return ImageEditorData.imageData.open; } // prettier-ignore + public static get Source() { return ImageEditorData.imageData.source; } // prettier-ignore + public static get RootDoc() { return ImageEditorData.imageData.rootDoc; } // prettier-ignore + public static set Open(open: boolean) { ImageEditorData.set(open, this.imageData.rootDoc, this.imageData.source); } // prettier-ignore + public static set Source(source: string) { ImageEditorData.set(this.imageData.open, this.imageData.rootDoc, source); } // prettier-ignore + public static set RootDoc(rootDoc: Opt) { ImageEditorData.set(this.imageData.open, rootDoc, this.imageData.source); } // prettier-ignore +} @observer export class ImageBox extends ViewBoxAnnotatableComponent() implements ViewBoxInterface { public static LayoutString(fieldKey: string) { return FieldView.LayoutString(ImageBox, fieldKey); } - @observable public static imageRootDoc: Doc | undefined = undefined; - @observable public static imageEditorOpen: boolean = false; - @observable public static imageEditorSource: string = ''; @observable public static addDoc: ((doc: Doc | Doc[], annotationKey?: string) => boolean) | undefined = undefined; - @action public static setImageEditorOpen(open: boolean) { - ImageBox.imageEditorOpen = open; - } - @action public static setImageEditorSource(source: string) { - ImageBox.imageEditorSource = source; - } + private _ignoreScroll = false; private _forcedScroll = false; private _dropDisposer?: DragManager.DragDropDisposer; @@ -248,10 +256,10 @@ export class ImageBox extends ViewBoxAnnotatableComponent() impl funcs.push({ description: 'Open Image Editor', event: action(() => { - ImageBox.setImageEditorOpen(true); - ImageBox.setImageEditorSource(this.choosePath(field.url)); + ImageEditorData.Open = true; + ImageEditorData.Source = this.choosePath(field.url); ImageBox.addDoc = this._props.addDocument; - ImageBox.imageRootDoc = this.Document; + ImageEditorData.RootDoc = this.Document; }), icon: 'pencil-alt', }); -- cgit v1.2.3-70-g09d2 From 3b90916af8ffcbeaf5b8a3336009b84e19c22fa9 Mon Sep 17 00:00:00 2001 From: bobzel Date: Fri, 5 Apr 2024 22:23:31 -0400 Subject: from last --- src/client/views/MainView.tsx | 2 +- src/client/views/nodes/ImageBox.tsx | 17 ++++++++--------- 2 files changed, 9 insertions(+), 10 deletions(-) (limited to 'src/client/views/nodes/ImageBox.tsx') diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index fad53523c..58b8d255a 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -1042,7 +1042,7 @@ export class MainView extends ObservableReactComponent<{}> { - + {/* */} ); diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index cb799abd9..bb1f70f97 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -37,8 +37,8 @@ import { PinProps, PresBox } from './trails'; export class ImageEditorData { private static _instance: ImageEditorData; private static get imageData() { return (ImageEditorData._instance ?? new ImageEditorData()).imageData; } // prettier-ignore - @observable imageData: { rootDoc: Doc | undefined; open: boolean; source: string } = observable({ rootDoc: undefined, open: false, source: '' }); - @action private static set = (open: boolean, rootDoc: Doc | undefined, source: string) => (this._instance.imageData = { open, rootDoc, source }); + @observable imageData: { rootDoc: Doc | undefined; open: boolean; source: string; addDoc: Opt<(doc: Doc | Doc[], annotationKey?: string) => boolean> } = observable({ rootDoc: undefined, open: false, source: '', addDoc: undefined }); + @action private static set = (open: boolean, rootDoc: Doc | undefined, source: string, addDoc: Opt<(doc: Doc | Doc[], annotationKey?: string) => boolean>) => (this._instance.imageData = { open, rootDoc, source, addDoc }); constructor() { makeObservable(this); @@ -48,18 +48,17 @@ export class ImageEditorData { public static get Open() { return ImageEditorData.imageData.open; } // prettier-ignore public static get Source() { return ImageEditorData.imageData.source; } // prettier-ignore public static get RootDoc() { return ImageEditorData.imageData.rootDoc; } // prettier-ignore - public static set Open(open: boolean) { ImageEditorData.set(open, this.imageData.rootDoc, this.imageData.source); } // prettier-ignore - public static set Source(source: string) { ImageEditorData.set(this.imageData.open, this.imageData.rootDoc, source); } // prettier-ignore - public static set RootDoc(rootDoc: Opt) { ImageEditorData.set(this.imageData.open, rootDoc, this.imageData.source); } // prettier-ignore + public static get AddDoc() { return ImageEditorData.imageData.addDoc; } // prettier-ignore + public static set Open(open: boolean) { ImageEditorData.set(open, this.imageData.rootDoc, this.imageData.source, this.imageData.addDoc); } // prettier-ignore + public static set Source(source: string) { ImageEditorData.set(this.imageData.open, this.imageData.rootDoc, source, this.imageData.addDoc); } // prettier-ignore + public static set RootDoc(rootDoc: Opt) { ImageEditorData.set(this.imageData.open, rootDoc, this.imageData.source, this.imageData.addDoc); } // prettier-ignore + public static set AddDoc(addDoc: Opt<(doc: Doc | Doc[], annotationKey?: string) => boolean>) { ImageEditorData.set(this.imageData.open, this.imageData.rootDoc, this.imageData.source, addDoc); } // prettier-ignore } @observer export class ImageBox extends ViewBoxAnnotatableComponent() implements ViewBoxInterface { public static LayoutString(fieldKey: string) { return FieldView.LayoutString(ImageBox, fieldKey); } - - @observable public static addDoc: ((doc: Doc | Doc[], annotationKey?: string) => boolean) | undefined = undefined; - private _ignoreScroll = false; private _forcedScroll = false; private _dropDisposer?: DragManager.DragDropDisposer; @@ -258,7 +257,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent() impl event: action(() => { ImageEditorData.Open = true; ImageEditorData.Source = this.choosePath(field.url); - ImageBox.addDoc = this._props.addDocument; + ImageEditorData.AddDoc = this._props.addDocument; ImageEditorData.RootDoc = this.Document; }), icon: 'pencil-alt', -- cgit v1.2.3-70-g09d2