aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx')
-rw-r--r--src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx88
1 files changed, 58 insertions, 30 deletions
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
index e7d6bb98e..7491642eb 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
@@ -58,7 +58,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
@observable _renderedDocCollection: Doc | undefined = undefined;
@observable _templateDocs: Doc[] = [];
- @observable _selectedTemplate: Doc | undefined = undefined;
+ @observable _selectedTemplateDoc: Doc | undefined = undefined;
@observable _userCreatedColumns: Col[] = [];
@observable _selectedCols: { title: string; type: string; desc: string }[] | undefined = [];
@@ -68,7 +68,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
@observable _savedLayouts: DataVizTemplateLayout[] = [];
@observable _expandedPreview: { icon: ImageField; doc: Doc } | undefined = undefined;
- @observable _suggestedTemplates: Doc[] = [];
+ @observable _suggestedTemplates: Template[] = [];
@observable _GPTOpt: boolean = false;
@observable _userPrompt: string = '';
@observable _callCount: number = 0;
@@ -112,12 +112,12 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
@action setTemplateDocs = (docs: Doc[]) => {
this._templateDocs = docs.map(doc => (doc.annotationOn ? DocCast(doc.annotationOn) : doc));
};
- @action setGSuggestedTemplates = (docs: Doc[]) => {
- this._suggestedTemplates = docs;
+ @action setSuggestedTemplates = (templates: Template[]) => {
+ this._suggestedTemplates = templates;
};
@computed get docsToRender() {
- return this._selectedTemplate ? NumListCast(this._dataViz?.layoutDoc.dataViz_selectedRows) : [];
+ return this._selectedTemplateDoc ? NumListCast(this._dataViz?.layoutDoc.dataViz_selectedRows) : [];
}
@computed get rowsCount() {
@@ -179,7 +179,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
}
@computed get canMakeDocs() {
- return this._selectedTemplate !== undefined && this._layout !== undefined;
+ return this._selectedTemplateDoc !== undefined && this._layout !== undefined;
}
get bounds(): { t: number; b: number; l: number; r: number } {
@@ -239,7 +239,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
docs => this.updateIcons(docs)
);
this._disposers.gpt = reaction(
- () => this._suggestedTemplates.slice(),
+ () => this._suggestedTemplates.map(template => template.mainField.renderedDoc()).slice(),
docs => this.updateIcons(docs)
);
//this._disposers.columns = reaction(() => this._dataViz?.layoutDoc._dataViz_axes, () => {this.generateTemplates('')})
@@ -289,7 +289,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
@action
openMenu = () => {
- const allTemplates = this._templateDocs.concat(this._suggestedTemplates);
+ const allTemplates = this._templateDocs.concat(this._suggestedTemplates.map(temp => temp.mainField.renderedDoc()));
this._shouldDisplay = true;
this.updateIcons(allTemplates);
};
@@ -374,15 +374,14 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
return undefined;
}
- @action updateSelectedTemplate = (template: Doc) => {
- if (this._selectedTemplate === template) {
- this._selectedTemplate = undefined;
+ @action updateSelectedTemplate = (template: Template) => {
+ if (this._selectedTemplateDoc === template.mainField.renderedDoc()) {
+ this._selectedTemplateDoc = undefined;
return;
} else {
- this._selectedTemplate = template;
- MakeTemplate(template);
- const templateInfo: DataVizTemplateInfo = { doc: template, layout: this._layout, referencePos: { x: this._pageX + 450, y: this._pageY }, columns: this.columnsCount };
- this._fullyRenderedDocs = this._dataViz?.createDocsFromTemplate(templateInfo, true) ?? [];
+ this._selectedTemplateDoc = template.mainField.renderedDoc();
+ template.renderUpdates();
+ this._fullyRenderedDocs = this.createDocsFromTemplate(template) ?? [];
this.updateRenderedDocCollection();
}
};
@@ -701,11 +700,40 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
});
setTimeout(() => {
- this.setGSuggestedTemplates(renderedTemplates);
+ this.setSuggestedTemplates(templates);
this._GPTLoading = false;
});
};
+ createDocsFromTemplate = (template: Template) => {
+ const dv = this._dataViz;
+ if (!dv) return;
+ const fields: string[] = Array.from(Object.keys(dv.records[0]));
+ const selectedRows = NumListCast(dv.layoutDoc.dataViz_selectedRows);
+
+ const fieldContents: {[title: string]: string}[] = selectedRows.map(row => {
+ let values: {[title: string]: string} = {};
+ fields.forEach(col => {
+ values[col] = dv.records[row][col];
+ });
+
+ return values;
+ });
+
+ const renderedDocs: Doc[] = [];
+
+ fieldContents.forEach(content => {
+ fields.forEach(title => {
+ const field = template.getFieldByTitle(title);
+ field.setContent(content[title]);
+ });
+
+ renderedDocs.push(template.mainField.renderedDoc());
+ });
+
+ return renderedDocs;
+ }
+
@action setExpandedView = (info: { icon: ImageField; doc: Doc } | undefined) => {
if (info) {
const doc = info.doc;
@@ -758,7 +786,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
<div className="top-panel"/>
{rendered}
<div className="right-buttons-panel">
- <button className="docCreatorMenu-menu-button section-reveal-options top-right" onPointerDown={e => this.setUpButtonClick(e, () => {this._expandedPreview && this.updateIcons(this._suggestedTemplates.slice()); this.setExpandedView(undefined)})}>
+ <button className="docCreatorMenu-menu-button section-reveal-options top-right" onPointerDown={e => this.setUpButtonClick(e, () => {this._expandedPreview && this.updateIcons(this._suggestedTemplates.map(template => template.mainField.renderedDoc()).slice()); this.setExpandedView(undefined)})}>
<FontAwesomeIcon icon="minimize" />
</button>
<button className="docCreatorMenu-menu-button section-reveal-options top-right-lower" onPointerDown={e => this.setUpButtonClick(e, () => this._expandedPreview && this._templateDocs.push(this._expandedPreview.doc))}>
@@ -797,16 +825,16 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
</div>
) : (
this._suggestedTemplates
- ?.map(doc => ({ icon: ImageCast(doc.icon), doc }))
+ ?.map(template => ({ icon: ImageCast(template.mainField.renderedDoc().icon), doc: template.mainField.renderedDoc(), template: template }))
.filter(info => info.icon && info.doc)
.map(info => (
<div
className="docCreatorMenu-preview-window"
style={{
- border: this._selectedTemplate === info.doc ? `solid 3px ${Colors.MEDIUM_BLUE}` : '',
- boxShadow: this._selectedTemplate === info.doc ? `0 0 15px rgba(68, 118, 247, .8)` : '',
+ border: this._selectedTemplateDoc === info.doc ? `solid 3px ${Colors.MEDIUM_BLUE}` : '',
+ boxShadow: this._selectedTemplateDoc === info.doc ? `0 0 15px rgba(68, 118, 247, .8)` : '',
}}
- onPointerDown={e => this.setUpButtonClick(e, () => runInAction(() => this.updateSelectedTemplate(info.doc)))}>
+ onPointerDown={e => this.setUpButtonClick(e, () => runInAction(() => this.updateSelectedTemplate(info.template)))}>
<button
className="option-button left"
onPointerDown={e =>
@@ -845,7 +873,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
<div className="docCreatorMenu-preview-window empty" onPointerDown={e => this.testTemplate()}>
<FontAwesomeIcon icon="plus" color="rgb(160, 160, 160)" />
</div>
- {this._templateDocs
+ {/* {this._templateDocs
.map(doc => ({ icon: ImageCast(doc.icon), doc }))
.filter(info => info.icon && info.doc)
.map(info => {
@@ -855,8 +883,8 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
<div
className="docCreatorMenu-preview-window"
style={{
- border: this._selectedTemplate === info.doc ? `solid 3px ${Colors.MEDIUM_BLUE}` : '',
- boxShadow: this._selectedTemplate === info.doc ? `0 0 15px rgba(68, 118, 247, .8)` : '',
+ border: this._selectedTemplateDoc === info.doc ? `solid 3px ${Colors.MEDIUM_BLUE}` : '',
+ boxShadow: this._selectedTemplateDoc === info.doc ? `0 0 15px rgba(68, 118, 247, .8)` : '',
}}
onPointerDown={e => this.setUpButtonClick(e, () => runInAction(() => this.updateSelectedTemplate(info.doc)))}>
<button
@@ -880,7 +908,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
<img className="docCreatorMenu-preview-image" src={info.icon!.url.href.replace('.png', '_o.png')} />
</div>
);
- })}
+ })} */}
</div>
</div>
</div>
@@ -1072,7 +1100,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
}
layoutPreviewContents = (outerSpan: number, altLayout?: DataVizTemplateLayout, small: boolean = false, id?: number) => {
- const doc: Doc | undefined = altLayout ? altLayout.template : this._selectedTemplate;
+ const doc: Doc | undefined = altLayout ? altLayout.template : this._selectedTemplateDoc;
if (!doc) return;
return (
@@ -1192,9 +1220,9 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
emptyFunction,
undoable(clickEv => {
clickEv.stopPropagation();
- if (!this._selectedTemplate) return;
+ if (!this._selectedTemplateDoc) return;
const layout: DataVizTemplateLayout = {
- template: this._selectedTemplate,
+ template: this._selectedTemplateDoc,
layout: { type: this._layout.type, xMargin: this._layout.xMargin, yMargin: this._layout.yMargin, repeat: 0 },
columns: this.columnsCount,
rows: this.rowsCount,
@@ -1219,8 +1247,8 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
emptyFunction,
undoable(clickEv => {
clickEv.stopPropagation();
- if (!this._selectedTemplate) return;
- const templateInfo: DataVizTemplateInfo = { doc: this._selectedTemplate, layout: this._layout, referencePos: { x: this._pageX + 450, y: this._pageY }, columns: this.columnsCount };
+ if (!this._selectedTemplateDoc) return;
+ const templateInfo: DataVizTemplateInfo = { doc: this._selectedTemplateDoc, layout: this._layout, referencePos: { x: this._pageX + 450, y: this._pageY }, columns: this.columnsCount };
this._dataViz?.createDocsFromTemplate(templateInfo);
}, 'make docs')
)
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-08 03:58:33 +0000