diff options
Diffstat (limited to 'src')
3 files changed, 48 insertions, 30 deletions
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx index 48f87ebfe..3cdde90d5 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/DocCreatorMenu.tsx @@ -499,14 +499,6 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { */ applyGPTContentToTemplate = async (template: Template, assignments: { [field: string]: Col }): Promise<Template | undefined> => { - const generateAndLoadImage = async (fieldNum: string, col: Col, prompt: string) => { - const url = await this.generateGPTImage(prompt); - const field: Field = template.getFieldByID(Number(fieldNum)); - - field.setContent(url ?? '', FieldContentType.IMAGE); - field.setTitle(col.title); - }; - const GPTTextCalls = Object.entries(assignments).filter(([str, col]) => col.type === TemplateFieldType.TEXT && this._userCreatedFields.includes(col)); const GPTIMGCalls = Object.entries(assignments).filter(([str, col]) => col.type === TemplateFieldType.VISUAL && this._userCreatedFields.includes(col)); @@ -520,24 +512,14 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { await Promise.all(promises); } + console.log(GPTIMGCalls) + 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); - } + const promises = GPTIMGCalls.map(async ([fieldNum, col]) => { + return this.renderGPTImageCall(template, col, Number(fieldNum)); + }); + + await Promise.all(promises); }; return template; @@ -633,6 +615,34 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { }); }; + renderGPTImageCall = async (template: Template, col: Col, fieldNum: number): Promise<boolean> => { + const generateAndLoadImage = async (fieldNum: string, col: Col, prompt: string) => { + const url = await this.generateGPTImage(prompt); + console.log('url: ', url) + const field: Field = template.getFieldByID(Number(fieldNum)); + + field.setContent(url ?? '', FieldContentType.IMAGE); + field.setTitle(col.title); + }; + + let fieldContent: string = template.compiledContent; + + try { + 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); + + await generateAndLoadImage(String(fieldNum), col, prompt); + } catch (e) { + console.log(e); + } + return true; + } + renderGPTTextCall = async (template: Template, col: Col, fieldNum: number): Promise<boolean> => { const wordLimit = (size: TemplateFieldSize) => { switch (size) { @@ -706,7 +716,7 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { field.setContent(content[title]); }); - const gptPromises = this._userCreatedFields.map(field => { + const gptPromises = this._userCreatedFields.filter(field => field.type === TemplateFieldType.TEXT).map(field => { const title = field.title; const templateField = templateCopy.getFieldByTitle(title); if (templateField === undefined) { return }; @@ -714,8 +724,19 @@ export class DocCreatorMenu extends ObservableReactComponent<FieldViewProps> { return this.renderGPTTextCall(templateCopy, field, templatefieldID); }); + + const imagePromises = this._userCreatedFields.filter(field => field.type === TemplateFieldType.VISUAL).map(field => { + const title = field.title; + const templateField = templateCopy.getFieldByTitle(title); + if (templateField === undefined) { return }; + const templatefieldID = templateField.getID; + + return this.renderGPTImageCall(templateCopy, field, templatefieldID); + }); await Promise.all(gptPromises); + + await Promise.all(imagePromises); return templateCopy.getRenderedDoc(); }; diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx index dfef77c0b..e55c127e7 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/FieldTypes/StaticField.tsx @@ -118,8 +118,6 @@ export class StaticField { updateRenderedDoc = (oldDoc?: Doc): Doc => { const opts = this.settings.opts; - console.log('called') - if (!this.contentType) { this.contentType = FieldContentType.STRING }; let doc: Doc; diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx index 11fad3bf1..31402eeeb 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu/Template.tsx @@ -36,9 +36,8 @@ export class Template { this.contentFields.forEach(field => { const title: string = field.getTitle(); const val: FieldType = field.getContent() as FieldType; + if (!title || !val) return; doc[title] = val; - console.log(doc[title]) - console.log(doc['title']); }); return doc; } |