aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/client/apis/gpt/GPT.ts2
-rw-r--r--src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx108
-rw-r--r--src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx8
-rw-r--r--src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx9
-rw-r--r--src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx4
-rw-r--r--src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx5
-rw-r--r--src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateManager.tsx1
7 files changed, 62 insertions, 75 deletions
diff --git a/src/client/apis/gpt/GPT.ts b/src/client/apis/gpt/GPT.ts
index d38e512bd..19f124bf7 100644
--- a/src/client/apis/gpt/GPT.ts
+++ b/src/client/apis/gpt/GPT.ts
@@ -66,7 +66,7 @@ const callTypeMap: { [type: string]: GPTCallOpts } = {
prompt: 'List unique differences between the content of the UserAnswer and Rubric. Before each difference, label it and provide any additional information the UserAnswer missed and explain it in second person without separating it into UserAnswer and Rubric content and additional information. If there are no differences, say correct',
},
template: {
- model: 'gpt-4o-mini',
+ model: 'gpt-4-turbo',
maxTokens: 512,
temp: 0.5,
prompt: 'You will be given a list of field descriptions for multiple templates in the format {field #0: “description”}{field #1: “description”}{...}, and a list of column descriptions in the format {“title”: “description”}{...}. Your job is to match columns with fields based on their descriptions. Your output should be in the following JSON format: {“Template title”:{“#”: “title”, “#”: “title”, “#”: “title” …}, “Template title”:{“#”: “title”, “#”: “title”, “#”: “title” …}} where “Template title” represents the template, # represents the field # and “title” the title of the column assigned to it. A filled out example might look like {“fivefield2”:{“0”:”Name”, “1”:”Image”, “2”:”Caption”, “3”:”Position”, “4”:”Stats”}, “fivefield3”:{0:”Image”, 1:”Name”, 2:”Caption”, 3:”Stats”, 4:”Position”}. Include one object for each template. IT IS VERY IMPORTANT THAT YOU ONLY INCLUDE TEXT IN THE FORMAT ABOVE, WITH NO ADDITIONS WHATSOEVER. Do not include extraneous ‘#’ characters, ‘column’ for columns, or ‘template’ for templates: ONLY THE TITLES AND NUMBERS. There should never be one column assigned to more than one field (ie. if the “name” column is assigned to field 1, it can’t be assigned to any other fields) . Do this for each template whose fields are described. The descriptions are as follows:',
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
index a1de81fa3..405b32e8a 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx
@@ -104,7 +104,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
makeObservable(this);
DocCreatorMenu.Instance = this;
this.templateManager = new TemplateManager(TemplateLayouts.allTemplates);
- //setTimeout(() => this.generateTemplates(''));
}
@action setDataViz = (dataViz: DataVizBox) => {
@@ -264,7 +263,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
}
updateIcons = (docs: Doc[]) => {
- console.log('called')
docs.map(this.getIcon);
};
@@ -593,34 +591,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
}
};
- const renderTextCalls = async (): Promise<Doc[]> => {
- const rendered: Doc[] = [];
-
- if (GPTTextCalls.length) {
- try {
- const prompt = fieldContent + GPTTextAssignment;
-
- const res = await gptAPICall(prompt, GPTCallType.FILL);
-
- if (res) {
- const assignments: { [title: string]: { number: string; content: string } } = JSON.parse(res);
- //console.log('assignments', GPTAssignments, 'assignment string', GPTAssignmentString, 'field content', fieldContent, 'response', res, 'assignments', assignments);
- Object.entries(assignments).forEach(([title, info]) => {
- const field: Field = template.getFieldByID(Number(info.number));
- const col = this.getColByTitle(title);
-
- field.setContent(info.content ?? '', FieldContentType.STRING);
- field.setTitle(col.title);
- });
- }
- } catch (err) {
- console.log(err);
- }
- }
-
- return rendered;
- };
-
const generateAndLoadImage = async (fieldNum: string, col: Col, prompt: string) => {
const url = await this.generateGPTImage(prompt);
const field: Field = template.getFieldByID(Number(fieldNum));
@@ -629,33 +599,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
field.setTitle(col.title);
};
- const renderImageCalls = async (): Promise<Doc[]> => {
- const rendered: Doc[] = [];
- const calls = GPTIMGCalls;
-
- if (calls.length) {
- try {
- await Promise.all(
- calls.map(async ([fieldNum, col]) => {
- const sysPrompt =
- 'Your job is to create a prompt for an AI image generator to help it generate an image based on existing content in a template and a user prompt. Your prompt should focus heavily on visual elements to help the image generator; avoid unecessary info that might distract it. ONLY INCLUDE THE PROMPT, NO OTHER TEXT OR EXPLANATION. The existing content is as follows: ' +
- fieldContent +
- ' **** The user prompt is: ' +
- col.desc;
-
- const prompt = await gptAPICall(sysPrompt, GPTCallType.COMPLETEPROMPT);
-
- generateAndLoadImage(fieldNum, col, prompt);
- })
- );
- } catch (e) {
- console.log(e);
- }
- }
-
- return rendered;
- };
-
const GPTTextCalls = Object.entries(assignments).filter(([str, col]) => col.type === TemplateFieldType.TEXT);
const GPTIMGCalls = Object.entries(assignments).filter(([str, col]) => col.type === TemplateFieldType.VISUAL);
@@ -671,15 +614,50 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
let fieldContent: string = this.templateManager.getContentSummary(template);
- const textCalls = await renderTextCalls();
- const imageCalls = await renderImageCalls();
+ if (GPTTextCalls.length) {
+ try {
+ const prompt = fieldContent + GPTTextAssignment;
- return template;
- };
+ const res = await gptAPICall(prompt, GPTCallType.FILL);
- renderTemplates = (templates: Template[]) => {
+ if (res) {
+ const assignments: { [title: string]: { number: string; content: string } } = JSON.parse(res);
+ //console.log('assignments', GPTAssignments, 'assignment string', GPTAssignmentString, 'field content', fieldContent, 'response', res, 'assignments', assignments);
+ Object.entries(assignments).forEach(([title, info]) => {
+ const field: Field = template.getFieldByID(Number(info.number));
+ const col = this.getColByTitle(title);
- }
+ field.setContent(info.content ?? '', FieldContentType.STRING);
+ field.setTitle(col.title);
+ });
+ }
+ } catch (err) {
+ console.log(err);
+ }
+ }
+
+ if (GPTIMGCalls.length) {
+ try {
+ await Promise.all(
+ GPTIMGCalls.map(async ([fieldNum, col]) => {
+ const sysPrompt =
+ 'Your job is to create a prompt for an AI image generator to help it generate an image based on existing content in a template and a user prompt. Your prompt should focus heavily on visual elements to help the image generator; avoid unecessary info that might distract it. ONLY INCLUDE THE PROMPT, NO OTHER TEXT OR EXPLANATION. The existing content is as follows: ' +
+ fieldContent +
+ ' **** The user prompt is: ' +
+ col.desc;
+
+ const prompt = await gptAPICall(sysPrompt, GPTCallType.COMPLETEPROMPT);
+
+ generateAndLoadImage(fieldNum, col, prompt);
+ })
+ );
+ } catch (e) {
+ console.log(e);
+ }
+ };
+
+ return template;
+ };
compileFieldDescriptions = (templates: Template[]): string => {
let descriptions: string = '';
@@ -723,6 +701,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
if (res && this._callCount === origCount) {
const assignments: { [templateTitle: string]: { [fieldID: string]: string } } = JSON.parse(res);
+ console.log('assignments', assignments)
const brokenDownAssignments: [Template, { [fieldID: number]: Col }][] = [];
Object.entries(assignments).forEach(([tempTitle, assignment]) => {
@@ -733,6 +712,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
const col = this.getColByTitle(colTitle);
if (!this._userCreatedColumns.includes(col)){ // do the following for any fields not added by the user; will change in the future, for now only GPT content works with user-added fields
const field = template.getFieldByID(Number(fieldID));
+ //console.log(field);
field.setContent(col.defaultContent ?? '', col.type === TemplateFieldType.VISUAL ? FieldContentType.IMAGE : FieldContentType.STRING);
field.setTitle(col.title);
} else {
@@ -766,7 +746,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> {
const renderedTemplates: Template[] = await Promise.all(renderedTemplatePromises);
setTimeout(() => {
- this.setGSuggestedTemplates(renderedTemplates.map(template => template.mainField.renderedDoc()));
+ this.setGSuggestedTemplates(templates.map(template => template.mainField.renderedDoc()));
this._GPTLoading = false;
});
};
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx
index f235d3218..c47db2007 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/DynamicField.tsx
@@ -60,13 +60,15 @@ export class DynamicField implements Field {
setupSubfields = (): Field[] => {
const fields: Field[] = [];
- this.settings.subfields?.forEach(fieldSettings => {
+ this.settings.subfields?.forEach((fieldSettings, index) => {
let field: Field;
const dynamicType = fieldSettings.viewType;
- if (dynamicType) { field = new DynamicField(fieldSettings, 0, this); }
+ const id = Number(String(this.id) + String(index));
- field = new StaticField(fieldSettings, this, 0);
+ if (dynamicType) { field = new DynamicField(fieldSettings, id, this); }
+
+ field = new StaticField(fieldSettings, this, id);
fields.push(field);
});
return fields;
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx
index 0f3631858..a0b25485a 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx
@@ -53,6 +53,7 @@ export class StaticField {
setContent = (newContent: string, type: FieldContentType) => {
this.content = newContent;
this.contentType = type;
+ console.log('id: ', this.content)
};
getContent() { return this.content };
@@ -61,14 +62,16 @@ export class StaticField {
setupSubfields = (): Field[] => {
const fields: Field[] = [];
- this.settings.subfields?.forEach(fieldSettings => {
+ this.settings.subfields?.forEach((fieldSettings, index) => {
let field: Field;
const type = fieldSettings.viewType;
+ const id = Number(String(this.id) + String(index));
+
if (type === ViewType.FREEFORM || type === ViewType.CAROUSEL3D) {
- field = new DynamicField(fieldSettings, 0, this);
+ field = new DynamicField(fieldSettings, id, this);
} else {
- field = new StaticField(fieldSettings, this, 0);
+ field = new StaticField(fieldSettings, this, id);
};
fields.push(field);
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx
index 708170359..69f5cfb81 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx
@@ -24,7 +24,7 @@ export class Template {
}
setupMainField = (templateInfo: FieldSettings) => {
- return new DynamicField(templateInfo, 0);
+ return new DynamicField(templateInfo, 1);
}
isValidTemplate = (cols: Col[]) => {
@@ -56,8 +56,6 @@ export class Template {
const used: boolean[] = Array(fieldsCt).fill(false);
const mt: number[] = Array(fieldsCt).fill(-1);
- console.log(matches, fieldsCt);
-
const augmentingPath = (v: number): boolean => {
if (used[v]) return false;
used[v] = true;
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx
index a23c3ba3d..166d27228 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx
@@ -21,6 +21,7 @@ export class TemplateLayouts {
}
public static FourField001: FieldSettings = {
+ title: 'fourfield001',
tl: [0, 0],
br: [416, 700],
viewType: ViewType.FREEFORM,
@@ -90,6 +91,7 @@ export class TemplateLayouts {
};
public static FourField002: FieldSettings = {
+ title: 'fourfield002',
viewType: ViewType.FREEFORM,
tl: [0,0],
br: [425, 778],
@@ -260,6 +262,7 @@ export class TemplateLayouts {
// };
public static FourField004: FieldSettings = {
+ title: 'fourfield04',
viewType: ViewType.FREEFORM,
tl: [0,0],
br: [414,583],
@@ -336,6 +339,7 @@ export class TemplateLayouts {
};
public static ThreeField001: FieldSettings = {
+ title: 'threefield001',
viewType: ViewType.FREEFORM,
tl: [0,0],
br: [575, 770],
@@ -420,6 +424,7 @@ export class TemplateLayouts {
};
public static ThreeField002: FieldSettings = {
+ title: 'threefield002',
viewType: ViewType.FREEFORM,
tl: [0,0],
br: [477, 662],
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateManager.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateManager.tsx
index 535bd423f..d47ae802c 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateManager.tsx
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateManager.tsx
@@ -30,7 +30,6 @@ export class TemplateManager {
}
getValidTemplates = (cols: Col[]): Template[] => {
- console.log(this.templates.filter(template => template.isValidTemplate(cols)));
return this.templates.filter(template => template.isValidTemplate(cols));
}
} \ No newline at end of file