diff options
8 files changed, 74 insertions, 66 deletions
diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.tsx b/src/client/views/nodes/DataVizBox/DataVizBox.tsx index dececd1dc..117311b8c 100644 --- a/src/client/views/nodes/DataVizBox/DataVizBox.tsx +++ b/src/client/views/nodes/DataVizBox/DataVizBox.tsx @@ -411,10 +411,10 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { }, { fireImmediately: true } ); - this._disposers.contentSummary = reaction( - () => this.records, - () => this.updateGPTSummary() - ); + // this._disposers.contentSummary = reaction( + // () => this.records, + // () => this.updateGPTSummary() + // ); } fetchData = () => { diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx index e1f53ec47..e8b80b7b5 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx @@ -115,14 +115,15 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { this._userTemplates.push(template); }; @action removeUserTemplate = (template: Template) => { - this._userTemplates.splice(this._userTemplates.indexOf(t), 1); + this._userTemplates.splice(this._userTemplates.indexOf(template), 1); } @action setSuggestedTemplates = (templates: Template[]) => { this._suggestedTemplates = templates; //prettier-ignore }; @computed get docsToRender() { - return this._selectedTemplate ? NumListCast(this._dataViz?.layoutDoc.dataViz_selectedRows) : []; + return [1, 2, 3, 4]; + //this._selectedTemplate ? NumListCast(this._dataViz?.layoutDoc.dataViz_selectedRows) : []; !!! put this back for GPT rendering } @computed get rowsCount() { @@ -357,6 +358,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { @action updateRenderedPreviewCollection = async (template: Template) => { this._fullyRenderedDocs = await this.createDocsFromTemplate(template) ?? []; + console.log(this._fullyRenderedDocs); this.updateRenderedDocCollection(); } @@ -716,6 +718,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { }); const processContent = async (content: {[title: string]: string}) => { + const templateCopy = template.cloneBase(); fields.filter(title => title).forEach(title => { @@ -748,19 +751,23 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { return templateCopy.getRenderedDoc(); }; + + const rows = [1, 2, 3, 4]; - const promises = rowContents.map(content => processContent(content)); + //const promises = rowContents.map(content => processContent(content)); + const promises = rows.map(row => processContent({})); + const renderedDocs = await Promise.all(promises); this._docsRendering = false; // removes loading indicator + console.log('docs: ', renderedDocs); + console.log('first doc height: ', renderedDocs[0]._height); + return renderedDocs; } - - - addRenderedCollectionToMainview = () => { const collection = this._renderedDocCollection; if (!collection) return; @@ -822,7 +829,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { })}> <FontAwesomeIcon icon="minimize" /> </button> - <button className="docCreatorMenu-menu-button section-reveal-options top-right-lower" onPointerDown={e => this.setUpButtonClick(e, () => {this._currEditingTemplate?.resetToBase(); this.setExpandedView(this._currEditingTemplate);})}> + <button className="docCreatorMenu-menu-button section-reveal-options top-right-lower" onPointerDown={e => this.setUpButtonClick(e, () => {this._currEditingTemplate?.printFieldInfo();/*this._currEditingTemplate?.resetToBase();*/ this.setExpandedView(this._currEditingTemplate);})}> <FontAwesomeIcon icon="arrows-rotate" color="white" /> </button> </div> @@ -1012,11 +1019,9 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { collection._height = verticalSpan; collection._width = horizontalSpan; - const layout = this._layout; - const columns: number = layout.columns ?? this.columnsCount; - const xGap: number = layout.xMargin; - const yGap: number = layout.yMargin; - // const repeat: number = templateInfo.layout.repeat; + const columns: number = this._layout.columns ?? this.columnsCount; + const xGap: number = this._layout.xMargin; + const yGap: number = this._layout.yMargin; const startX: number = -Number(collection._width)/2; const startY: number = -Number(collection._height)/2; const docHeight: number = Number(docs[0]._height); @@ -1066,7 +1071,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { console.log('called'); if (!this._fullyRenderedDocs) return; - const { horizontalSpan, verticalSpan } = this.previewInfo; //const largerSpan: number = horizontalSpan > verticalSpan ? horizontalSpan : verticalSpan; const collectionFactory = (): (docs: Doc[], options: DocumentOptions) => Doc => { @@ -1086,19 +1090,22 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { } } - const collection: Doc = collectionFactory()(this._fullyRenderedDocs, { + const collection = collectionFactory()(this._fullyRenderedDocs, { isDefaultTemplateDoc: true, - _height: verticalSpan, - _width: horizontalSpan, title: 'title', backgroundColor: 'gray', + x: 200, + y: 200 }); this.applyLayout(collection, this._fullyRenderedDocs); this._renderedDocCollection = collection; - console.log('changed'); + const mainCollection = this._dataViz?.DocumentView?.().containerViewPath?.().lastElement()?.ComponentView as CollectionFreeFormView; + mainCollection.addDocument(collection); + + console.log('changed to: ', collection); } layoutPreviewContents = (id?: number) => { diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx index c751c91bd..c244dd57c 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx @@ -1,12 +1,8 @@ -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, FieldContentType, FieldDimensions, FieldSettings, ViewType } from "./Field"; import { FieldUtils } from "./FieldUtils"; -import { StaticField } from "./StaticField"; -import { IDisposer } from "mobx-utils"; export class DynamicField extends Field { protected parent: Field; diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/Field.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/Field.tsx index 1dd442c97..2aa9f9032 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/Field.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/Field.tsx @@ -136,8 +136,8 @@ export abstract class Field { //this.updateRenderedDoc(this.renderedDoc); field.updateRenderedDoc(this.renderedDoc); field.subfields = this.subfields; - console.log('id:', this.id, 'set width to:', Number(this.renderedDoc.width)); - console.log('set height to:', Number(this.renderedDoc.height)); + //console.log('id:', this.id, 'set width to:', Number(this.renderedDoc.width)); + //console.log('set height to:', Number(this.renderedDoc.height)); } abstract updateRenderedDoc(oldDoc?: Doc): void; diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx index 0b2f437e8..df997c8c5 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx @@ -1,17 +1,8 @@ -import { TbHospital } from "react-icons/tb"; import { Doc, DocListCast } from "../../../../../../fields/Doc"; -import { FieldType } from "../../../../../../fields/ObjectField"; import { Docs, DocumentOptions } from "../../../../../documents/Documents"; import { Col } from "../DocCreatorMenu"; -import { Template } from "../Template"; -import { DynamicField } from "./DynamicField"; import { FieldUtils } from "./FieldUtils"; import { Field, FieldContentType, FieldDimensions, FieldSettings, ViewType } from "./Field"; -import { indexOf } from "lodash"; -import { ScriptField } from "../../../../../../fields/ScriptField"; -import { StrCast } from "../../../../../../fields/Types"; -import { makeAutoObservable, makeObservable, reaction } from "mobx"; -import { IDisposer } from "mobx-utils"; export class StaticField extends Field { @@ -38,9 +29,10 @@ export class StaticField extends Field { setContent = (newContent: string, type?: FieldContentType) => { this.content = newContent; if (type) this.contentType = type; + this.updateRenderedDoc(this.renderedDocument /*, true*/); }; - getContent() { return this.content }; + getContent() { return this.content ?? 'Unset'}; applyAttributes = (field: Field) => { //!!! can be updated later for more robust clonign; this is all ythat's needed now super.applyAttributes(field); @@ -98,6 +90,8 @@ export class StaticField extends Field { break; } + //doc[this.title] = this.content; broken for some reason + this.renderedDocument = doc; return doc; diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx index 7515a39be..16e70a47b 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx @@ -9,6 +9,7 @@ import { } from "./FieldTypes/FieldUtils"; import { } from "./FieldTypes/StaticField"; import { observer } from "mobx-react"; import { IDisposer } from "mobx-utils"; +import { Width } from "../../../../../fields/DocSymbols"; export class Template { @@ -44,16 +45,15 @@ export class Template { return clone; } - getRenderedDoc = () => { - console.log('called'); - const doc: Doc = this.doc; - this.contentFields.forEach(field => { - const title: string = field.getTitle(); - const val: FieldType = field.getContent() as FieldType; - if (!title || !val) return; - doc[title] = val; + printFieldInfo = () => { + this.allFields.forEach(field => { + const doc = field.renderedDoc; + console.log('title: ', field.getTitle(), ' width: ', doc.width); }); - return doc; + } + + getRenderedDoc = () => { + return this.doc; } getFieldByID = (id: number): Field => { diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx index 4f1186320..bea5c2d5d 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx @@ -491,7 +491,7 @@ export class TemplateLayouts { tl:[0,0], br:[500, 600], opts: { - backgroundColor: '#DDD3A9', + backgroundColor: '#D7CBAB', }, subfields: [ { @@ -502,63 +502,75 @@ export class TemplateLayouts { sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], description: 'A small text field for a title that categorizes the rest of the content.', opts: { - borderColor: 'yellow', - borderWidth: '8', hCentering: "h-center", backgroundColor: 'transparent', + textTransform: 'uppercase', }, }, { viewType: ViewType.CAROUSEL3D, - tl: [-0.9, -.3], - br: [0.9, .9], + tl: [-0.9, -.5], + br: [0.9, .25], opts: { - borderColor: 'yellow', + borderColor: '#847F69', borderWidth: '8', - backgroundColor: 'transparent', + backgroundColor: '#C8BA94', }, subfields: [ { viewType: ViewType.STATIC, - tl: [-.3, -.6], - br: [.3, .6], + tl: [-.4, -.6], + br: [.4, .6], types: [TemplateFieldType.VISUAL, TemplateFieldType.TEXT], sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], description: 'A medium to large field for content that will share central focus with other content in the carousel.', opts: { - borderColor: 'yellow', - borderWidth: '8', + //borderColor: 'yellow', + //borderWidth: '8', }, }, { viewType: ViewType.STATIC, - tl: [-.3, -.6], - br: [.3, .6], + tl: [-.4, -.6], + br: [.4, .6], types: [TemplateFieldType.VISUAL, TemplateFieldType.TEXT], sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], description: 'A medium to large field for content that will share central focus with other content in the carousel.', opts: { - borderColor: 'black', - borderWidth: '8', + //borderColor: 'black', + //borderWidth: '8', }, }, { viewType: ViewType.STATIC, - tl: [-.3, -.6], - br: [.3, .6], + tl: [-.4, -.6], + br: [.4, .6], types: [TemplateFieldType.VISUAL, TemplateFieldType.TEXT], sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], description: 'A medium to large field for content that will share central focus with other content in the carousel.', opts: { - borderColor: 'yellow', - borderWidth: '8', + //borderColor: 'yellow', + //borderWidth: '8', }, }, ] }, + { + viewType: ViewType.STATIC, + tl: [-0.9, .35], + br: [0.9, .9], + types: [TemplateFieldType.TEXT], + sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE], + description: 'A medium text field for a description of the content in the carousel.', + opts: { + hCentering: "h-center", + backgroundColor: 'transparent', + }, + }, ] } + public static ThreeField001: FieldSettings = { title: 'threefield001', viewType: ViewType.FREEFORM, diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateManager.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateManager.tsx index 413c3082e..6ab0a1774 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateManager.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateManager.tsx @@ -2,7 +2,6 @@ import { makeAutoObservable } from "mobx"; import { Col } from "./DocCreatorMenu"; import { FieldSettings } from "./FieldTypes/Field"; import { Template } from "./Template"; -import { TemplateLayouts } from "./TemplateBackend"; export class TemplateManager { |