diff options
Diffstat (limited to 'src')
11 files changed, 176 insertions, 90 deletions
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.scss b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.scss index 277ca8238..082ebb7dc 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.scss +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.scss @@ -304,7 +304,7 @@ display: flex; flex-direction: column; justify-content: flex-start; - height: 100%; + height: fit-content; position: absolute; right: 0px; top: 0px; @@ -376,16 +376,11 @@ .docCreatorMenu-preview-image{ background-color: transparent; - height: 100px; - width: 100px; + height: 100%; display: block; object-fit: contain; border-radius: 5px; - &.expanded { - height: 100%; - width: 100%; - } } .docCreatorMenu-variation-prompt-input { @@ -431,31 +426,23 @@ flex-direction: row; justify-content: center; align-items: center; - position: relative; - width: auto; + position: absolute; + width: 100%; + bottom: 0px; margin: 0px; + margin-bottom: 10px; margin-top: 5px; padding: 0px; } .docCreatorMenu-templates-preview-window { - display: flex; - flex-direction: row; - justify-content: flex-start; - align-items: center; - overflow-y: scroll; - gap: 10px; + display: grid; + justify-content: space-evenly; + grid-template-columns: repeat(auto-fill, minmax(225px, 30%)); + gap: 1rem; margin: 5px; - position: relative; - color: black; - height: 100%; width: calc(100% - 10px); - -ms-overflow-style: none; - scrollbar-width: none; - - .loading-spinner { - justify-self: center; - } + padding-bottom: 40px; } .divvv{ @@ -468,6 +455,7 @@ position: relative; display: flex; flex-direction: row; + color: whitesmoke; width: 100%; } diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx index b626fc70c..2ddaa214c 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx @@ -35,7 +35,7 @@ import { DrawingFillHandler } from '../../../smartdraw/DrawingFillHandler'; import { CgPathIntersect } from 'react-icons/cg'; import { StaticContentField } from './TemplateFieldTypes/StaticContentField'; import { TemplateMenuAIUtils } from './Backend/TemplateMenuAIUtils' -import { TemplateSidescrollView } from './Menu/TemplatesSidescrollDisplay'; +import { TemplatePreviewGrid } from './Menu/TemplatePreviewGrid'; import { TemplateEditingWindow } from './Menu/TemplateEditingWindow'; export enum LayoutType { @@ -133,6 +133,8 @@ export class DocCreatorMenu extends ObservableReactComponent<DocCreateMenuProps> @observable _initDimensions: { width: number; height: number; x?: number; y?: number } = { width: 300, height: 400, x: undefined, y: undefined }; @observable _menuDimensions: { width: number; height: number } = { width: 400, height: 400 }; + @observable _variations: Template[] = []; + constructor(props: DocCreateMenuProps) { super(props); makeObservable(this); @@ -591,9 +593,9 @@ export class DocCreatorMenu extends ObservableReactComponent<DocCreateMenuProps> ); }; - generateVariations = async (onDoc: Doc, prompt: string): Promise<Doc[]> => { + generateVariations = async (onDoc: Doc, prompt: string): Promise<string[]> => { this._loadingVariants = true; - this.variationDocss = []; + this.variations = []; const mainCollection = this._dataViz?.DocumentView?.().containerViewPath?.().lastElement()?.ComponentView as CollectionFreeFormView; const clone: Doc = (await Doc.MakeClone(onDoc)).clone; @@ -605,17 +607,13 @@ export class DocCreatorMenu extends ObservableReactComponent<DocCreateMenuProps> this._loadingVariants = false; - return this.variationDocss; + return this.variations; } - @observable variationDocss: Doc[] = [] + @observable variations: string[] = [] - @action addVariationDoc = (doc: Doc) => { - this.variationDocss.push(doc); - const mainCollection = this._dataViz?.DocumentView?.().containerViewPath?.().lastElement()?.ComponentView as CollectionFreeFormView; - mainCollection.addDocument(doc); - doc.x = 10000; - doc.y = 10000; + @action addVariation = (url: string) => { + this.variations.push(url); } addRenderedCollectionToMainview = () => { @@ -767,8 +765,8 @@ export class DocCreatorMenu extends ObservableReactComponent<DocCreateMenuProps> this._renderedDocCollection = collection; - const mainCollection = this._dataViz?.DocumentView?.().containerViewPath?.().lastElement()?.ComponentView as CollectionFreeFormView; - mainCollection.addDocument(collection); + // const mainCollection = this._dataViz?.DocumentView?.().containerViewPath?.().lastElement()?.ComponentView as CollectionFreeFormView; + // mainCollection.addDocument(collection); console.log('changed to: ', collection); }; @@ -1060,15 +1058,24 @@ export class DocCreatorMenu extends ObservableReactComponent<DocCreateMenuProps> ); } + @computed get editingView() { + return <TemplateEditingWindow + setupButtonClick={this.setUpButtonClick} + template={this._currEditingTemplate as Template} + menu={this} + /> + } + get renderSelectedViewType() { switch (this._menuContent) { case 'templates': return ( <div className='docCreatorMenu-templates-view'> <div className="docCreatorMenu-templates-displays"> - <TemplateSidescrollView + <TemplatePreviewGrid title={'Suggested Templates'} menu={this} + optionsButtonOpts={['gear', () => (this._menuContent = 'dashboard')]} setupButtonClick={this.setUpButtonClick} templates={this._suggestedTemplates} /> @@ -1083,11 +1090,7 @@ export class DocCreatorMenu extends ObservableReactComponent<DocCreateMenuProps> </div> ) case 'templateEditing': - return <TemplateEditingWindow - setupButtonClick={this.setUpButtonClick} - template={this._currEditingTemplate as Template} - menu={this} - /> + return this.editingView case 'options': return this.optionsMenuContents; case 'dashboard': return this.dashboardContents; } // prettier-ignore diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplateEditingWindow.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplateEditingWindow.tsx index 08a48ccb9..f34b7efcf 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplateEditingWindow.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplateEditingWindow.tsx @@ -7,13 +7,15 @@ import { Doc, returnEmptyDoclist } from "../../../../../../fields/Doc"; import { DefaultStyleProvider } from "../../../../StyleProvider"; import { DocumentView, DocumentViewInternal } from "../../../DocumentView"; import { DocCreatorMenu } from "../DocCreatorMenu"; -import { TemplateSidescrollView } from "./TemplatesSidescrollDisplay"; +import { TemplatePreviewGrid } from "./TemplatePreviewGrid"; import { observer } from "mobx-react"; import { Transform } from "../../../../../util/Transform"; import { Template } from "../Template"; import { TemplateMenuAIUtils } from "../Backend/TemplateMenuAIUtils"; import { ObservableReactComponent } from "../../../../ObservableReactComponent"; import { IDisposer } from "mobx-utils"; +import { ImageField } from "../../../../../../fields/URLField"; +import { TemplatePreviewBoxProps } from "./TemplatePreviewBox"; interface TemplateEditingWindowProps { menu: DocCreatorMenu; @@ -28,8 +30,10 @@ export class TemplateEditingWindow extends ObservableReactComponent<TemplateEdit private previewWindow: HTMLDivElement | null = null; private _disposers: { [name: string]: IDisposer } = {}; + @observable _loading: boolean = false; @observable _variationsTabOpen: boolean = false; - @observable _variations: Doc[] = []; + @observable _variationURLs: string[] = []; + @observable _variations: Template[] = []; componentDidMount(): void { this._disposers.windowDimensions = reaction(() => @@ -57,15 +61,24 @@ export class TemplateEditingWindow extends ObservableReactComponent<TemplateEdit } } + func = () => { + this._props.menu._variations.forEach(variation => { + variation.setImageAsBackground('https://www.onthegotours.com/repository/Great-Wall-New-Pic-228551391689622.jpg', true) + }); + } + get fireflyVariationsTab() { return ( <> - <TemplateSidescrollView + <div className="docCreatorMenu-option-divider full no-margin-bottom"/> + <TemplatePreviewGrid menu={this._props.menu} title={'Generate Variations'} - templates={[]} + templates={this._props.menu._variations} + optionsButtonOpts={['gear', this.func]} setupButtonClick={this._props.setupButtonClick} + previewBoxRightButtonOpts={['gear', (component: ObservableReactComponent<TemplatePreviewBoxProps>) => {component.forceUpdate();}]} /> <div className="docCreatorMenu-section"> <div className="docCreatorMenu-variation-prompt-input"> @@ -77,7 +90,21 @@ export class TemplateEditingWindow extends ObservableReactComponent<TemplateEdit /> <button className="docCreatorMenu-menu-button" onPointerDown={e => this._props.setupButtonClick(e, async () => { - this._variations = await this._props.menu.generateVariations(this._props.template.getRenderedDoc()!, this.fireflyPrompt); + this._props.menu._variations = []; + this._loading = true; + this._variationURLs = await this._props.menu.generateVariations(this._props.template.getRenderedDoc()!, this.fireflyPrompt); + const templates: Template[] = []; + this._variationURLs.forEach(url => { + const newTemplate: Template = this._props.template.cloneBase(); + newTemplate.setImageAsBackground(url, true); + templates.push(newTemplate); + }); + this._loading = false; + setTimeout(() => { + console.log('setting') + this._props.menu._variations = templates; + this.forceUpdate(); + }, 1000); }) }> <FontAwesomeIcon icon="arrows-rotate" /> @@ -101,7 +128,7 @@ export class TemplateEditingWindow extends ObservableReactComponent<TemplateEdit removeDocument={returnFalse} PanelWidth={() => this.previewWindow?.clientWidth ?? 500} PanelHeight={() => this.previewWindow?.clientHeight ?? 500} - ScreenToLocalTransform={() => new Transform(/*-this._props.menu._pageX - 5, -this._props.menu._pageY - 35*/0, 0, 1)} + ScreenToLocalTransform={() => new Transform(-this._props.menu._pageX - 5, -this._props.menu._pageY - 35, 1)} renderDepth={5} whenChildContentsActiveChanged={emptyFunction} focus={emptyFunction} @@ -124,7 +151,6 @@ export class TemplateEditingWindow extends ObservableReactComponent<TemplateEdit <div className="docCreatorMenu-expanded-template-preview"> <div className="top-panel"/> {this.renderedDocPreview} - <div className="docCreatorMenu-option-divider full"/> {this._variationsTabOpen ? this.fireflyVariationsTab : null} <div className="right-buttons-panel"> <button @@ -141,8 +167,8 @@ export class TemplateEditingWindow extends ObservableReactComponent<TemplateEdit </button> <button className="docCreatorMenu-menu-button section-reveal-options top-right" onPointerDown={e => this._props.setupButtonClick(e, async () => { this.setVariationTab(!this._variationsTabOpen); + // this._props.template.setImageAsBackground('https://www.onthegotours.com/repository/Great-Wall-New-Pic-228551391689622.jpg', true); this.forceUpdate(); - console.log('window: ', this.previewWindow) })}> <FontAwesomeIcon icon="lightbulb" /> </button> diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplatePreviewBox.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplatePreviewBox.tsx index e63be8f9c..a7270e540 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplatePreviewBox.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplatePreviewBox.tsx @@ -11,8 +11,10 @@ import { emptyFunction } from "../../../../../../Utils"; import { returnEmptyFilter, returnFalse } from "../../../../../../ClientUtils"; import { Transform } from "../../../../../util/Transform"; import { DefaultStyleProvider } from "../../../../StyleProvider"; -import { returnEmptyDoclist } from "../../../../../../fields/Doc"; +import { Doc, returnEmptyDoclist } from "../../../../../../fields/Doc"; import { IDisposer } from "mobx-utils"; +import { ImageField } from "../../../../../../fields/URLField"; +import { ImageCast } from "../../../../../../fields/Types"; export interface TemplatePreviewBoxProps { template: Template; @@ -24,12 +26,34 @@ export interface TemplatePreviewBoxProps { export class TemplatePreviewBox extends ObservableReactComponent<TemplatePreviewBoxProps> { private previewWindow: HTMLDivElement | null = null; + // private icon: ImageField | undefined = undefined; setContainerRef: React.LegacyRef<HTMLDivElement> = (node) => { this.previewWindow = node; this.forceUpdate(); } + // componentDidMount(): void { + // console.log('mounted') + // setTimeout(() => { + // const docView = DocumentView.getDocumentView(this.doc); + // if (docView) { + // console.log('docview found') + // docView.ComponentView?.updateIcon?.(); + // setTimeout(() => { + // console.log('componentview found: ', docView.ComponentView) + // this.icon = ImageCast(docView.Document.icon); + // console.log('icon is:', this.icon, ' from: ', docView.Document.icon); + // this.forceUpdate(); + // }, 5000); + // } + // }, 1000); + // } + + get doc() { + return this.props.template.getRenderedDoc() as Doc; + } + render() { const template = this.props.template; @@ -57,8 +81,10 @@ export class TemplatePreviewBox extends ObservableReactComponent<TemplatePreview <button className="option-button right" onPointerDown={e => this.props.menu.setUpButtonClick(e, () => this.props.rightButtonOpts)}> <FontAwesomeIcon icon={this.props.rightButtonOpts![0]} color="white" /> </button> : null } + {/* { this.icon ? + <img className="docCreatorMenu-preview-image" src={this.icon.url.href.replace('.png', '_o.png')} /> */} <DocumentView - Document={this.props.template.getRenderedDoc()!} //!!! bad + Document={this.doc} isContentActive={emptyFunction} // !!! should be return false addDocument={returnFalse} moveDocument={returnFalse} diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplatesSidescrollDisplay.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplatePreviewGrid.tsx index 1f6eed9e5..fb246a0a0 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplatesSidescrollDisplay.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Menu/TemplatePreviewGrid.tsx @@ -10,32 +10,37 @@ import { Template } from "../Template"; import { observer } from "mobx-react"; import { DocCreatorMenu } from "../DocCreatorMenu"; import { TemplatePreviewBox } from "./TemplatePreviewBox"; +import { IconProp } from "@fortawesome/fontawesome-svg-core"; export interface SuggestedTemplatesProps { menu: DocCreatorMenu; + loading?: boolean; templates: Template[]; title: string; - previewBoxLeftButtonOpts?: [string, () => any]; - previewBoxRightButtonOpts?: [string, () => any]; + optionsButtonOpts?: [string, (...args: any) => any]; + previewBoxLeftButtonOpts?: [string, (...args: any) => any]; + previewBoxRightButtonOpts?: [string, (...args: any) => any]; setupButtonClick: (e: React.PointerEvent, func: () => void) => void; } @observer -export class TemplateSidescrollView extends ObservableReactComponent<SuggestedTemplatesProps> { - - @observable _GPTLoading: boolean = false; +export class TemplatePreviewGrid extends ObservableReactComponent<SuggestedTemplatesProps> { render() { return ( <div className="docCreatorMenu-section"> <div className="docCreatorMenu-section-topbar"> <div className="docCreatorMenu-section-title">{this.props.title}</div> - <button className="docCreatorMenu-menu-button section-reveal-options" onPointerDown={e => this.props.setupButtonClick(e, () => runInAction(() => (this.props.menu._menuContent = 'dashboard')))}> - <FontAwesomeIcon icon="gear" /> - </button> + {this._props.optionsButtonOpts ? (<button className="docCreatorMenu-menu-button section-reveal-options" onPointerDown={e => this.props.setupButtonClick(e, () => runInAction(this._props.optionsButtonOpts![1]))}> + <FontAwesomeIcon icon={this._props.optionsButtonOpts[0] as IconProp} /> + </button>) : null} </div> - <div className="docCreatorMenu-templates-preview-window" style={{ justifyContent: this.props.menu._menuDimensions.width > 400 ? 'center' : '' }}> - {this.props.templates.map(template => ( + <div className="docCreatorMenu-templates-preview-window"> + {this._props.loading ? + (<div className="loading-spinner"> + <ReactLoading type="spin" color={StrCast(Doc.UserDoc().userVariantColor)} height={30} width={30} /> + </div>) + : this.props.templates.map(template => ( <TemplatePreviewBox template={template} menu={this.props.menu} diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.ts b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.ts index 2bf9f8de5..1dc6692a2 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.ts +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.ts @@ -4,6 +4,8 @@ import { TemplateFieldType, TemplateLayouts } from './TemplateBackend'; import { DynamicField } from './TemplateFieldTypes/DynamicField'; import { FieldSettings, TemplateField, ViewType } from './TemplateFieldTypes/TemplateField'; import { Conditional } from './Backend/TemplateManager'; +import { ImageField } from '../../../../../fields/URLField'; +import { Doc } from '../../../../../fields/Doc'; export class Template { _mainField: DynamicField; @@ -110,6 +112,29 @@ export class Template { this.conditionalLogic[field] = this.conditionalLogic[field]?.filter(cond => cond !== statement); } + setImageAsBackground(url: string, makeTransparent: boolean = false) { + const fieldSettings: FieldSettings = { + tl: [-1, -1], + br: [1, 1], + opts: {}, + viewType: ViewType.IMG, + } + + const field: TemplateField = TemplateField.CreateField(fieldSettings, Math.random() * 100 + 100, this._mainField); + field.setContent(url); + + if (makeTransparent) { + this.allFields.forEach(field => { + field.updateDocSetting('backgroundColor', 'transparent'); + field.updateDocSetting('borderWidth', '0'); + }); + } + + this._mainField.addField(field); + + this._mainField.refreshRenderedDoc(); + } + getMatches = (cols: Col[]): number[][] => { const numFields = this.contentFields.length; diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.ts b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.ts index a6d2136f4..06eab63f0 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.ts +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.ts @@ -351,7 +351,7 @@ export class TemplateLayouts { title: 'fourfield05', viewType: ViewType.FREEFORM, tl: [0, 0], - br: [400, 550], + br: [400, 514], opts: { backgroundColor: '#95A575', }, diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/DynamicField.ts b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/DynamicField.ts index 377f5acb2..ee8bcef51 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/DynamicField.ts +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/DynamicField.ts @@ -10,10 +10,10 @@ import { FieldSettings, TemplateField, ViewType } from './TemplateField'; export class DynamicField extends TemplateField { protected _disposers: { [name: string]: IDisposer } = {}; - protected _subfields: TemplateField[] | undefined; + protected _subfields: TemplateField[] = []; get getSubfields() { - return this._subfields ?? []; + return this._subfields; } get getAllSubfields(): TemplateField[] { return this.getSubfields.flatMap(field => [field, ...((field as DynamicField).getAllSubfields ?? [])]); @@ -24,7 +24,7 @@ export class DynamicField extends TemplateField { newDocsList.forEach(doc => !currRenderedDocs.has(doc) && this.addFieldFromDoc(doc)); currRenderedDocs.forEach(doc => { if (!newDocsList.includes(doc)) { - this._subfields?.forEach(field => field.renderedDoc === doc && this.removeField(field)); + this._subfields.forEach(field => field.renderedDoc === doc && this.removeField(field)); } }); }; @@ -38,14 +38,12 @@ export class DynamicField extends TemplateField { opts: {}, }; - this._subfields?.push(TemplateField.CreateField(settings, this._subfields.length, this)); + this._subfields.push(TemplateField.CreateField(settings, this._subfields.length, this)); }; - addField = (field: TemplateField) => { - if (!this._subfields?.includes(field)) { - if (this._subfields) this._subfields?.push(field); - else this._subfields = [field]; - // Doc.SetContainer(field.Document, this.Document); + addField = (field: TemplateField, layer: number = 0) => { + if (!this._subfields.includes(field)) { + this._subfields.splice(layer, 0, field); } }; @@ -53,13 +51,13 @@ export class DynamicField extends TemplateField { removeField = (field: TemplateField) => { // field.renderedDoc && this._renderDoc && Doc.RemoveDocFromList(this._renderDoc, undefined, field.renderedDoc); - this._subfields?.splice(this._subfields.indexOf(field), 1); + this._subfields.splice(this._subfields.indexOf(field), 1); (field as DynamicField).dispose?.(); }; // implement Field's abstract method for replacing a subfield with a new one exchangeFields(newField: TemplateField, oldField: TemplateField) { - this._subfields?.splice(this._subfields.indexOf(oldField), 1, newField); + this._subfields.splice(this._subfields.indexOf(oldField), 1, newField); this.initRenderDoc(this._settings); } @@ -86,8 +84,9 @@ export class DynamicField extends TemplateField { } initRenderDoc = (settings: FieldSettings) => { + console.log('initializing') this._disposers.fieldList = reaction(() => DocListCast(this._renderDoc?.[Doc.LayoutFieldKey(this._renderDoc)]), this.handleFieldUpdate); - this._subfields = settings.subfields?.map((fieldSettings, index) => {fieldSettings.template = this.settings.template; return TemplateField.CreateField(fieldSettings, index, this)}) || []; + this._subfields = settings.subfields?.map((fieldSettings, index) => {return TemplateField.CreateField(fieldSettings, index, this)}) || []; const renderedSubfields = this._subfields.filter(field => field.renderedDoc).map(field => field.renderedDoc!); settings.opts.title = settings.title; this._renderDoc = (() => { switch (settings.viewType) { @@ -97,4 +96,14 @@ export class DynamicField extends TemplateField { }})(); // prettier-ignore return this; }; + + refreshRenderedDoc = () => { + console.log('refreshing'); + const renderedSubfields = this._subfields.filter(field => field.renderedDoc).map(field => field.renderedDoc!); + this._renderDoc = (() => { switch (this.settings.viewType) { + case ViewType.CAROUSEL3D: return Docs.Create.Carousel3DDocument(renderedSubfields, this.settings.opts); + case ViewType.FREEFORM: + default: return Docs.Create.FreeformDocument(renderedSubfields, this.settings.opts); + }})(); + } } diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/StaticContentField.ts b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/StaticContentField.ts index 7049bb56f..625a7bc4a 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/StaticContentField.ts +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/StaticContentField.ts @@ -33,7 +33,7 @@ export class ImageTemplateField extends StaticContentField { initRenderDoc(settings: FieldSettings) { settings.opts.title = settings.title ?? ''; settings.opts._layout_fitWidth = false; - this._renderDoc = Docs.Create.ImageDocument('', settings.opts); + this._renderDoc = Docs.Create.ImageDocument(this._content, settings.opts); return this; } } @@ -46,7 +46,7 @@ export class TextTemplateField extends StaticContentField { initRenderDoc(settings: FieldSettings) { settings.opts.title = settings.title ?? ''; settings.opts.text_fontSize = TemplateFieldUtils.calculateFontSize(this._dimensions?.width ?? 10, this._dimensions?.height ?? 10, '', true) + ''; - this._renderDoc = Docs.Create.TextDocument('', settings.opts); + this._renderDoc = Docs.Create.TextDocument(this._content, settings.opts); return this; } } diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/TemplateField.ts b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/TemplateField.ts index b4ba3fe7d..e178756f9 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/TemplateField.ts +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateFieldTypes/TemplateField.ts @@ -71,6 +71,10 @@ export abstract class TemplateField { }; getTitle = () => this._title; + updateDocSetting = (setting: string, newVal: string) => { + if (this._renderDoc) this._renderDoc[setting] = newVal; + } + makeClone(parent?: TemplateField) { const settings: FieldSettings = structuredClone(this._settings); const cloned = TemplateField.CreateField(settings, this._id, parent, true); // create a value for this.Document/subfields that we want to ignore diff --git a/src/client/views/smartdraw/DrawingFillHandler.tsx b/src/client/views/smartdraw/DrawingFillHandler.tsx index 3d21029ab..ad5ef7118 100644 --- a/src/client/views/smartdraw/DrawingFillHandler.tsx +++ b/src/client/views/smartdraw/DrawingFillHandler.tsx @@ -51,18 +51,18 @@ export class DrawingFillHandler { const genratedDocs = DocCast(drawing.ai_firefly_generatedDocs) ?? Docs.Create.MasonryDocument([], { _width: 400, _height: 400 }); drawing[DocData].ai_firefly_generatedDocs = genratedDocs; (res as Upload.ImageInformation[]).map(info => { - const doc = Docs.Create.ImageDocument(info.accessPaths.agnostic.client, { - ai: 'firefly', - tags: new List<string>(['@ai']), - title: newPrompt, - _data_usePath: 'alternate:hover', - data_alternates: new List<Doc>([drawing]), - ai_firefly_prompt: newPrompt, - _width: 500, - data_nativeWidth: info.nativeWidth, - data_nativeHeight: info.nativeHeight, - }) if (!fromDocCreator) { + const doc = Docs.Create.ImageDocument(info.accessPaths.agnostic.client, { + ai: 'firefly', + tags: new List<string>(['@ai']), + title: newPrompt, + _data_usePath: 'alternate:hover', + data_alternates: new List<Doc>([drawing]), + ai_firefly_prompt: newPrompt, + _width: 500, + data_nativeWidth: info.nativeWidth, + data_nativeHeight: info.nativeHeight, + }) Doc.AddDocToList( genratedDocs, undefined, @@ -72,7 +72,7 @@ export class DrawingFillHandler { true ); } else { - fromDocCreator.addVariationDoc(doc); + fromDocCreator.addVariation(info.accessPaths.agnostic.client); } }); if (!DocumentView.getFirstDocumentView(genratedDocs) && !fromDocCreator) { |