diff options
Diffstat (limited to 'src')
9 files changed, 173 insertions, 216 deletions
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index 0a7047128..b35845de9 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -285,6 +285,7 @@ export class DocumentOptions { _layout_showSidebar?: BOOLt = new BoolInfo('whether an annotationsidebar should be displayed for text docuemnts'); _layout_showCaption?: string; // which field to display in the caption area. leave empty to have no caption _layout_showTags?: BOOLt = new BoolInfo('whether to show the list of document tags at the bottom of a DocView'); + _layout_hideScroll?: BOOLt = new BoolInfo('whether to hide scroll bars on the document'); _chromeHidden?: BOOLt = new BoolInfo('whether the editing chrome for a document is hidden'); hideClickBehaviors?: BOOLt = new BoolInfo('whether to hide click behaviors in context menu'); diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx index faa6cffa8..cc161e688 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx @@ -47,6 +47,8 @@ export enum LayoutType { export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { static Instance: DocCreatorMenu; + private DEBUG_MODE: boolean = false; + private _disposers: { [name: string]: IDisposer } = {}; private _ref: HTMLDivElement | null = null; @@ -122,8 +124,11 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { }; @computed get docsToRender() { - return [1, 2, 3, 4]; - //this._selectedTemplate ? NumListCast(this._dataViz?.layoutDoc.dataViz_selectedRows) : []; !!! put this back for GPT rendering + if (this.DEBUG_MODE) { + return [1, 2, 3, 4]; + } else { + return this._selectedTemplate ? NumListCast(this._dataViz?.layoutDoc.dataViz_selectedRows) : []; + } } @computed get rowsCount() { @@ -607,20 +612,27 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { }; generatePresetTemplates = async () => { - this._dataViz?.updateColDefaults(); - const cols = this.fieldsInfos; - const templates = this.templateManager.getValidTemplates(cols); + const templates: Template[] = []; - console.log(templates) + if (this.DEBUG_MODE) { + templates.push(...this.templateManager.templates) + } else { + this._dataViz?.updateColDefaults(); - const assignments: [Template, { [field: number]: Col }][] = await this.assignColsToFields(templates, cols); + const cols = this.fieldsInfos; + templates.push(...this.templateManager.getValidTemplates(cols)); - const renderedTemplatePromises: Promise<Template | undefined>[] = assignments.map(([template, assignments]) => this.applyGPTContentToTemplate(template, assignments)); + console.log(templates) - const renderedTemplates: (Template | undefined)[] = await Promise.all(renderedTemplatePromises); + const assignments: [Template, { [field: number]: Col }][] = await this.assignColsToFields(templates, cols); + + const renderedTemplatePromises: Promise<Template | undefined>[] = assignments.map(([template, assignments]) => this.applyGPTContentToTemplate(template, assignments)); + + const renderedTemplates: (Template | undefined)[] = await Promise.all(renderedTemplatePromises); + } - templates.forEach(template => template.mainField.initRenderedDoc()) + // templates.forEach(template => template.mainField.initRenderedDoc()) setTimeout(() => { this.setSuggestedTemplates(templates); diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DecorationField.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DecorationField.tsx index efe398aaa..62f5504a8 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DecorationField.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DecorationField.tsx @@ -1,37 +1,34 @@ import { Doc, DocListCast } from "../../../../../../fields/Doc"; import { Docs, DocumentOptions } from "../../../../../documents/Documents"; -import { FieldUtils } from "./FieldUtils"; import { Field, FieldDimensions, FieldSettings, ViewType } from "./Field"; import { RichTextField } from "../../../../../../fields/RichTextField"; import { DocData } from "../../../../../../fields/DocSymbols"; import { ImageField } from "../../../../../../fields/URLField"; +import { FieldUtils } from "./FieldUtils"; export class DecorationField extends Field { protected content: string = ''; protected subfields: Field[]; - protected renderedDocument: Doc; - - protected dimensions: FieldDimensions; + protected Document: Doc; - constructor(settings: FieldSettings, parent: Field, id: number) { + constructor(settings: FieldSettings, id: number, parent: Field) { super(settings, id, FieldUtils.initField, parent); - this.dimensions = FieldUtils.getLocalDimensions({tl: settings.tl, br: settings.br}, this.parent.getDimensions); this.subfields = this.setupSubfields(this); - this.renderedDocument = this.initRenderedDoc(); + this.Document = this.initializeDocument(); }; setContent = (content: string, type?: ViewType) => { return } getContent = () => { return 'none'}; get isContentField(): boolean { return false }; - initRenderedDoc = (): Doc => { + initializeDocument = (): Doc => { const renderedSubfields: Doc[] = this.subfields.map(field => field.renderedDoc); - let doc: Doc = Docs.Create.FreeformDocument(renderedSubfields, { title: this.title, }); - FieldUtils.applyBasicOpts(doc, this.dimensions, this.settings); + this.settings.opts.title = this.title; + let doc: Doc = Docs.Create.FreeformDocument(renderedSubfields, this.settings.opts); - this.renderedDocument = doc; + this.Document = doc; return doc; }; diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx index 7ffb1884e..59a955c66 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx @@ -1,58 +1,36 @@ +import { makeAutoObservable, makeObservable, reaction } from "mobx"; import { Doc, DocListCast } from "../../../../../../fields/Doc"; import { Docs } from "../../../../../documents/Documents"; import { Col } from "../DocCreatorMenu"; +import { TemplateLayouts } from "../TemplateBackend"; import { Field, FieldDimensions, FieldSettings, ViewType } from "./Field"; +import { IDisposer } from "mobx-utils"; import { FieldUtils } from "./FieldUtils"; export class DynamicField extends Field { - protected parent: Field; - protected dimensions: FieldDimensions; protected subfields: Field[]; - protected renderedDocument: Doc; + protected Document!: Doc; constructor(settings: FieldSettings, id: number, parent?: Field) { super(settings, id, FieldUtils.initField, parent); - if (!parent) { - this.parent = this; - this.dimensions = {width: this.settings.br[0] - this.settings.tl[0], height: this.settings.br[1] - this.settings.tl[1], coord: {x: this.settings.tl[0], y: this.settings.tl[1]}}; - } else { - this.parent = parent; - this.dimensions = FieldUtils.getLocalDimensions({tl: settings.tl, br: settings.br}, this.parent.getDimensions); - } - //console.log('new field dimensions: ', this.dimensions); this.subfields = this.setupSubfields(this); - this.renderedDocument = this.initRenderedDoc(); //!!! - - // this.disposers.fieldList = reaction( - // () => DocListCast(this.doc[Doc.LayoutFieldKey(this.doc)]), - // docs => { - // this.handleFieldUpdate(docs); - // } - // ); + this.initializeDocument(); } setContent = (content: string, type: ViewType) => { return }; getContent = () => { return '' }; get isContentField(): boolean { return false }; + addChildToDocument = (doc: Doc) => { + Doc.SetContainer(doc, this.Document); + } + matches = (cols: Col[]): Array<number> => { return []; } - getChildDimensions = (coords: { tl: [number, number]; br: [number, number] }): FieldDimensions => { - const l = (coords.tl[0] * this.dimensions.height) / 2; - const t = coords.tl[1] * this.dimensions.width / 2; //prettier-ignore - const r = (coords.br[0] * this.dimensions.height) / 2; - const b = coords.br[1] * this.dimensions.width / 2; //prettier-ignore - const width = r - l; - const height = b - t; - const coord = { x: l, y: t }; - return { width, height, coord }; - }; - - initRenderedDoc = (): Doc => { - console.log('dynamic field updated'); + initializeDocument = (): Doc => { let doc: Doc; const renderedSubfields: Doc[] = this.subfields.map(field => field.renderedDoc); switch (this.settings.viewType) { @@ -60,24 +38,71 @@ export class DynamicField extends Field { doc = Docs.Create.Carousel3DDocument(renderedSubfields, { title: this.title, }); - FieldUtils.applyBasicOpts(doc, this.dimensions, this.settings); break; case ViewType.FREEFORM: doc = Docs.Create.FreeformDocument(renderedSubfields, { title: this.title, }); - FieldUtils.applyBasicOpts(doc, this.dimensions, this.settings); break; default: - doc = Docs.Create.Carousel3DDocument(renderedSubfields, { + doc = Docs.Create.FreeformDocument(renderedSubfields, { title: this.title, }); - FieldUtils.applyBasicOpts(doc, this.dimensions, this.settings); break; } - this.renderedDocument = doc; + this.Document = doc; return doc; } } + +// export class DynamicField extends Field { +// protected subfields: Field[]; + +// protected Document!: Doc; + +// constructor(settings: FieldSettings, id: number, parent?: Field) { +// super(settings, id, parent); +// this.subfields = this.setupSubfields(this); +// this.initializeDocument(); +// } + +// setContent = (content: string, type: ViewType) => { return }; +// getContent = () => { return '' }; +// get isContentField(): boolean { return false }; + +// addChildToDocument = (doc: Doc) => { +// Doc.SetContainer(doc, this.Document); +// } + +// matches = (cols: Col[]): Array<number> => { +// return []; +// } + +// initializeDocument = (): Doc => { +// let doc: Doc; +// const renderedSubfields: Doc[] = this.subfields.map(field => field.renderedDoc); +// switch (this.settings.viewType) { +// case ViewType.CAROUSEL3D: +// doc = Docs.Create.Carousel3DDocument(renderedSubfields, { +// title: this.title, +// }); +// break; +// case ViewType.FREEFORM: +// doc = Docs.Create.FreeformDocument(renderedSubfields, { +// title: this.title, +// }); +// break; +// default: +// doc = Docs.Create.FreeformDocument(renderedSubfields, { +// title: this.title, +// }); +// break; +// } + +// this.Document = doc; +// return doc; +// } + +// }
\ No newline at end of file diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/Field.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/Field.tsx index 6c78e15ad..df98e6181 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/Field.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/Field.tsx @@ -4,22 +4,24 @@ import { Col } from "../DocCreatorMenu"; import { TemplateFieldSize, TemplateFieldType } from "../TemplateBackend"; import { IDisposer } from "mobx-utils"; import { DocumentType } from "../../../../../documents/DocumentTypes"; +import { Partial } from "@react-spring/web"; +import { DocumentOptions } from "../../../../../documents/Documents"; export abstract class Field { protected disposers: { [name: string]: IDisposer } = {}; + private initField: (settings: FieldSettings, index: number, parent: Field) => Field; protected abstract subfields: Field[]; - protected abstract renderedDocument: Doc; + protected abstract Document: Doc; protected parent: Field; protected id: number; protected settings: FieldSettings; protected title: string = ''; - - protected abstract dimensions: FieldDimensions; + protected dimensions: FieldDimensions; constructor(settings: FieldSettings, id: number, fieldFactory: (settings: FieldSettings, index: number, parent: Field) => Field, parent?: Field) { this.initField = fieldFactory; @@ -27,10 +29,13 @@ export abstract class Field { this.id = id; this.settings = settings; this.title = settings.title ?? ''; + this.dimensions = this.getLocalDimensions({tl: this.settings.tl, br: this.settings.br}, this.parent.getDimensions); + this.applyBasicOpts(this.dimensions, settings); this.disposers.fieldList = reaction( - () => DocListCast(this.renderedDocument[Doc.LayoutFieldKey(this.renderedDocument)]), + () => DocListCast(this.Document[Doc.LayoutFieldKey(this.Document)]), docs => { + console.log('updated') this.handleFieldUpdate(docs); } ); @@ -46,7 +51,7 @@ export abstract class Field { return fields; }; - get renderedDoc(){ return this.renderedDocument }; + get renderedDoc(){ return this.Document }; get getDimensions() { return this.dimensions }; get getID() { return this.id }; get getDescription(): string { return this.settings.description ?? '' }; @@ -54,7 +59,7 @@ export abstract class Field { setTitle = (title: string) => { this.title = title; - this.renderedDocument.title = title; + this.Document.title = title; }; getTitle = () => { return this.title }; @@ -73,66 +78,22 @@ export abstract class Field { this.subfields.splice(this.subfields.indexOf(oldField), 1, newField); } - setupFieldChangeReaction = () => { - - } - addFieldFromDoc = (doc: Doc) => { console.log('add field called'); - const par = this.renderedDocument; + const par = this.Document; const settings: FieldSettings = { tl: [Number(doc._x) / Number(par._width), Number(doc._y) / Number(par._height)], br: [(Number(doc._x) + Number(doc._width)) / Number(par._width), (Number(doc._y) + Number(doc._height)) / Number(par._height)], viewType: doc.type === DocumentType.COL ? ViewType.FREEFORM : ViewType.STATIC, opts: {}, }; - - Object.getOwnPropertyNames(FieldOpts.prototype).forEach(([key, value]) => { - switch (key) { - case 'text_fontColor': - case 'backgroundColor': - case 'borderWidth': - case 'borderColor': - settings.opts[key] = String(doc[key]); - break; - - case '_layout_borderRounding': - case 'opacity': - case '_rotation': - settings.opts[key] = Number(doc[key]); - break; - - case 'contentBold': - settings.opts[key] = Boolean(doc[key]); - break; - - case 'hCentering': - settings.opts[key] = String(doc[key]) as 'h-left' | 'h-center' | 'h-right'; - break; - case 'contentYCentering': - settings.opts[key] = String(doc[key]) as 'top' | 'center' | 'bottom'; - break; - case 'textTransform': - settings.opts[key] = String(doc[key]) as 'uppercase' | 'lowercase'; - break; - case 'fieldViewType': - settings.opts[key] = String(doc[key]) as 'freeform' | 'stacked'; - break; - - default: - break; - } - }); const newField: Field = this.initField(settings, this.subfields.length, this); this.subfields.push(newField); }; - addField = (type?: ViewType) => { - - } - removeField = (field: Field) => { + console.log('removefield called') this.subfields.splice(this.subfields.indexOf(field), 1); field.dispose(); }; @@ -145,11 +106,11 @@ export abstract class Field { applyAttributes(field: Field) { field.setTitle(this.title); - field.initRenderedDoc(this.renderedDoc); + field.initializeDocument(this.renderedDoc); field.subfields = this.subfields; } - abstract initRenderedDoc(oldDoc?: Doc): void; + abstract initializeDocument(oldDoc?: Doc): void; dispose = () => { Object.values(this.disposers).forEach(disposer => disposer?.()); @@ -191,12 +152,39 @@ export abstract class Field { return matches; }; + private getLocalDimensions = (coords: { tl: [number, number]; br: [number, number] }, parentDimensions: FieldDimensions): FieldDimensions => { + if (!parentDimensions) { + return {width: coords.br[0] - coords.tl[0], height: coords.br[1] - coords.tl[1], coord: {x: coords.tl[0], y: coords.tl[1]}}; + } + const l = (coords.tl[0] * parentDimensions.width) / 2; + const t = coords.tl[1] * parentDimensions.height / 2; //prettier-ignore + const r = (coords.br[0] * parentDimensions.width) / 2; + const b = coords.br[1] * parentDimensions.height / 2; //prettier-ignore + const width = r - l; + const height = b - t; + const coord = { x: l, y: t }; + return { width, height, coord }; + }; + + private applyBasicOpts = (dimensions: FieldDimensions, settings: FieldSettings) => { + const opts: DocumentOptions = settings.opts; + opts.isDefaultTemplateDoc = true; + opts._layout_hideScroll = true; + opts.x = dimensions.coord.x; + opts.y = dimensions.coord.y; + opts._height = dimensions.height; + opts._width = dimensions.width; + opts._nativeWidth = dimensions.width; + opts._nativeHeight = dimensions.height; + opts._layout_nativeDimEditable = true; + }; + } export type FieldSettings = { tl: [number, number]; br: [number, number]; - opts: FieldOpts; + opts: DocumentOptions; viewType: ViewType; title?: string; subfields?: FieldSettings[]; @@ -219,19 +207,3 @@ export type FieldDimensions = { height: number; coord: {x: number, y: number}; } - -export class FieldOpts { - backgroundColor?: string; - text_fontColor?: string; - _layout_borderRounding?: number; - borderWidth?: string; - borderColor?: string; - hCentering?: 'h-left' | 'h-center' | 'h-right'; - contentYCentering?: 'top' | 'center' | 'bottom'; - opacity?: number; - _rotation?: number; - //animation?: boolean; - contentBold?: boolean; - textTransform?: 'uppercase' | 'lowercase'; - fieldViewType?: 'freeform' | 'stacked'; -} diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/FieldUtils.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/FieldUtils.tsx index d7cf24794..f3e4130a4 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/FieldUtils.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/FieldUtils.tsx @@ -1,25 +1,9 @@ -import { Doc } from "../../../../../../fields/Doc"; -import { ComputedField, ScriptField } from "../../../../../../fields/ScriptField"; -import { Col } from "../DocCreatorMenu"; -import { TemplateFieldSize, TemplateFieldType, TemplateLayouts } from "../TemplateBackend"; import { DynamicField } from "./DynamicField"; -import { Field, FieldDimensions, FieldSettings, ViewType } from "./Field"; +import { Field, FieldSettings, ViewType } from "./Field"; import { TextTemplateField, ImageTemplateField } from "./StaticContentField"; import { DecorationField } from "./DecorationField"; export class FieldUtils { - public static getLocalDimensions = (coords: { tl: [number, number]; br: [number, number] }, parentDimensions: FieldDimensions): FieldDimensions => { - //console.log('parent dimensions', parentDimensions, 'coords: ', coords); - const l = (coords.tl[0] * parentDimensions.width) / 2; - const t = coords.tl[1] * parentDimensions.height / 2; //prettier-ignore - const r = (coords.br[0] * parentDimensions.width) / 2; - const b = coords.br[1] * parentDimensions.height / 2; //prettier-ignore - const width = r - l; - const height = b - t; - const coord = { x: l, y: t }; - //console.log('width: ', width, 'height: ', height); - return { width, height, coord }; - }; public static initField = (settings: FieldSettings, index: number, parent: Field): Field => { const id = Number(`${parent.getID}${index}`); @@ -27,42 +11,15 @@ export class FieldUtils { case ViewType.FREEFORM: case ViewType.CAROUSEL3D: return new DynamicField(settings, id, parent); case ViewType.IMG: - return new ImageTemplateField(settings, parent, id); + return new ImageTemplateField(settings, id, parent); case ViewType.TEXT: - return new TextTemplateField(settings, parent, id); + return new TextTemplateField(settings, id, parent); case ViewType.DEC: - return new DecorationField(settings, parent, id); + return new DecorationField(settings, id, parent); } - return new TextTemplateField(settings, parent, id); + return new TextTemplateField(settings, id, parent); } - public static textProperties: string[] = [ - "textTransform", - "contentBold", - "text_fontColor", - "hCentering", - ] - - public static applyBasicOpts = (doc: Doc, parentDimensions: FieldDimensions, settings: FieldSettings, oldDoc?: Doc) => { - const opts = settings.opts; - doc.isDefaultTemplateDoc = oldDoc ? oldDoc.isDefaultTemplateDoc : true; - doc._layout_hideScroll = oldDoc ? oldDoc._layout_hideScroll : true; - doc.x = oldDoc ? oldDoc.x : parentDimensions.coord.x; - doc.y = oldDoc ? oldDoc.y : parentDimensions.coord.y; - doc._height = oldDoc ? oldDoc.height : parentDimensions.height; - doc._width = oldDoc ? oldDoc.width : parentDimensions.width; - doc.backgroundColor = oldDoc ? oldDoc.backgroundColor : opts.backgroundColor ?? ''; - //doc._layout_borderRounding = !opts._layout_borderRounding ? '0px' : ScriptField.MakeFunction(`${opts._layout_borderRounding} * this.width + 'px'`); - doc.borderColor = oldDoc ? oldDoc.borderColor : opts.borderColor; - doc.borderWidth = oldDoc ? oldDoc.borderWidth : opts.borderWidth; - doc.opacity = oldDoc ? oldDoc.opacity : opts.opacity; - doc._rotation = oldDoc ? oldDoc._rotation : opts._rotation; - doc.hCentering = oldDoc ? oldDoc.hCentering : opts.hCentering; - doc.nativeWidth = parentDimensions.width; - doc.nativeHeight = parentDimensions.height; - doc._layout_nativeDimEditable = true; - }; - public static calculateFontSize = (contWidth: number, contHeight: number, text: string, uppercase: boolean): number => { const words: string[] = text.split(/\s+/).filter(Boolean); diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticContentField.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticContentField.tsx index 627d3a939..63fe530a6 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticContentField.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticContentField.tsx @@ -1,22 +1,20 @@ import { Doc, DocListCast } from "../../../../../../fields/Doc"; import { Docs, DocumentOptions } from "../../../../../documents/Documents"; -import { FieldUtils } from "./FieldUtils"; import { Field, FieldDimensions, FieldSettings, ViewType } from "./Field"; import { RichTextField } from "../../../../../../fields/RichTextField"; import { DocData } from "../../../../../../fields/DocSymbols"; import { ImageField } from "../../../../../../fields/URLField"; import { ViewComponentType } from "@fullcalendar/core"; +import { DynamicField } from "./DynamicField"; +import { FieldUtils } from "./FieldUtils"; export abstract class StaticContentField extends Field { protected content: string = ''; protected subfields: Field[]; - protected dimensions: FieldDimensions; - constructor(settings: FieldSettings, parent: Field, id: number) { super(settings, id, FieldUtils.initField, parent); - this.dimensions = FieldUtils.getLocalDimensions({tl: settings.tl, br: settings.br}, this.parent.getDimensions); this.subfields = this.setupSubfields(this); }; @@ -24,22 +22,22 @@ export abstract class StaticContentField extends Field { getContent = () => { return this.content ?? 'unset'}; get isContentField(): boolean { return true }; - abstract initRenderedDoc(): Doc; + abstract initializeDocument(): Doc; } export class ImageTemplateField extends StaticContentField { - protected renderedDocument: Doc; + protected Document: Doc; - constructor(settings: FieldSettings, parent: Field, id: number){ + constructor(settings: FieldSettings, id: number, parent: Field){ super(settings, parent, id) - this.renderedDocument = this.initRenderedDoc(); + this.Document = this.initializeDocument(); } setContent = (url: string, type: ViewType) => { if (type === ViewType.IMG){ const imgField = new ImageField(url); - this.renderedDocument[DocData]['data'] = imgField; + this.Document[DocData]['data'] = imgField; this.content = url; } else { const updatedField = this.changeFieldType(type); @@ -47,15 +45,14 @@ export class ImageTemplateField extends StaticContentField { } }; - initRenderedDoc = (): Doc => { + initializeDocument = (): Doc => { const url = String(this.content); - let doc: Doc = Docs.Create.ImageDocument(url, { - title: this.title, - _layout_fitWidth: false, - }); - FieldUtils.applyBasicOpts(doc, this.dimensions, this.settings); + this.settings.opts.title = this.title; + this.settings.opts._layout_fitWidth = false; + + let doc: Doc = Docs.Create.ImageDocument(url, this.settings.opts); - this.renderedDocument = doc; + this.Document = doc; return doc; }; @@ -63,11 +60,11 @@ export class ImageTemplateField extends StaticContentField { export class TextTemplateField extends StaticContentField { - protected renderedDocument: Doc; + protected Document: Doc; - constructor(settings: FieldSettings, parent: Field, id: number){ + constructor(settings: FieldSettings, id: number, parent: Field){ super(settings, parent, id) - this.renderedDocument = this.initRenderedDoc(); + this.Document = this.initializeDocument(); } setContent = (text: string, type: ViewType) => { @@ -92,27 +89,23 @@ export class TextTemplateField extends StaticContentField { }; this.content = text; const field = new RichTextField(JSON.stringify(rtf), text); - this.renderedDocument[DocData]['text'] = field; + this.Document[DocData]['text'] = field; } else { const updatedField = this.changeFieldType(type); updatedField.setContent(text, type); } }; - initRenderedDoc = (): Doc => { + initializeDocument = (): Doc => { const opts = this.settings.opts; - const text = String(this.content); - let doc: Doc = Docs.Create.TextDocument(text, { - title: this.title, - text_fontColor: opts.text_fontColor, - contentBold: opts.contentBold, - textTransform: opts.textTransform, - color: opts.text_fontColor, - _text_fontSize: `${FieldUtils.calculateFontSize(this.dimensions.width, this.dimensions.height, text, true)}` - }); - FieldUtils.applyBasicOpts(doc, this.dimensions, this.settings); - - this.renderedDocument = doc; + const text = this.content; + + // opts._text_fontSize = `${FieldUtils.calculateFontSize(this.dimensions.width, this.dimensions.height, text, true)}`; + opts.title = this.title; + + let doc: Doc = Docs.Create.TextDocument(text, opts); + + this.Document = doc; return doc; }; diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx index a80df8468..687b655d1 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx @@ -38,7 +38,7 @@ export class Template { const matchingField: Field = this.allFields.filter(f => f.getID === field.getID)[0]; matchingField.applyAttributes(field); }) - clone.mainField.initRenderedDoc(); + clone.mainField.initializeDocument(); return clone; } @@ -83,7 +83,7 @@ export class Template { resetToBase = () => { this.allFields.forEach(field => { - field.initRenderedDoc(); + field.initializeDocument(); }) } diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx index 583b2f472..b1e06206f 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx @@ -1,4 +1,4 @@ -import { FieldOpts, FieldSettings, ViewType } from "./FieldTypes/Field"; +import { FieldSettings, ViewType } from "./FieldTypes/Field"; export enum TemplateFieldType { TEXT = 'text', @@ -34,7 +34,7 @@ export class TemplateLayouts { viewType: ViewType.FREEFORM, opts: { backgroundColor: '#C0B887', - _layout_borderRounding: .05, + _layout_borderRounding: '.05', //borderColor: '#6B461F', //borderWidth: '12', }, @@ -61,7 +61,7 @@ export class TemplateLayouts { sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], description: 'The main focus of the template; could be an image, long text, etc.', opts: { - _layout_borderRounding: .05, + _layout_borderRounding: '.05', borderColor: '#8F5B25', borderWidth: '6', backgroundColor: '#CECAB9', @@ -88,7 +88,7 @@ export class TemplateLayouts { sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], description: 'A medium-sized field for medium/long text.', opts: { - _layout_borderRounding: .05, + _layout_borderRounding: '.05', borderColor: '#8F5B25', borderWidth: '6', backgroundColor: '#CECAB9', |