diff options
Diffstat (limited to 'src/client')
5 files changed, 55 insertions, 53 deletions
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss index 82887a7a5..6dabcb8b2 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss @@ -326,7 +326,6 @@ .collectionFreeFormView-aiView-regenerate-container { text-align: start; font-weight: normal; - padding: 5px; width: 100%; display: flex; .collectionFreeformView-aiView-subtitle { diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 0d593f97f..eeb97bf15 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -2209,7 +2209,7 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection placeholder={this._drawingFillInput || StrCast(this.Document.title) || 'Describe image'} type="text" value={this._drawingFillInput} - onChange={action(e => this._canInteract && (this._drawingFillInput = e.target.value))} + onChange={action(e => {this._drawingFillInput = e.target.value})} /> <div className="collectionfreeformview-aiView-strength"> Similarity @@ -2228,7 +2228,6 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection onChange={action((e, val) => (this._fireflyRefStrength = val as number))} valueLabelDisplay="auto" /> - Reference Strength </div> <Button text="Send" @@ -2257,7 +2256,7 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection aria-label="Edit instructions input" type="text" value={this._regenInput} - onChange={action(e => this._canInteract && (this._regenInput = e.target.value))} + onChange={action(e => {this._regenInput = e.target.value})} placeholder="..under development.." /> <Button diff --git a/src/client/views/nodes/DocumentView.scss b/src/client/views/nodes/DocumentView.scss index e71f391c6..cd813cb67 100644 --- a/src/client/views/nodes/DocumentView.scss +++ b/src/client/views/nodes/DocumentView.scss @@ -281,7 +281,6 @@ .documentView-editorView { width: 100%; - overflow-y: scroll; scrollbar-width: thin; justify-items: center; background-color: rgb(223, 223, 223); diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index ec6ce8c2a..82d8ea5f1 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -13,7 +13,7 @@ import { DocData } from '../../../fields/DocSymbols'; import { Id } from '../../../fields/FieldSymbols'; import { InkTool } from '../../../fields/InkField'; import { ObjectField } from '../../../fields/ObjectField'; -import { Cast, ImageCast, NumCast, RTFCast, StrCast } from '../../../fields/Types'; +import { Cast, DocCast, ImageCast, NumCast, RTFCast, StrCast } from '../../../fields/Types'; import { ImageField } from '../../../fields/URLField'; import { TraceMobx } from '../../../fields/util'; import { emptyFunction } from '../../../Utils'; @@ -540,34 +540,31 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { protected _inputWidth = 50; protected _sideBtnMaxPanelPct = 0.12; @observable _filterFunc: ((doc: Doc) => boolean) | undefined = undefined; + @observable private _fireflyRefStrength = 0; @computed get contentScaling() { return this.ScreenToLocalBoxXf().Scale; } // prettier-ignore @computed get maxWidgetSize() { return Math.min(this._btnWidth * this.contentScaling, (this._props.fitWidth?.(this.Document) && this._props.PanelWidth() > NumCast(this.layoutDoc._width) ? 1 : this._sideBtnMaxPanelPct) * NumCast(this.layoutDoc.width, 1)); } // prettier-ignore @computed get uiBtnScaling() { return this.maxWidgetSize / this._btnWidth; } // prettier-ignore @computed get uiInputScaling() { return this.maxWidgetSize / this._inputWidth; } // prettier-ignore - componentAIViewHistory = () => { - const imgs: FireflyImageData[] = this.dataDoc.ai_firefly_history ? JSON.parse(StrCast(this.dataDoc.ai_firefly_history)) : []; - return ( - <div className="imageBox-aiView-history"> - <Button text="Clear History" type={Type.SEC} size={Size.XSMALL} /> - {this._prevImgs.map(img => ( - <div key={img.pathname}> - <img - className="imageBox-aiView-img" - src={ClientUtils.prepend(img.pathname.replace(extname(img.pathname), '_s' + extname(img.pathname)))} - onClick={() => { - this.dataDoc[this.fieldKey] = new ImageField(img.pathname); - this.dataDoc.ai_firefly_prompt = img.prompt; - this.dataDoc.ai_firefly_seed = img.seed; - }} - /> - <span>{img.prompt}</span> - </div> - ))} - </div> - ); - }; - @observable private _fireflyRefStrength = 0; + componentAIViewHistory = () => ( + <div className="imageBox-aiView-history"> + <Button text="Clear History" type={Type.SEC} size={Size.XSMALL} /> + {this._prevImgs.map(img => ( + <div key={img.pathname}> + <img + className="imageBox-aiView-img" + src={ClientUtils.prepend(img.pathname.replace(extname(img.pathname), '_s' + extname(img.pathname)))} + onClick={() => { + this.dataDoc[this.fieldKey] = new ImageField(img.pathname); + this.dataDoc.ai_firefly_prompt = img.prompt; + this.dataDoc.ai_firefly_seed = img.seed; + }} + /> + <span>{img.prompt}</span> + </div> + ))} + </div> + ); componentAIView = () => { const field = this.dataDoc[this.fieldKey] instanceof ImageField ? Cast(this.dataDoc[this.fieldKey], ImageField, null) : new ImageField(String(this.dataDoc[this.fieldKey])); @@ -611,7 +608,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { onClick={action(async () => { this._regenerateLoading = true; if (this._fireflyRefStrength) { - DrawingFillHandler.drawingToImage(this.props.Document, this._fireflyRefStrength, this._regenInput || StrCast(this.Document.title))?.then( + DrawingFillHandler.drawingToImage(this.props.Document, this._fireflyRefStrength, this._regenInput || StrCast(this.Document.title), this.Document)?.then( action(() => { this._regenerateLoading = false; }) @@ -640,7 +637,7 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { <div className="imageBox-aiView-options-container"> <span className="imageBox-aiView-subtitle"> More Options: </span> <div className="imageBox-aiView-options"> - {showRegenerate && ( + {SmartDrawHandler.Instance.ShowRegenerate && ( <text className="imageBox-aiView-subtitle" style={{ transform: `scale(${this.uiBtnScaling})` }}> More Options: </text> @@ -692,7 +689,12 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { }).then((info: Upload.ImageInformation) => { const img = Docs.Create.ImageDocument(info.accessPaths.agnostic.client, { title: 'expand:' + this.Document.title }); DocUtils.assignImageInfo(info, img); - this._props.addDocTab(img, OpenWhere.addRight); + const genratedDocs = this.Document.generatedDocs + ? DocCast(this.Document.generatedDocs) + : Docs.Create.MasonryDocument([], { _width: 400, _height: 400, x: NumCast(this.Document.x) + NumCast(this.Document.width), y: NumCast(this.Document.y) }); + Doc.AddDocToList(genratedDocs, undefined, img); + this.Document[DocData].generatedDocs = genratedDocs; + if (!DocumentView.getFirstDocumentView(genratedDocs)) this._props.addDocTab(genratedDocs, OpenWhere.addRight); }); }} /> diff --git a/src/client/views/smartdraw/DrawingFillHandler.tsx b/src/client/views/smartdraw/DrawingFillHandler.tsx index cd15d19d5..6f2d1cbe6 100644 --- a/src/client/views/smartdraw/DrawingFillHandler.tsx +++ b/src/client/views/smartdraw/DrawingFillHandler.tsx @@ -1,7 +1,7 @@ import { imageUrlToBase64 } from '../../../ClientUtils'; import { Doc } from '../../../fields/Doc'; import { DocData } from '../../../fields/DocSymbols'; -import { DocCast, ImageCast } from '../../../fields/Types'; +import { DocCast, ImageCast, NumCast } from '../../../fields/Types'; import { Upload } from '../../../server/SharedMediaTypes'; import { gptDescribeImage } from '../../apis/gpt/GPT'; import { Docs } from '../../documents/Documents'; @@ -12,13 +12,15 @@ import { AspectRatioLimits, FireflyDimensionsMap, FireflyImageDimensions, Firefl const DashDropboxId = '2m86iveqdr9vzsa'; export class DrawingFillHandler { - static drawingToImage = async (drawing: Doc, strength: number, user_prompt: string) => { + static drawingToImage = async (drawing: Doc, strength: number, user_prompt: string, styleDoc?: Doc) => { const docData = drawing[DocData]; const tags: string[] = ((docData?.tags as unknown as string[]) ?? []).map(tag => tag.slice(1)) ?? []; const styles = tags.filter(tag => FireflyStylePresets.has(tag)); - const styleDocs = Doc.Links(drawing) - .map(link => Doc.getOppositeAnchor(link, drawing)) - .map(anchor => anchor && DocCast(anchor.embedContainer)); + const styleDocs = styleDoc + ? [styleDoc] + : Doc.Links(drawing) + .map(link => Doc.getOppositeAnchor(link, drawing)) + .map(anchor => anchor && DocCast(anchor.embedContainer)); const styleRef = styleDocs.filter(doc => doc !== undefined && doc.type === 'image').lastElement(); let styleUrl: string | undefined; if (styleRef) { @@ -47,25 +49,26 @@ export class DrawingFillHandler { const structureUrl = `${hrefParts.slice(0, -1).join('.')}_o.${hrefParts.lastElement()}`; return imageUrlToBase64(structureUrl) .then(gptDescribeImage) - .then(prompt => - Networking.PostToServer('/queryFireflyImageFromStructure', { prompt: `${user_prompt || prompt}`, width: dims.width, height: dims.height, structure: structureUrl, strength, presets: styles, styleUrl }) - .then((info: Upload.ImageInformation) => - DocumentViewInternal.addDocTabFunc( - Docs.Create.ImageDocument(info.accessPaths.agnostic.client, { - ai: 'firefly', - title: user_prompt || prompt, - ai_firefly_prompt: user_prompt || prompt, - _width: 500, - data_nativeWidth: info.nativeWidth, - data_nativeHeight: info.nativeHeight, - }), - OpenWhere.addRight - ) - ) + .then((prompt, newPrompt = user_prompt || prompt) => + Networking.PostToServer('/queryFireflyImageFromStructure', { prompt: `${newPrompt}`, width: dims.width, height: dims.height, structure: structureUrl, strength, presets: styles, styleUrl }) + .then((info: Upload.ImageInformation) => { + const img = Docs.Create.ImageDocument(info.accessPaths.agnostic.client, { + ai: 'firefly', + title: newPrompt, + ai_firefly_prompt: newPrompt, + _width: 500, + data_nativeWidth: info.nativeWidth, + data_nativeHeight: info.nativeHeight, + }); + const genratedDocs = drawing.generatedDocs ? DocCast(drawing.generatedDocs) : Docs.Create.MasonryDocument([], { _width: 400, _height: 400, x: NumCast(drawing.x) + NumCast(drawing.width), y: NumCast(drawing.y) }); + drawing[DocData].generatedDocs = genratedDocs; + Doc.AddDocToList(genratedDocs, undefined, img); + if (!DocumentView.getFirstDocumentView(genratedDocs)) DocumentViewInternal.addDocTabFunc(genratedDocs, OpenWhere.addRight); + }) .catch(e => { if (e.toString().includes('Dropbox') && confirm('Create image failed. Try authorizing DropBox?\r\n' + e.toString().replace(/^[^"]*/, ''))) { window.open(`https://www.dropbox.com/oauth2/authorize?client_id=${DashDropboxId}&response_type=code&token_access_type=offline&redirect_uri=http://localhost:1050/refreshDropbox`, '_blank')?.focus(); - } + } else alert(e.toString()); }) ); // prettier-ignore:q } |